mirror_php/Tinyboard
1
0
Fork 0
mirror of https://github.com/Circlepuller/Tinyboard.git synced 2025-01-17 21:39:27 +01:00
Code Issues Projects Releases Wiki Activity

CSS/HTML fixes (flexboxes everywhere)

Browse Source
This commit is contained in:
Daniel Saunders 2017-10-29 01:42:57 -04:00
parent 5ba68d8793
commit afe676b1b8
2 changed files with 51 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
templates/themes/awsumchan/index.html
View File

@ -55,38 +55,42 @@
</div>
<div class="box-wrap">
<div class="box left">
<h2>Recent Images</h2>
<ul>
{% for post in recent_images %}
<li>
<a href="{{ post.link }}">
<img src="{{ post.src }}" style="width:{{ post.thumbwidth }}px;height:{{ post.thumbheight }}px" alt="">
</a>
</li>
{% endfor %}
</ul>
<div class="left-column">
<div class="box">
<h2>Recent Images</h2>
<ul>
{% for post in recent_images %}
<li>
<a href="{{ post.link }}">
<img src="{{ post.src }}" style="width:{{ post.thumbwidth }}px;height:{{ post.thumbheight }}px" alt="">
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
<div class="box right">
<h2>Latest Posts</h2>
<ul>
{% for post in recent_posts %}
<li>
<strong>{{ post.board_name }}</strong>:
<a href="{{ post.link }}">
{{ post.snippet }}
</a>
</li>
{% endfor %}
</ul>
</div>
<div class="box right">
<h2>Stats</h2>
<ul>
<li>Total posts: {{ stats.total_posts }}</li>
<li>Unique posters: {{ stats.unique_posters }}</li>
<li>Active content: {{ stats.active_content|filesize }}</li>
</ul>
<div class="right-column">
<div class="box">
<h2>Latest Posts</h2>
<ul>
{% for post in recent_posts %}
<li>
<strong>{{ post.board_name }}</strong>:
<a href="{{ post.link }}">
{{ post.snippet }}
</a>
</li>
{% endfor %}
</ul>
</div>
<div class="box">
<h2>Stats</h2>
<ul>
<li>Total posts: {{ stats.total_posts }}</li>
<li>Unique posters: {{ stats.unique_posters }}</li>
<li>Active content: {{ stats.active_content|filesize }}</li>
</ul>
</div>
</div>
</div>

23
templates/themes/awsumchan/recent.css
View File

@ -1,17 +1,26 @@
.box-wrap {
max-width: 670px;
max-width: 700px;
min-width: 332px;
margin: 30px auto;
margin: 0 auto;
overflow: auto;
padding: 0;
display: flex;
}
.left-column {
align-self: flex-start;
}
.right-column {
margin-left: auto;
}
.box {
background: white;
border: 1px solid #98E;
width: 330px;
margin: 8px 0;
margin: 30px 0;
margin-top: 0;
padding: 0;
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
flex: 1;
}
.box ul {
padding: 2px 15px;
@ -20,13 +29,13 @@
list-style: none;
margin: 0;
}
.box.left {
.left-column .box {
background: #efe;
color: #060;
border: 1px solid #060;
float: left;
}
.box.right {
.right-column .box {
background: #eef;
color: #006;
border: 1px solid #006;
@ -37,11 +46,11 @@
padding: 3px 7px;
font-size: 12pt;
}
.box.left h2 {
.left-column .box h2 {
background: #9C6;
color: #060;
}
.box.right h2 {
.right-column .box h2 {
background: #59A;
color: white;
}