From a907da986ac6e50ca4b426460d3b2738081f63b4 Mon Sep 17 00:00:00 2001 From: Antoine Courcelles Date: Sun, 26 Apr 2015 00:12:35 +0200 Subject: [PATCH] border radius, colors, logo size --- css/habillage.css | 268 ++++++++++++++++++++++++--------------------- css/habillage.scss | 33 +++++- 2 files changed, 173 insertions(+), 128 deletions(-) diff --git a/css/habillage.css b/css/habillage.css index 18e0237..5908668 100644 --- a/css/habillage.css +++ b/css/habillage.css @@ -16,6 +16,7 @@ time, mark, audio, video { margin: 0; padding: 0; border: 0; + border-radius: 5px; font: inherit; font-size: 100%; vertical-align: baseline; @@ -24,7 +25,7 @@ time, mark, audio, video { text-align: left; } -/* line 26, habillage.scss */ +/* line 27, habillage.scss */ html, body, span, applet, object, iframe, blockquote, pre, section, abbr, acronym, address, big, cite, code, @@ -36,88 +37,93 @@ table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, hgroup, menu, nav, output, ruby, summary, mark, audio, video { - background-color: #ffffff; + background-color: #FFFFFF; background: none; } -/* line 41, habillage.scss */ +/* line 42, habillage.scss */ +body { + background-color: #F4FFB7; +} + +/* line 46, habillage.scss */ html { line-height: 1.1; } -/* line 45, habillage.scss */ +/* line 50, habillage.scss */ ol, ul { list-style: none; } -/* line 49, habillage.scss */ +/* line 54, habillage.scss */ table { border-collapse: collapse; border-spacing: 0; } -/* line 54, habillage.scss */ +/* line 59, habillage.scss */ caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } -/* line 60, habillage.scss */ +/* line 65, habillage.scss */ q, blockquote { quotes: none; } -/* line 63, habillage.scss */ +/* line 68, habillage.scss */ q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } -/* line 68, habillage.scss */ +/* line 73, habillage.scss */ a img { border: none; } -/* line 72, habillage.scss */ +/* line 77, habillage.scss */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } -/* line 76, habillage.scss */ +/* line 81, habillage.scss */ * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } -/* line 82, habillage.scss */ +/* line 87, habillage.scss */ body { margin: 0; padding: 0; font-size: 0.9em; } -/* line 89, habillage.scss */ +/* line 94, habillage.scss */ header { margin: 15px auto 0 auto; width: 1200px; } -/* line 94, habillage.scss */ +/* line 99, habillage.scss */ header .spip_logos { margin-left: 10px; position: absolute; } -/* line 100, habillage.scss */ +/* line 105, habillage.scss */ #wrap { padding-top: 130px; width: 100%; margin: 0 auto; } -/* line 105, habillage.scss */ +/* line 110, habillage.scss */ a { color: #0fe4ab; text-decoration: none; @@ -128,7 +134,7 @@ a { transition: all 0.3s ease 0s; } -/* line 115, habillage.scss */ +/* line 120, habillage.scss */ a:focus, a:hover, a:active { background: none; color: #0c0fb7; @@ -139,7 +145,7 @@ a:focus, a:hover, a:active { transition: all 0.3s ease 0s; } -/* line 124, habillage.scss */ +/* line 129, habillage.scss */ a:hover > i { color: #0c0fb7 !important; -webkit-transition: all 0.3s ease 0s; @@ -149,7 +155,7 @@ a:hover > i { transition: all 0.3s ease 0s; } -/* line 133, habillage.scss */ +/* line 138, habillage.scss */ h2 { margin: 0; padding: 0; @@ -161,12 +167,12 @@ h2 { width: 90%; } -/* line 143, habillage.scss */ +/* line 148, habillage.scss */ h2:hover { text-decoration: underline; } -/* line 147, habillage.scss */ +/* line 152, habillage.scss */ h3 { margin: 15px 15px; font-size: 1.2em; @@ -174,13 +180,13 @@ h3 { width: 90%; } -/* line 154, habillage.scss */ +/* line 159, habillage.scss */ h4 { margin: 15px; display: inline-block; } -/* line 159, habillage.scss */ +/* line 164, habillage.scss */ p { margin: 0 15px; padding-bottom: 15px; @@ -189,9 +195,9 @@ p { } /*1ERE COLONNE*/ -/* line 168, habillage.scss */ +/* line 173, habillage.scss */ .titre { - background-color: #05ffbc; + background-color: #606060; height: 47px; width: 100%; color: #fff; @@ -203,13 +209,13 @@ p { font-weight: normal; } -/* line 180, habillage.scss */ +/* line 185, habillage.scss */ .titre:hover { text-decoration: none; font-weight: normal; } -/* line 184, habillage.scss */ +/* line 189, habillage.scss */ #ateliers h3 { margin: 15px 15px; font-size: 1.2em; @@ -217,12 +223,12 @@ p { text-decoration: none; } -/* line 190, habillage.scss */ +/* line 195, habillage.scss */ #ateliers { margin: 0 10px; } -/* line 194, habillage.scss */ +/* line 199, habillage.scss */ #ateliers:after { content: ""; /* Important, sinon l'élément n'est pas généré. */ @@ -230,49 +236,49 @@ p { clear: both; } -/* line 200, habillage.scss */ +/* line 205, habillage.scss */ #ateliers ul { padding: 0; margin: 0; list-style-type: none; } -/* line 206, habillage.scss */ +/* line 211, habillage.scss */ #ateliers ul li { margin-bottom: 15px; } -/* line 209, habillage.scss */ +/* line 214, habillage.scss */ .descriptif { margin-left: 15px; } -/* line 213, habillage.scss */ +/* line 218, habillage.scss */ #ateliers p { margin: 15px 15px 0 0; font-size: 1.0em; text-align: left; } -/* line 218, habillage.scss */ +/* line 223, habillage.scss */ #ateliers address { margin: 0 0 0 15px; line-height: 0.6; } -/* line 222, habillage.scss */ +/* line 227, habillage.scss */ .horairesouvertures { margin: 0 0 0 15px; } -/* line 225, habillage.scss */ +/* line 230, habillage.scss */ #ateliers nav { padding-top: 15px; padding-bottom: 15px; clear: both; } -/* line 230, habillage.scss */ +/* line 235, habillage.scss */ .fa { color: #0fe4ab; -webkit-transition: all 0.3s ease 0s; @@ -282,42 +288,47 @@ p { transition: all 0.3s ease 0s; } -/* line 238, habillage.scss */ +/* line 243, habillage.scss */ .fa:hover { color: #0c0fb7; } -/* line 241, habillage.scss */ +/* line 246, habillage.scss */ #atelierdescription nav { margin-bottom: 15px; } -/* line 244, habillage.scss */ +/* line 249, habillage.scss */ .voirenligne { padding: 15px; text-align: right; } +/* line 255, habillage.scss */ +.logoatelier { + text-align: center; +} + /*2EME COLONNE*/ -/* line 251, habillage.scss */ +/* line 261, habillage.scss */ #news { margin: 0 10px; } -/* line 254, habillage.scss */ +/* line 264, habillage.scss */ .article { background-color: #e8e3e1; margin: 0 0 15px 0; line-height: 1.3; } -/* line 259, habillage.scss */ +/* line 269, habillage.scss */ .article h1 { font-size: 1.4em; width: 100%; } -/* line 263, habillage.scss */ +/* line 273, habillage.scss */ .article .fa { width: 20px; height: 20px; @@ -326,47 +337,47 @@ p { border-radius: 10px; } -/* line 270, habillage.scss */ +/* line 280, habillage.scss */ .article .fa a { display: none; } -/* line 273, habillage.scss */ +/* line 283, habillage.scss */ .article img { width: 100%; height: auto; margin: 0; } -/* line 278, habillage.scss */ +/* line 288, habillage.scss */ .article ul { margin: 0 15px; } -/* line 281, habillage.scss */ +/* line 291, habillage.scss */ .article li { margin: 0 15px; } -/* line 284, habillage.scss */ +/* line 294, habillage.scss */ .article div { margin: 0 15px; } -/* line 289, habillage.scss */ +/* line 299, habillage.scss */ .articlefull { background-color: #e8e3e1; margin: 0 0 15px 0; line-height: 1.3; } -/* line 294, habillage.scss */ +/* line 304, habillage.scss */ .articlefull h1 { font-size: 1.4em; width: 100%; } -/* line 298, habillage.scss */ +/* line 308, habillage.scss */ .articlefull .fa { width: 20px; height: 20px; @@ -375,101 +386,112 @@ p { border-radius: 10px; } -/* line 305, habillage.scss */ +/* line 315, habillage.scss */ .articlefull .fa a { display: none; } -/* line 308, habillage.scss */ +/* line 318, habillage.scss */ .articlefull img { width: auto; margin: 0; } -/* line 312, habillage.scss */ +/* line 322, habillage.scss */ .articlefull ul { margin: 0 15px; } -/* line 315, habillage.scss */ +/* line 325, habillage.scss */ .articlefull li { margin: 0 15px; } -/* line 318, habillage.scss */ +/* line 328, habillage.scss */ .articlefull div { margin: 0 15px; } -/* line 321, habillage.scss */ +/* line 331, habillage.scss */ address { padding-bottom: 10px; } -/* line 324, habillage.scss */ +/* line 334, habillage.scss */ address p { margin: 0; padding: 0; } -/* line 328, habillage.scss */ +/* line 338, habillage.scss */ .historique { background-color: #ffd2a1; margin: 0 15px 15px 15px; } -/* line 332, habillage.scss */ +/* line 342, habillage.scss */ .historique h1 { width: 100%; } -/* line 335, habillage.scss */ +/* line 345, habillage.scss */ #atelierdescription { margin: 0 10px; } -/* line 338, habillage.scss */ +/* line 348, habillage.scss */ #atelierdescription #news { margin: 0; } -/* line 341, habillage.scss */ +/* line 351, habillage.scss */ .spip_logos { - width: auto !important; + /* width:auto!important;*/ + width: 200px; + height: 200px; + margin: 15px 15px 15px 15px; + text-align: center; } -/* line 344, habillage.scss */ +/* line 359, habillage.scss */ .urlsites { padding: 15px 0; } /*3EME COLONNE*/ -/* line 352, habillage.scss */ +/* line 367, habillage.scss */ .map { height: 300px; margin: 0 10px 15px 10px; overflow: hidden; } -/* line 357, habillage.scss */ +/* line 372, habillage.scss */ .agenda { - background-color: #05ffbc; + background-color: #606060; margin: 0 10px 15px 10px; padding-right: 10px; padding-bottom: 15px; } -/* line 363, habillage.scss */ +/* line 381, habillage.scss */ .agenda h2:hover { text-decoration: none; + color: #ffffff; +} + +/* line 385, habillage.scss */ +.agenda h2 { + color: #ffffff; } -/* line 366, habillage.scss */ +/* line 388, habillage.scss */ .agenda p { padding: 0; + color: #ffffff; } -/* line 369, habillage.scss */ +/* line 392, habillage.scss */ .agenda ul { list-style-type: none; padding: 0; @@ -477,21 +499,21 @@ address p { padding-top: 15px; } -/* line 375, habillage.scss */ +/* line 398, habillage.scss */ .date { float: left; font-size: 1.7em; clear: both; } -/* line 380, habillage.scss */ +/* line 403, habillage.scss */ .event { display: block; margin-bottom: 45px; padding-top: 5px; } -/* line 386, habillage.scss */ +/* line 409, habillage.scss */ .horaire { font-size: 0.8em; margin-bottom: 20px; @@ -499,230 +521,230 @@ address p { } /*RESPONSIVE*/ -/* line 400, habillage.scss */ +/* line 423, habillage.scss */ .col-1, .col-m-1, .col-l-1, .col-2, .col-m-2, .col-l-2, .col-3, .col-m-3, .col-l-3, .col-4, .col-m-4, .col-l-4, .col-5, .col-m-5, .col-l-5, .col-6, .col-m-6, .col-l-6, .col-7, .col-m-7, .col-l-7, .col-8, .col-m-8, .col-l-8, .col-9, .col-m-9, .col-l-9, .col-10, .col-m-10, .col-l-10, .col-11, .col-m-11, .col-l-11, .col-12, .col-m-12, .col-l-12 { float: left; position: relative; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-1 { width: 8.33333%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-2 { width: 16.66667%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-3 { width: 25%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-4 { width: 33.33333%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-5 { width: 41.66667%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-6 { width: 50%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-7 { width: 58.33333%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-8 { width: 66.66667%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-9 { width: 75%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-10 { width: 83.33333%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-11 { width: 91.66667%; } -/* line 406, habillage.scss */ +/* line 429, habillage.scss */ .col-12 { width: 100%; } @media only screen and (min-width: 650px) { - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-1 { width: 8.33333%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-2 { width: 16.66667%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-3 { width: 25%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-4 { width: 33.33333%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-5 { width: 41.66667%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-6 { width: 50%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-7 { width: 58.33333%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-8 { width: 66.66667%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-9 { width: 75%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-10 { width: 83.33333%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-11 { width: 91.66667%; } - /* line 414, habillage.scss */ + /* line 437, habillage.scss */ .col-m-12 { width: 100%; } } @media only screen and (min-width: 1200px) { - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-1 { width: 8.33333%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-2 { width: 16.66667%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-3 { width: 25%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-4 { width: 33.33333%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-5 { width: 41.66667%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-6 { width: 50%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-7 { width: 58.33333%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-8 { width: 66.66667%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-9 { width: 75%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-10 { width: 83.33333%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-11 { width: 91.66667%; } - /* line 421, habillage.scss */ + /* line 444, habillage.scss */ .col-l-12 { width: 100%; } - /* line 424, habillage.scss */ + /* line 447, habillage.scss */ #wrap { width: 1200px; } - /* line 428, habillage.scss */ + /* line 451, habillage.scss */ .wrap { width: auto; } } -/* line 435, habillage.scss */ +/* line 458, habillage.scss */ .row:before, .row:after { content: ""; display: table; } -/* line 440, habillage.scss */ +/* line 463, habillage.scss */ .row:after { clear: both; } -/* line 445, habillage.scss */ +/* line 468, habillage.scss */ .row { margin: 0 -10px; zoom: 1; } /*FOOTER*/ -/* line 453, habillage.scss */ +/* line 476, habillage.scss */ footer { clear: both; height: 100px; - background-color: #05ffbc; + background-color: #606060; } -/* line 459, habillage.scss */ +/* line 482, habillage.scss */ footer ul { width: 500px; margin: 0 auto; @@ -730,13 +752,13 @@ footer ul { list-style-type: none; } -/* line 466, habillage.scss */ +/* line 489, habillage.scss */ footer li { float: left; /*pour IE*/ } -/* line 469, habillage.scss */ +/* line 492, habillage.scss */ footer ul li a { text-align: center; display: block; @@ -744,7 +766,7 @@ footer ul li a { color: #0c0fb7; } -/* line 475, habillage.scss */ +/* line 498, habillage.scss */ footer ul li a:hover { border-bottom: solid #0c0fb7; } diff --git a/css/habillage.scss b/css/habillage.scss index f821461..e2a05f9 100644 --- a/css/habillage.scss +++ b/css/habillage.scss @@ -15,6 +15,7 @@ time, mark, audio, video { margin: 0; padding: 0; border: 0; + border-radius: 5px; font: inherit; font-size: 100%; vertical-align: baseline; @@ -34,10 +35,14 @@ table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption,hgroup, menu, nav, output, ruby, summary, mark, audio, video { - background-color: #ffffff; + background-color: #FFFFFF; background: none; } +body { + background-color: #F4FFB7; +} + html { line-height: 1.1; } @@ -166,7 +171,7 @@ p{ /*1ERE COLONNE*/ .titre{ - background-color: #05ffbc; + background-color: #606060; height: 47px; width: 100%; color:#fff; @@ -245,6 +250,11 @@ p{ padding:15px; text-align: right; } + + +.logoatelier{ + text-align: center; +} /*2EME COLONNE*/ @@ -339,8 +349,13 @@ address p{ margin:0; } .spip_logos{ - width:auto!important; +/* width:auto!important;*/ + width: 200px; + height: 200px; + margin: 15px 15px 15px 15px; + text-align: center; } + .urlsites{ padding:15px 0; } @@ -355,16 +370,24 @@ address p{ overflow: hidden; } .agenda{ - background-color: #05ffbc; + background-color: #606060; margin:0 10px 15px 10px; padding-right: 10px; padding-bottom: 15px; + } + + .agenda h2:hover{ text-decoration: none; + color: #ffffff; +} +.agenda h2{ + color: #ffffff; } .agenda p{ padding: 0; + color: #ffffff; } .agenda ul{ list-style-type:none; @@ -453,7 +476,7 @@ $large:1200px; footer{ clear:both; height:100px; - background-color: #05ffbc; + background-color: #606060; } footer ul { -- 2.20.1