New layout

This commit is contained in:
m-r-r
2012-04-24 19:34:04 +02:00
parent c551764f59
commit db59bf52aa
11 changed files with 146 additions and 107 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 60 KiB

View File

@@ -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%;

68
dev-random/static/css/skeleton.css vendored Normal file
View File

@@ -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; }
}

View File

@@ -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 %}

View File

@@ -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 }}

View File

@@ -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 class="page">
<header class="head">
<h1>
<a href="{{ SITEURL }}/index.html">{{ SITENAME }}</a>
</h1>
</header>
<div class="main">
{% include "includes/sidebar.html" %}
{% block content %}
{% endblock content %}
</div>
<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>
<![endif]-->
<header id="page-header">
<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 %}
<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>
</body>
</html>

View File

@@ -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 %}

View File

@@ -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>

View File

@@ -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 %}

View File

@@ -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>

View File

@@ -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 %}