X-Git-Url: http://git.cyclocoop.org/%27.parametre_url%28%24action%2C%27changer_lang%27%2C%24value%29.%27?a=blobdiff_plain;f=css%2Fhabillage.scss;h=3568d8eae1d19c8a014b650260c9c09afa3b3170;hb=ee81afa92e87813d5e1d6c4b47e8ffdfb4700f11;hp=4a1c0d774cae7596fc95d9951a5eb72425e7e29a;hpb=a2f394ba19385df6306f6a379e3b73232aacc968;p=lhc%2Fweb%2Fclavettes.git diff --git a/css/habillage.scss b/css/habillage.scss index 4a1c0d7..3568d8e 100644 --- a/css/habillage.scss +++ b/css/habillage.scss @@ -35,10 +35,11 @@ article, aside, canvas, details, embed, figure, figcaption,hgroup, menu, nav, output, ruby, summary, mark, audio, video { background-color: #ffffff; + background: none; } html { - line-height: 1; + line-height: 1.1; } ol, ul { @@ -97,7 +98,7 @@ header .spip_logos{ #wrap{ padding-top:130px; - width:1200px; + width:100%; margin:0 auto; } a{ @@ -116,6 +117,7 @@ h1{ padding-left:15px; font-size:1.9em; display:inline-block; + font-weight: bold; } h2{ @@ -131,6 +133,7 @@ h3{ p{ margin:0 15px; + padding-bottom:15px; text-decoration:none; text-align: justify; } @@ -155,15 +158,13 @@ p{ } #ateliers ul li{ - height: 300px; + margin-bottom:15px; - background-color: #2bc7cd; } #ateliers p{ - margin: 15px 15px 0 15px; - font-size:1.3em; - font-weight: bold; + margin: 15px 15px 0 0; + font-size:1.0em; text-align: left; } @@ -176,19 +177,20 @@ p{ #news{ - margin:0 10px 10px 10px; overflow: hidden; } -#news img{ - height:350px; -} - .article{ background-color:#ffaa7f; - + margin:0 10px 15px 10px; +} +.spip_logo{ + display:none; +} +.article .spip_logos{ + display:none; + } - @@ -199,13 +201,16 @@ p{ .map{ background-color:#6059d2; height: 300px; - margin:0 0 15px 10px; + margin:0 10px 15px 10px; +} +.leaflet-control-attribution leaflet-control{ + z-index: 999; } .agenda{ background-color: #3ee88d; height:500px; - margin:0 0 0px 10px; + margin:0 10px 0px 10px; padding-right: 10px; } @@ -223,223 +228,94 @@ p{ .date{ float:left; font-size: 1.7em; - + clear: both; } - -/*RESPONSIVE*/ - -.col-2, -.col-4, -.col-6, -.col-8, -.col-10, -.col-12{ - float:left; - position:relative; - - +.horaire{ + font-size: 0.8em; } - -.row:before, .row:after{ - content: ""; - display:table; +.leaflet-control-attribution{ + display: none; } -.row:after{ - clear:both; -} - - -.row{ - margin: 0 -10px; - zoom: 1; -} - - - -.col-1{ - width:8.33333%; -} - -.col-2{ - width:16.66667%; -} - -.col-3{ - width:25%; -} - - -.col-4{ - width:33.33333%; -} - -.col-5{ - width:41.66667%; -} - -.col-6{ - width:50%; -} - -.col-7{ - width:58.33333%; -} - -.col-8{ - width:66.66666%; -} - -.col-9{ - width:75%; -} - -.col-10{ - width:83.33333%; -} - -.col-11{ - width:91.66667%; -} - -.col-12{ - width:100%; -} - - - - -@media only screen and (min-width:640px) { - -.col-m-1{ - width:8.33333%; -} - -.col-m-2{ - width:16.66667%; -} - -.col-m-3{ - width:25%; -} - - -.col-m-4{ - width:33.33333%; -} - -.col-m-5{ - width:41.66667%; -} - -.col-m-6{ - width:50%; -} - -.col-m-7{ - width:58.33333%; -} - -.col-m-8{ - width:66.66666%; -} - -.col-m-9{ - width:75%; -} +/*RESPONSIVE*/ -.col-m-10{ - width:83.33333%; -} -.col-m-11{ - width:91.66667%; -} - -.col-m-12{ - width:100%; -} +$columns: 12!default; +$medium:650px; +$large:1200px; +%col{ + float:left; + position: relative; } - - - - - -@media only screen and (min-width:1024px) { - -.col-l-1{ - width:8.33333%; +@for $i from 1 through $columns{ + .col-#{$i}{ + @extend %col; + width:$i / $columns * 100%;} + .col-m-#{$i}, .col-l-#{$i}{@extend %col;} } -.col-l-2{ - width:16.66667%; +@media only screen and (min-width: $medium){ + @for $i from 1 through $columns{ + .col-m-#{$i}{ + width:$i / $columns * 100%;} + } + } - -.col-l-3{ - width:25%; +@media only screen and (min-width: $large){ + @for $i from 1 through $columns{ + .col-l-#{$i}{ + width:$i / $columns * 100%;} + } + #wrap{ + width:1200px; } - -.col-l-4{ - width:33.33333%; +.wrap{ + width: auto; } - -.col-l-5{ - width:41.66667%; } -.col-l-6{ - width:50%; -} -.col-l-7{ - width:58.33333%; -} -.col-l-8{ - width:66.66666%; +.row:before, .row:after{ + content: ""; + display:table; } -.col-l-9{ - width:75%; +.row:after{ + clear:both; } -.col-l-10{ - width:83.33333%; -} -.col-l-11{ - width:91.66667%; +.row{ + margin: 0 -10px; + zoom: 1; } -.col-l-12{ - width:100%; -} -} /*FOOTER*/ footer{ clear:both; height:200px; - width:100%; background-color: #ffaa7f; - } footer ul { padding:0; - margin:0; + margin:0 auto; list-style-type:none; padding-top:70px; - margin-left:100px; - +} +.textfooter{ + width:500px; + margin:0 auto; } footer li { - margin-left:2px; float:left; /*pour IE*/ + text-align: center; } footer ul li a { display:block;