style
This commit is contained in:
Tyrel Souza
parent
999db82437
commit
f3670813f6
|
|
@ -1,13 +1,10 @@
|
|||
* { margin: 0; padding: 0; }
|
||||
dd { margin-left: 23px }
|
||||
|
||||
/* *** General Styles *** */
|
||||
|
||||
body {
|
||||
background: url(../images/background.jpg);
|
||||
background: url(../images/concrete.webp);
|
||||
color: #293331;
|
||||
font: 16px Georgia, "Times New Roman", Times, serif;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
pre { font-size:12px }
|
||||
|
|
@ -51,175 +48,229 @@ ol {
|
|||
line-height: 1.6em;
|
||||
}
|
||||
|
||||
/* *** Layout *** */
|
||||
|
||||
#container {
|
||||
background: url(../images/spill.gif) no-repeat top right;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
width: 780px;
|
||||
}
|
||||
|
||||
#header {
|
||||
background: url(../images/header.gif) no-repeat;
|
||||
height: 109px;
|
||||
padding: 0 10px 0 20px;
|
||||
}
|
||||
|
||||
#topMenu {
|
||||
background: url(../images/menubar.gif) no-repeat;
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
float: right;
|
||||
padding: 20px 30px 10px 0;
|
||||
text-align: right;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
#mainContent {
|
||||
background: url(../images/body.gif) repeat-y;
|
||||
padding: 20px 250px 10px 40px;
|
||||
}
|
||||
|
||||
#footer {
|
||||
background: url(../images/bottom.gif) no-repeat;
|
||||
font-size: 14px;
|
||||
height: 70px;
|
||||
padding: 0 10px 0 20px;
|
||||
}
|
||||
|
||||
/* *** Header Styles *** */
|
||||
|
||||
#header h1 {
|
||||
font-size: 48px;
|
||||
font-weight: normal;
|
||||
padding: 20px 0 0 170px;
|
||||
}
|
||||
|
||||
#header h2 {
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#header a:hover {
|
||||
background: none;
|
||||
}
|
||||
|
||||
/* *** Top Menu Styles *** */
|
||||
|
||||
#topMenu ul {
|
||||
font-size: 26px;
|
||||
line-height: 1em;
|
||||
list-style: none;
|
||||
padding: 14px 30px 0 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#topMenu li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
#topMenu a:hover {
|
||||
background: url(../images/hr.gif) center center no-repeat;
|
||||
}
|
||||
|
||||
/* *** Blog Styles *** */
|
||||
|
||||
.blogItem {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.blogItem h2,
|
||||
.blogItem h3 {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.blogItem h2 a:hover,
|
||||
.blogItem h3 a:hover {
|
||||
background: none;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.blogItem h2 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.blogItem h3 {
|
||||
background: url(../images/hr.gif) bottom left no-repeat;
|
||||
font-size: 18px;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
|
||||
.blogItem h3.blogMeta {
|
||||
background-position: top left;
|
||||
padding: 6px 0 0 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* *** Sidebar Styles *** */
|
||||
|
||||
#sidebar h3 {
|
||||
font-size: 24px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#sidebar ul {
|
||||
line-height: 1.8em;
|
||||
list-style: none;
|
||||
padding-bottom: 20px;
|
||||
line-height: 1.8em;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#sidebar ul a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* *** Comments Styles *** */
|
||||
|
||||
#comments {
|
||||
margin: 20px 0 0 20px;
|
||||
}
|
||||
|
||||
#comments li {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.commentSep {
|
||||
background: url(../images/hr.gif) bottom left no-repeat;
|
||||
}
|
||||
|
||||
/* *** Footer Styles *** */
|
||||
|
||||
#footer p {
|
||||
padding: 30px 0 0 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.floatR, .align-right {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.floatL, .align-left {
|
||||
float: left;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.clearfloat {
|
||||
clear:both;
|
||||
height:0;
|
||||
font-size: 1px;
|
||||
line-height: 0px;
|
||||
#topmenu ul li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
div.figure img {
|
||||
max-width: 100%;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
|
||||
#site-notes {
|
||||
margin-top: 3rem;
|
||||
@media screen and (min-width: 900px) {
|
||||
* { margin: 0; padding: 0; }
|
||||
body {
|
||||
text-align: center;
|
||||
}
|
||||
/* *** Layout *** */
|
||||
#container {
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
width: 780px;
|
||||
}
|
||||
|
||||
#header {
|
||||
background: url(../images/header.gif) no-repeat;
|
||||
height: 109px;
|
||||
padding: 0 10px 0 20px;
|
||||
}
|
||||
|
||||
#topMenu {
|
||||
background: url(../images/menubar.gif) no-repeat;
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
float: right;
|
||||
padding: 20px 30px 10px 0;
|
||||
text-align: right;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
#mainContent {
|
||||
background: url(../images/body.gif) repeat-y;
|
||||
padding: 20px 250px 10px 40px;
|
||||
}
|
||||
|
||||
#footer {
|
||||
background: url(../images/bottom.gif) no-repeat;
|
||||
font-size: 14px;
|
||||
height: 70px;
|
||||
padding: 0 10px 0 20px;
|
||||
}
|
||||
|
||||
/* *** Header Styles *** */
|
||||
|
||||
#header h1 {
|
||||
font-size: 48px;
|
||||
font-weight: normal;
|
||||
padding: 20px 0 0 170px;
|
||||
}
|
||||
|
||||
#header h2 {
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#header a:hover {
|
||||
background: none;
|
||||
}
|
||||
|
||||
/* *** Top Menu Styles *** */
|
||||
|
||||
#topMenu ul {
|
||||
font-size: 26px;
|
||||
line-height: 1em;
|
||||
padding: 14px 30px 0 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#topMenu li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
#topMenu a:hover {
|
||||
background: url(../images/hr.gif) center center no-repeat;
|
||||
}
|
||||
|
||||
/* *** Blog Styles *** */
|
||||
|
||||
.blogItem {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.blogItem h2,
|
||||
.blogItem h3 {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.blogItem h2 a:hover,
|
||||
.blogItem h3 a:hover {
|
||||
background: none;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.blogItem h2 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.blogItem h3 {
|
||||
background: url(../images/hr.gif) bottom left no-repeat;
|
||||
font-size: 18px;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
|
||||
.blogItem h3.blogMeta {
|
||||
background-position: top left;
|
||||
padding: 6px 0 0 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* *** Sidebar Styles *** */
|
||||
|
||||
#sidebar h3 {
|
||||
font-size: 24px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#sidebar ul {
|
||||
line-height: 1.8em;
|
||||
list-style: none;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
#sidebar ul a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* *** Comments Styles *** */
|
||||
|
||||
#comments {
|
||||
margin: 20px 0 0 20px;
|
||||
}
|
||||
|
||||
#comments li {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.commentSep {
|
||||
background: url(../images/hr.gif) bottom left no-repeat;
|
||||
}
|
||||
|
||||
/* *** Footer Styles *** */
|
||||
|
||||
#footer p {
|
||||
padding: 30px 0 0 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.floatR, .align-right {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.floatL, .align-left {
|
||||
float: left;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.clearfloat {
|
||||
clear:both;
|
||||
height:0;
|
||||
font-size: 1px;
|
||||
line-height: 0px;
|
||||
}
|
||||
|
||||
|
||||
#site-notes {
|
||||
margin-top: 3rem;
|
||||
|
||||
}
|
||||
#sidebar-mobile {
|
||||
display:none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
body {
|
||||
padding:1rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
background: url(../images/hr.gif) top center no-repeat;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
display:none;
|
||||
}
|
||||
|
||||
#mainContent dl {
|
||||
}
|
||||
|
||||
#mainContent dt {
|
||||
font-size: 75%;
|
||||
}
|
||||
|
||||
#sidebar-mobile {
|
||||
background: url(../images/hr.gif) top center no-repeat;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
#sidebar-mobile ul {
|
||||
line-height: 1.8em;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#sidebar-mobile ul li {
|
||||
display:inline;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
BIN
themes/waterspill-en/static/images/concrete.webp
Normal file
BIN
themes/waterspill-en/static/images/concrete.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
|
|
@ -31,17 +31,13 @@
|
|||
</div><!-- end #header -->
|
||||
|
||||
<div id="topMenu">
|
||||
|
||||
<ul>
|
||||
{% for item in BEFORE_MENU %}
|
||||
<li><a href="{{ item.url }}">{{ item.name }}</li>
|
||||
<li>–</li>
|
||||
{% endfor %}
|
||||
<li><a href="{{ SITEURL }}/index.html">Home</a></li>
|
||||
<li>–</li>
|
||||
<li><a href="{{ SITEURL }}/archives.html">Archives</a></li>
|
||||
{% for item in AFTER_MENU %}
|
||||
<li>–</li>
|
||||
<li><a href="{{ item.url }}">{{ item.name }}</li>
|
||||
{% endfor %}
|
||||
|
||||
|
|
@ -124,6 +120,69 @@
|
|||
<p>Proudly powered by <a href="http://getpelican.com">pelican</a>, which takes great advantages of <a href="http://python.org">python</a>.
|
||||
</div><!-- end #footer -->
|
||||
|
||||
<div id="sidebar-mobile">
|
||||
<ul>
|
||||
{% if DISPLAY_PAGES_ON_MENU %}
|
||||
<li>
|
||||
<h3>Pages</h3>
|
||||
<ul>
|
||||
{% for page in pages %}
|
||||
<li><a href="{{ SITEURL }}/{{ page.url }}">{{ page.title }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if LINKS %}
|
||||
<li>
|
||||
<h3>External Links</h3>
|
||||
<ul>
|
||||
{% for name, link in LINKS %}
|
||||
<li><a href="{{ link }}">{{ name }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if not SUPPRESS_CATEGORIES_ON_MENU %}
|
||||
<li>
|
||||
<h3>Categories</h3>
|
||||
<ul>
|
||||
{% for cat, null in categories %}
|
||||
<li {% if cat == category %}class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if SOCIAL %}
|
||||
<li>
|
||||
<h3>Social</h3>
|
||||
<ul>
|
||||
{% if FEED_ATOM %}
|
||||
<li><a href="{{ SITEURL }}/{{ FEED_ATOM }}" rel="alternate">Atom feed</a></li>
|
||||
{% endif %}
|
||||
{% if FEED_RSS %}
|
||||
<li><a href="{{ SITEURL }}/{{ FEED_RSS }}" rel="alternate">Flux Rss</a></li>
|
||||
{% endif %}
|
||||
{% for name, link in SOCIAL %}
|
||||
<li><a href="{{ link }}">{{ name }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li><!-- /.social -->
|
||||
{% endif %}
|
||||
{% if tags %}
|
||||
<li>
|
||||
<h3>Tags</h3>
|
||||
<ul>
|
||||
{% for tag, articles in tags %}
|
||||
<li><a href="{{ SITEURL }}/{{ tag.url }}">{{ tag }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div><!-- end #sidebar -->
|
||||
|
||||
|
||||
|
||||
</div><!-- end #container -->
|
||||
{% include 'analytics.html' %}
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user