220 lines
5.5 KiB
HTML
220 lines
5.5 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
|
|
<meta charset="utf-8">
|
|
<link rel="icon" href="/static/favicon.ico">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
|
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
|
|
|
|
<link rel="stylesheet" href="templates/style.css">
|
|
|
|
<title>Litechan</title>
|
|
</head>
|
|
|
|
<body style="min-width:1200px">
|
|
<style>.liteBorder {
|
|
border-style: solid;
|
|
border-width: 20px 5px 0px 5px;
|
|
border-color: #ecddbe;
|
|
|
|
border-radius: 10px;
|
|
max-width: 1000px;
|
|
max-height: 80%;
|
|
min-width: 900px;
|
|
|
|
font-family: "Calibri", sans-serif;
|
|
}
|
|
|
|
.postFeed {
|
|
border-style: solid;
|
|
border-width: 0px 0px 0px 5px;
|
|
border-color: #ecddbe;
|
|
|
|
border-bottom-left-radius: 10px;
|
|
}</style>
|
|
|
|
<style>
|
|
/* Dropdown Button */
|
|
.dropbtn {
|
|
background-color: #fbf2e0;
|
|
color: black;
|
|
padding: 0px 4px 0px 4px;
|
|
font-size: 16px;
|
|
border: none;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
/* The container <div> - needed to position the dropdown content */
|
|
.dropdown {
|
|
position: relative;
|
|
display: inline-block;
|
|
}
|
|
|
|
/* Dropdown Content (Hidden by Default) */
|
|
.dropdown-content {
|
|
display: none;
|
|
position: absolute;
|
|
background-color: #f1f1f1;
|
|
min-width: 160px;
|
|
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
|
z-index: 1;
|
|
}
|
|
|
|
/* Links inside the dropdown */
|
|
.dropdown-content a {
|
|
color: black;
|
|
padding: 12px 12px;
|
|
text-decoration: none;
|
|
display: block;
|
|
}
|
|
|
|
/* Change color of dropdown links on hover */
|
|
.dropdown-content a:hover {background-color: #ddd;}
|
|
|
|
/* Show the dropdown menu on hover */
|
|
.dropdown:hover .dropdown-content {display: block;}
|
|
|
|
/* Change the background color of the dropdown button when the dropdown content is shown */
|
|
.dropdown:hover .dropbtn {background-color: #fff;}
|
|
</style>
|
|
|
|
<style>
|
|
p, span, td {font-family: Calibri;}
|
|
table
|
|
{
|
|
table-layout: fixed;
|
|
width: 100%;
|
|
}
|
|
span
|
|
{
|
|
overflow-wrap: anywhere;
|
|
}
|
|
.emoji {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
|
|
p {
|
|
margin: 0;
|
|
}
|
|
|
|
a:link {
|
|
color: #7c7c7c;
|
|
background-color: transparent;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:visited {
|
|
color: #7c7c7c;
|
|
background-color: transparent;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:hover {
|
|
color: red;
|
|
background-color: transparent;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:active {
|
|
color: #7c7c7c;
|
|
background-color: transparent;
|
|
text-decoration: none;
|
|
}
|
|
.post {
|
|
margin-left:auto;
|
|
margin-right:auto;
|
|
padding: 10px 5px 0px 5px;
|
|
padding-top:10px;
|
|
background:#ecddbe;
|
|
border-radius: 10px 10px 10px 10px;
|
|
}
|
|
.posttable {
|
|
width: 100%;
|
|
font: 12pt calibri;
|
|
}
|
|
.postname {
|
|
font: 13pt calibri
|
|
}
|
|
.postbody {
|
|
font: 12pt calibri
|
|
}
|
|
|
|
</style>
|
|
<div class="row justify-content-center p-3 pt-5" style="min-width:900px;">
|
|
<img src="{{url_for('static', filename='header.jpg')}}" alt="litechan header, withe the litechan girl looking back at you"
|
|
style="max-height: 140px; max-width: 570px;">
|
|
</div>
|
|
<!-- header image -->
|
|
|
|
<div class="row justify-content-center">
|
|
<div class="liteBorder">
|
|
<div class="row">
|
|
<p class="h1 col-10 text-center" style="max-width:60%;">Boards</p>
|
|
|
|
<div class="col-2" style="background-color: #ecddbe;min-width:40%;"></div>
|
|
|
|
<div class="container col-10" style="max-width:60%;">
|
|
<div class="row">
|
|
<div class="col-6 h2 text-center py-5">
|
|
Unsorted <br> <a href="/ran/"
|
|
rel="noopener noreferrer">/ran/</a>
|
|
</div>
|
|
<div class="col-6 h2 text-center py-5">
|
|
NSFW <br> <a href="/nsfw/"
|
|
rel="noopener noreferrer">/nsfw/</a>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-6 h2 text-center py-5">
|
|
Hobbies <br> <a href="/vid/"
|
|
rel="noopener noreferrer">/vid/</a>
|
|
</div>
|
|
<div class="col-6 h2 text-center py-5">
|
|
<!-- fourth category goes here if you get one -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-2 postFeed" style="min-width: 40%;">
|
|
{% for p in preview %}
|
|
<div style="bgcolor: #ecddbe">
|
|
<table style="padding: 10px 0px; bgcolor: #fff" border=0>
|
|
<colgroup>
|
|
<col span="1" style="width: 100px;">
|
|
<col span="1" style="width: 100%;">
|
|
<col span="1" style="width: 50px;">
|
|
</colgroup>
|
|
<tbody>
|
|
<tr>
|
|
<td><img src="{{ p.thumbnail }}" style="width:100%;max-width:100px;max-height:100px;object-fit:contain;border-radius:15px"></td>
|
|
<td><p style="padding:10px;">{{ p.text }}</p></td>
|
|
<td><p><a href="/{{ p.board|default('ran') }}/{{ p.thread|default(p.id - 1) }}">#{{ p.id }}</a></p></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<!-- main container -->
|
|
</div>
|
|
<!-- container for centering main container -->
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
|
|
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
|
|
crossorigin="anonymous"></script>
|
|
|
|
</body>
|
|
|
|
</html>
|