diff options
-rw-r--r-- | dev-random/static/css/main.css | 55 | ||||
-rw-r--r-- | dev-random/static/css/skeleton.css | 97 | ||||
-rw-r--r-- | dev-random/templates/base.html | 10 | ||||
-rw-r--r-- | dev-random/templates/includes/sidebar.html | 2 |
4 files changed, 89 insertions, 75 deletions
diff --git a/dev-random/static/css/main.css b/dev-random/static/css/main.css index 7978af3..aaccde6 100644 --- a/dev-random/static/css/main.css +++ b/dev-random/static/css/main.css @@ -5,25 +5,7 @@ /******************************************************************************/ -article, section, -header, footer, -aside, nav { - display: block; -} - -html { - width: 100%; - height: 100%; - margin: 0; - padding: 0; -} - body { - width: 100%; - height: 100%; - margin: 0; - padding: 0; - min-width: 750px; background-color: white; color: #101010; @@ -47,7 +29,6 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; - text-decoration: inherit; } @@ -83,6 +64,30 @@ pre { overflow: auto; } +table { + border-collapse: collapse; + border-spacing: 0; + border-radius: 4px; +} + +table th { + font-weight: bolder; + margin: .6em .5em; +} + +table td { + margin: .4em .5em; +} + +table th, +table td { + border: thin dashed silver; +} + +table tr { + border: thin solid silver; +} + /******************************************************************************/ @@ -90,7 +95,7 @@ pre { /******************************************************************************/ -.page .head h1 { +.page-head h1 { margin: .7em auto; font-family: Georgia, "Times New Roman", Times, serif; @@ -107,12 +112,12 @@ pre { font-variant: small-caps; } -.content #page-title { +.page-content #page-title { font-size: .9em; } -.content .post { +.page-content .post { clear: both; margin: 1em 0 3em 0; } @@ -194,6 +199,12 @@ pre { margin-right: auto; } +#pagination { + display: block; + clear: both; + text-align: center; +} + /******************************************************************************/ diff --git a/dev-random/static/css/skeleton.css b/dev-random/static/css/skeleton.css index 02010f7..bcc9eba 100644 --- a/dev-random/static/css/skeleton.css +++ b/dev-random/static/css/skeleton.css @@ -1,68 +1,71 @@ +article, section, +header, footer, +aside, nav { + display: block; +} + +body, .page { + margin: 0; + padding: 0; +} + .page { - display: block; - margin-top: 5%; + display: block; + margin: 2% 4%; } -.page .head, -.page .main, -.page .foot { +.page-head, +.page-footer { display: block; width: 100%; clear: both; } -.page .main { - display: table; - border-collapse: separate; - border-spacing: .5%; - width: 75%; - margin: .5em auto; - clear: both; +.page-content { + display: block; + float: right; + margin-left: 1%; + margin-right: 1%; + width: 68%; } -.page .main .sidebar { - display: table-cell; - width: 25%; +.page-sidebar { + display: block; + margin-left: 1%; + margin-right: 1%; + width: 28%; + float: left; } -.page .main .content { - display: table-cell; - width: 74%; +img, table, pre { + max-width: 98%; + margin: 1em 1%; + overflow: auto; } -@media screen and (max-width: 800px) { - .page .main { - width: 100%; - clear: both; - } +@media screen and (min-width: 800px) { + .page { margin: 5% 10%; } } -@media screen and (max-width: 700px) { - .page .main { - display: block; - } - - .page .main .sidebar, - .page .main .content { - display: block; - margin: 0 .5em; - width: 100%; - clear: both; - } - - .widget { - display: block; - } - - .widget ul, - .widget li { - display: inline; - } - - .widget h3 { display: none; } +@media screen and (max-width: 600px) { + .page { margin: 0; } + .page-content, + .page-sidebar { + width: 98%; + clear: both; + } } @media print { - .sidebar { display: none; } + .page { margin: 0; } + .page-content { + width: 98%; + clear: both; + } + .page-head, + .page-footer, + .page-sidebar { + display: none; + } } diff --git a/dev-random/templates/base.html b/dev-random/templates/base.html index 1424ca4..d9dd46a 100644 --- a/dev-random/templates/base.html +++ b/dev-random/templates/base.html @@ -42,21 +42,21 @@ {% endif %} {% endblock headers %} </head> - <body> + <body> <div class="page"> - <header class="head"> + <header class="page-head"> <h1> <a href="{{ SITEURL }}/index.html">{{ SITENAME }}</a> </h1> </header> - <div class="main"> - {% include "includes/sidebar.html" %} + <div class="page-content"> {% block content %} {% endblock content %} </div> + {% include "includes/sidebar.html" %} - <footer class="foot"> + <footer class="page-footer"> <p> {{ FOOTER_TEXT or 'Powered by <a href="http://pelican.readthedocs.org">Pelican</a>' }}</p> {% if GITHUB_URL %}<p><a id="github-link" href="{{ GITHUB_URL}}">Fork me on Github</a></p>{% endif %} </footer> diff --git a/dev-random/templates/includes/sidebar.html b/dev-random/templates/includes/sidebar.html index 3c42ef9..803ae08 100644 --- a/dev-random/templates/includes/sidebar.html +++ b/dev-random/templates/includes/sidebar.html @@ -1,4 +1,4 @@ - <aside class="sidebar"> + <aside class="page-sidebar"> <nav class="widget"> <h3>Site</h3> <ul> |