diff options
-rw-r--r-- | dev-random/screenshot.png | bin | 61791 -> 61326 bytes | |||
-rw-r--r-- | dev-random/static/css/main.css | 66 | ||||
-rw-r--r-- | dev-random/static/css/skeleton.css | 68 | ||||
-rw-r--r-- | dev-random/templates/archives.html | 2 | ||||
-rw-r--r-- | dev-random/templates/article.html | 2 | ||||
-rw-r--r-- | dev-random/templates/base.html | 59 | ||||
-rw-r--r-- | dev-random/templates/categories.html | 2 | ||||
-rw-r--r-- | dev-random/templates/includes/sidebar.html | 46 | ||||
-rw-r--r-- | dev-random/templates/index.html | 2 | ||||
-rw-r--r-- | dev-random/templates/page.html | 2 | ||||
-rw-r--r-- | dev-random/templates/tags.html | 2 |
11 files changed, 145 insertions, 106 deletions
diff --git a/dev-random/screenshot.png b/dev-random/screenshot.png Binary files differindex 5ce64c4..a1e468b 100644 --- a/dev-random/screenshot.png +++ b/dev-random/screenshot.png diff --git a/dev-random/static/css/main.css b/dev-random/static/css/main.css index 29818cb..7978af3 100644 --- a/dev-random/static/css/main.css +++ b/dev-random/static/css/main.css @@ -84,73 +84,21 @@ pre { } -/******************************************************************************/ -/* Page Structure */ -/******************************************************************************/ - -#page-header { - width: 60%; - margin: 1em auto 1em auto; - - text-align: center; -} - - -#page-menu { - width: 100%; - margin: 0 0 2em 0; - padding: .2em 0em; - - border-bottom: thin dashed gray; - - text-align: center; -} - - -#page-content { - display: block; - width: 75%; - margin-left: auto; - margin-right: auto; -} - - -#page-footer { - width: 100%; - margin-top: 2em; - - border-top: thin dashed gray; - - font-size: .7em; - font-weight: lighter; -} - /******************************************************************************/ /* Specific Styles */ /******************************************************************************/ -#page-header h1 { - margin: .2em auto .2em auto; +.page .head h1 { + margin: .7em auto; font-family: Georgia, "Times New Roman", Times, serif; font-size: 2.8em; + text-align: center; } -#page-menu ul { - display: inline; - margin: 0; - padding: 0; - - list-style-type: none; -} - -#page-menu ul li { - display: inline; -} - -#page-menu ul li a { +.widget ul li { margin: .1em .4em; font-size: 0.8em; @@ -159,12 +107,12 @@ pre { font-variant: small-caps; } -#page-content #page-title { +.content #page-title { font-size: .9em; } -.post { +.content .post { clear: both; margin: 1em 0 3em 0; } @@ -237,7 +185,7 @@ pre { } -#page-footer p { +.page .foot p { display: block; width: 60%; diff --git a/dev-random/static/css/skeleton.css b/dev-random/static/css/skeleton.css new file mode 100644 index 0000000..02010f7 --- /dev/null +++ b/dev-random/static/css/skeleton.css @@ -0,0 +1,68 @@ + +.page { + display: block; + margin-top: 5%; +} + +.page .head, +.page .main, +.page .foot { + display: block; + width: 100%; + clear: both; +} + +.page .main { + display: table; + border-collapse: separate; + border-spacing: .5%; + width: 75%; + margin: .5em auto; + clear: both; +} + +.page .main .sidebar { + display: table-cell; + width: 25%; +} + +.page .main .content { + display: table-cell; + width: 74%; +} + +@media screen and (max-width: 800px) { + .page .main { + width: 100%; + clear: both; + } +} + +@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 print { + .sidebar { display: none; } +} diff --git a/dev-random/templates/archives.html b/dev-random/templates/archives.html index 520d5ed..1ba36dd 100644 --- a/dev-random/templates/archives.html +++ b/dev-random/templates/archives.html @@ -3,7 +3,7 @@ {% block content_title %}{{ SITENAME }} — Archives{% endblock %} {%- block content %} - <section id="page-content"> + <section class="content"> <h1>Archives</h1> <dl> {% for article in articles %} diff --git a/dev-random/templates/article.html b/dev-random/templates/article.html index d85c7c5..ab5679c 100644 --- a/dev-random/templates/article.html +++ b/dev-random/templates/article.html @@ -9,7 +9,7 @@ {% block title %}{{ article.title }} — {{ super() }}{% endblock %} {%- block content %} - <article class="post" id="page-content"> + <article class="post content"> <header class="post-header"> <time datetime="{{ article.date.isoformat() }}" pubdate="pubdate"> {{ article.locale_date }} diff --git a/dev-random/templates/base.html b/dev-random/templates/base.html index 1edab44..1424ca4 100644 --- a/dev-random/templates/base.html +++ b/dev-random/templates/base.html @@ -4,7 +4,8 @@ {% block headers %} <meta charset="utf-8" /> <title>{% block title %}{{ SITENAME }}{%endblock%}</title> - <link rel="stylesheet" type="text/css" href="{{ SITEURL }}/theme/css/{{ CSS_FILE }}" /> + <link rel="stylesheet" type="text/css" href="{{ SITEURL }}/theme/css/skeleton.css" /> + <link rel="stylesheet" type="text/css" href="{{ SITEURL }}/theme/css/main.css" /> <link rel="shortcut icon" type="text/css" href="{{ SITEURL }}/favicon.ico" /> <link rel="alternate" type="application/atom+xml" title="{{ SITENAME }} — Flux Atom" @@ -42,47 +43,23 @@ {% endblock headers %} </head> <body> - <!--[if lt IE 7]> - <div style="font-size: small; background-color: black; color: white; position: fixed; bottom: 0; left: 0; right: 0;border-bottom: 1px solid gray; padding: 2px 5px;" - id="outdated">Il est recommandé d'utiliser un navigateur Web - moderne, comme <a href="http://www.mozilla.com/firefox/">Mozilla - Firefox</a> ou <a href="http://www.google.com/chrome/">Google - Chrome</a> pour voir ce site - </div> - <![endif]--> - <header id="page-header"> - <h1> - <a href="{{ SITEURL }}/index.html">{{ SITENAME }}</a> - </h1> - </header> + <div class="page"> + <header class="head"> + <h1> + <a href="{{ SITEURL }}/index.html">{{ SITENAME }}</a> + </h1> + </header> - <nav id="page-menu"> - <ul> - <li><a href="{{ SITEURL }}/index.html">Accueil</a></li> - {% for title, link in MENUITEMS %} - <li><a href="{{ link|format(SITEURL) }}">{{ title }}</a></li> - {% endfor %} - {% if DISPLAY_PAGES_ON_MENU %} - <li><a href="{{ SITEURL }}/categories.html">Catégories</a></li> - {% for p in PAGES %} - <li {% if p == page %}class="active"{% endif %}><a href="{{ SITEURL }}/{{ p.url|e }}">{{ p.title }}</a></li> - {% endfor %} - {% else %} - {% for cat, null in categories %} - <li {% if cat == category %}class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url|e }}">{{ cat }}</a></li> - {% endfor %} - {% endif %} - <li><a href="{{ SITEURL }}/archives.html">Archives</a></li> - <li><a href="{{ SITEURL }}/tags.html">Mots-clés</a></li> - </ul> - </nav> - - {% block content %} - {% endblock content %} + <div class="main"> + {% include "includes/sidebar.html" %} + {% block content %} + {% endblock content %} + </div> - <footer id="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> + <footer class="foot"> + <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> + </div> </body> </html> diff --git a/dev-random/templates/categories.html b/dev-random/templates/categories.html index ca9a7b1..0a5b0f4 100644 --- a/dev-random/templates/categories.html +++ b/dev-random/templates/categories.html @@ -3,7 +3,7 @@ {% block title %}{{ super() }} — Catégories{% endblock title %} {%- block content %} - <section id="page-content"> + <section class="content"> <h1>Catégories</h1> <ul id="category-list"> {% for category, n in categories %} diff --git a/dev-random/templates/includes/sidebar.html b/dev-random/templates/includes/sidebar.html new file mode 100644 index 0000000..3c42ef9 --- /dev/null +++ b/dev-random/templates/includes/sidebar.html @@ -0,0 +1,46 @@ + <aside class="sidebar"> + <nav class="widget"> + <h3>Site</h3> + <ul> + <li><a href="{{ SITEURL }}">Accueil</a></li> + <li><a href="{{ SITEURL }}/archives.html">Archives</a></li> + <li><a href="{{ SITEURL }}/tags.html">Mots-clés</a></li> + {% if MENUITEMS %} + {% for name, uri in MENUITEMS %} + <li><a href="{{ uri|format(SITEURL)|e}}">{{ name }}</a></li> + {% endfor %} + {% endif %} + {% if DISPLAY_PAGES_ON_MENU %} + {% for p in PAGES %} + <li><a href="{{ SITEURL}}/{{ p.url|e }}"{% if p == page %} class="active"{% endif %}>{{ p.title }}</a></li> + {% endfor %} + {% endif %} + </ul> + </nav> + + {% if categories %} + <nav class="widget"> + <h3>Catégories</h3> + <ul> + {% for cat, null in categories %} + <li><a href="{{ SITEURL }}/{{ cat.url|e }}">{{ cat }}</a></li> + {% endfor %} + </ul> + </nav> + {% endif %} + + {% if SOCIAL %} + <nav class="widget"> + <h3>Social</h3> + <ul> + {% for url, name in SOCIAL %} + <li><a href="{{ url|e }}">{{ name }}</a></li> + {% endfor %} + <li><a href="{{ SITEURL }}/{{ FEED }}" rel="alternate">Flux Atom</a></li> + {% if FEED_RSS %} + <li><a href="{{ SITEURL }}/{{ FEED_RSS }}" rel="alternate">Flux RSS</a></li> + {% endif %} + </ul> + </nav> + {% endif %} + </aside> diff --git a/dev-random/templates/index.html b/dev-random/templates/index.html index ad01608..11314d1 100644 --- a/dev-random/templates/index.html +++ b/dev-random/templates/index.html @@ -1,7 +1,7 @@ {% extends "base.html" %} {%- block content %} - <section id="page-content"> + <section class="content"> <h1 id="page-title">{% block index_title %}Tous les articles{% endblock index_title %}</h1> {% for article in articles_page.object_list %} diff --git a/dev-random/templates/page.html b/dev-random/templates/page.html index 25acc8e..f0bc3c9 100644 --- a/dev-random/templates/page.html +++ b/dev-random/templates/page.html @@ -3,7 +3,7 @@ {% block title %}{{ super() }} — {{ page.url }}{% endblock title %} {%- block content %} - <section id="page-content"> + <section class="content"> <h1>{{ page.title }}</h1> {{ page.content }} </section> diff --git a/dev-random/templates/tags.html b/dev-random/templates/tags.html index 45b883b..b95d401 100644 --- a/dev-random/templates/tags.html +++ b/dev-random/templates/tags.html @@ -3,7 +3,7 @@ {% block title %}{{ super() }} — Mots-clés{% endblock title %} {%- block content %} - <section id="page-content"> + <section class="content"> <h1>Mots-clés</h1> <ul id="tagslist"> {% for tag in tag_cloud %} |