Commit c61e7ce1 authored by Jérôme Ortais's avatar Jérôme Ortais

Finalisation de la version mobile du site.

Je ne sais pas si ça a le moindre intérêt...
parent 2b277810
......@@ -8,7 +8,7 @@ PELICANOPTS=
BASEDIR=$(pwd)
INPUTDIR=$BASEDIR/content
OUTPUTDIR=$BASEDIR/output
OUTPUTDIR=$BASEDIR/public
CONFFILE=$BASEDIR/pelicanconf.py
###
......
/**********************************
* GLOBAL
**********************************/
html, body {
height: 100%;
font-size: 11px;
line-height: 14px;
}
@media screen and (max-width: 940px) {
html {
margin: -8px 5px;
......@@ -17,9 +12,15 @@ html, body {
}
}
body {
height: 100%;
font-size: 11px;
line-height: 125%;
font-size: 11px;
color: #333;
line-height: 14px;
}
img {
max-width: 100%;
height: auto;
}
body a {
color: #773015;
......@@ -40,7 +41,6 @@ body ul {
#page {
max-width: 940px;
margin: 0 auto;
font-size: 11px;
}
h2, h3 {
border-bottom: 1px solid #ffa628;
......@@ -54,6 +54,7 @@ h1 {
font-weight: lighter;
font-variant: small-caps;
padding-bottom: 15px;
line-height:125%;
}
h2 {
font-weight: lighter;
......@@ -71,12 +72,21 @@ h4 {
margin-bottom: 5px;
color: #000;
}
h5 {
@media screen and (max-width: 940px) {
h5 {
margin-top: 0;
color: #000;
font-size: 11px;
}
}
@media screen and (min-width: 940px) {
h5 {
float: right;
margin-top: 0;
padding-left: 20px;
color: #000;
font-size: 11px;
}
}
#deux_cols h5 {
margin-top: 11px;
......@@ -207,7 +217,7 @@ h5 {
}
.presentation_droite_haut {
position: relative;
line-height: 24px;
line-height: 230% ;
}
.presentation_droite_haut h2 {
margin-left: 60px;
......@@ -252,26 +262,24 @@ h5 {
width: 32%;
float: right;
}
}
.centerleft {
.centerleft {
width: 21%;
float: left;
text-align: center;
}
.centerright {
}
.centerright {
width: 21%;
float: right;
text-align: center;
}
.center {
}
.center {
width: 21%;
margin: 0 auto;
text-align: center;
}
}
@media only screen and (max-width: 940px) {
#trois_cols {
padding-top: 15px;
padding-bottom: 50px;
}
#col_gauche {
width: 100%;
......@@ -290,27 +298,66 @@ h5 {
width: 100%;
margin: 0 auto;
}
.centerleft {
padding-bottom: 10px;
}
.centerright {
padding-bottom: 10px;
}
.center {
}
}
/**********************************
* 2 COLONNES
**********************************/
@media only screen and (min-width: 940px) {
#deux_cols {
display: block;
padding-top: 15px;
padding-bottom: 50px;
}
#deux_cols #col_gauche {
width: 65%}
width: 65%;
float: left;
}
#deux_cols #col_droite {
width: 25%;
max-width: 30%;
float: right;
padding: 15px;
border: 1px solid #ffa628;
}
.margin-check {
padding: 0 15px 15px 15px;
}
#deux_cols #col_droite ul.docs {
list-style: disc;
padding-left: 15px;
line-height: 200%;
}
}
@media only screen and (max-width: 940px) {
div#deux_cols {
display: flex;
flex-direction: column-reverse;
padding-top: 15px;
padding-bottom: 50px;
}
#deux_cols #col_gauche {
width: 100%;
}
#deux_cols #col_droite {
margin-top: 30px;
border: 1px solid #ffa628;
}
.margin-check {
display: inline-block;
padding: 0 15px 15px 15px;
position: relative;
}
#deux_cols #col_droite ul.docs {
list-style: disc;
padding-left: 15px;
line-height: 2em;
line-height: 200%;
}
}
/**********************************
* ARTICLES
......@@ -326,7 +373,7 @@ width: 65%}
#nouveautes-de-cette-version h2 {
font-family: serif;
font-size: 11px;
line-height: 14px;
line-height: 125%;
font-weight: bold;
display: block;
float: none;
......@@ -340,7 +387,7 @@ width: 65%}
.article .section h2 {
font-family: verdana, sans-serif;
font-size: 13px;
line-height: 14px;
line-height: 125%;
font-weight: bold;
display: block;
float: none;
......@@ -364,7 +411,7 @@ width: 65%}
**********************************/
@media only screen and (min-width: 940px) {
#logo_holder #logo {
background: transparent url('../../theme/images/bandeau.png');
background: transparent url('../../theme/images/bandeau.png') no-repeat;
background-repeat: no-repeat;
float: left;
display: block;
......@@ -402,12 +449,22 @@ width: 65%}
}
#footer #feeds {
float: right;
line-height: 16px;
line-height: 125%;
width: 85px;
height: 50px;
}
@media only screen and (max-width: 600px) {
#footer #right a#feeds {
font-size: 0;
padding-right: 0;
}
}
@media only screen and (min-width: 600px) {
#footer #right a#feeds {
padding: 18px 20px 0 0;
}
}
#footer #right a#feeds {
padding: 20px 20px 0 0;
background: transparent url('../../images/feed.png') no-repeat 70% 35%;
text-decoration: none;
}
......@@ -430,7 +487,7 @@ a.button {
a.button span {
background: transparent url('../../images/bouton_span.png') no-repeat;
display: block;
line-height: 14px;
line-height: 125%;
padding: 5px 0 5px 18px;
margin: 0;
}
......@@ -470,7 +527,9 @@ ul#version {
}
.console {
overflow: auto;
width: 90%;
display: inherit;
position:relative;
min-width: 80%;
border: 1px solid #000;
background: #333;
padding: .8em 2em .8em .5em;
......@@ -539,102 +598,6 @@ table.dons td:nth-child(4) {
color: #fff;
width: 100px;
}
/**********************************
* PYROMATHS EN LIGNE
**********************************/
.ui-tabs-panel {
background: url('../../images/enligne.png') no-repeat;
width: 611px;
}
table.tabs {
width: 611px;
}
table.tabs td {
width: 50%}
.ui-widget-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%}
.ui-tabs-nav {
margin: 0;
height: 30px;
width: 611px;
padding: 0;
border-bottom: 1px solid #ddc525;
}
.ui-tabs .ui-tabs-nav li {
list-style: none;
float: left;
position: relative;
padding: 0;
white-space: nowrap;
}
.ui-tabs .ui-tabs-nav a {
background: url('../../images/tabs.png') no-repeat -652px 0;
display: block;
height: 30px;
line-height: 30px;
width: 76px;
text-align: center;
float: left;
text-decoration: none;
color: #666;
position: relative;
}
.ui-tabs .ui-tabs-panel {
display: block;
padding: 0;
}
.ui-tabs a:active {
outline: 0;
}
.ui-tabs a:hover {
background-position: -652px -31px;
color: #fff;
}
p#msgjs, p#errmsg {
color: #911101;
text-align: center;
}
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
background-position: -652px -62px;
cursor: default!important;
color: #000!important;
}
form#idForm input {
border: 2px outset #ddc525;
background-color: #f8f3d2;
}
form#idForm select {
color: #666;
background-color: #f8f3d2;
}
/* Start by setting display:none to make this hidden.
Then we position it in relation to the viewport window
with position:fixed. Width, height, top and left speak
speak for themselves. Background we set to 80% white with
our animation centered, and no-repeating */
.modal {
display: none;
position: fixed;
z-index: 1000;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba( 255, 255, 255, .8 )
url('../../images/loading.gif')
50% 50%
no-repeat;
}
body.loading {
overflow: hidden;
}
body.loading .modal {
display: block;
}
/**********************************
* DESCRIPTIF EXERCICES
**********************************/
......@@ -659,7 +622,7 @@ ul.menu li p.titre {
background-color: #fff;
background-position: 0 0;
background-repeat: no-repeat;
background-image: url('../../images/titlesBackgroundImagePlus.png');
background-image: url('../../images/titlesBackgroundImagePlus.png') no-repeat;
color: #000;
}
ul.menu li p {
......
......@@ -16,6 +16,7 @@
{% block content %}
<div id="deux_cols">
<div id="col_droite">
<div class="margin-check">
{% if article.category == "telecharger" %}
<h3>Historique des versions</h3>
<ul class="docs">
......@@ -45,6 +46,7 @@
</p>
</form>
{% else %}
<h3>Documentation</h3>
{% for cat_name, article_list in categories if cat_name!="telecharger" and cat_name != "finances"%}
<ul>
{% for group in article_list|groupby('category') %}
......@@ -70,7 +72,7 @@
{% endif %}
{% endif %}
</div>
</div>
<div id="col_gauche">
<div class="article">
<h5> Par
......@@ -95,7 +97,7 @@
</div>
</div>
<div class="clear">&nbsp;</div>
</div>
<div class="clear">&nbsp;</div>
{% endblock %}
......@@ -91,14 +91,12 @@
</div><!--page-->
<div id="footer">
<div id="left">&nbsp;</div>
<div id="right">
<a href="{{ FEED_DOMAIN }}/{{ FEED_ALL_ATOM }}" id="feeds">Flux Atom</a>
</div>
<div id="copyright">
<p>&copy; 2010 Pyromaths<br/>
Thème inspiré d'un travail de <a href="https://www.divio.ch/">Divio
GmbH</a></p>
Thème inspiré d'un travail de <a href="https://www.divio.ch/">Divio GmbH</a></p>
</div>
</div>
</div> <!--total-->
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment