From e4e266b29f59e3847207eaa51e095f807e11877d Mon Sep 17 00:00:00 2001 From: ache Date: Wed, 7 Feb 2018 16:39:28 +0100 Subject: New design --- design/contenu.css | 34 ++++++----- design/design.css | 5 +- design/rainbow.css | 85 +++++++++++++++++++++++++++ design/style.css | 164 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 271 insertions(+), 17 deletions(-) create mode 100644 design/rainbow.css create mode 100644 design/style.css diff --git a/design/contenu.css b/design/contenu.css index dd6c0a8..a20633d 100755 --- a/design/contenu.css +++ b/design/contenu.css @@ -1,21 +1,28 @@ -section p { - text-indent: 10%; -} -section p:nth-of-type(2) { +section > p:nth-of-type(2) { margin-top: 2.5%; padding-left: 6%; - text-indent: 5%; - font-size: 0.65em; - color: #944040; + font-size:0.85em; + color: #A55; +} +article h1 { + font-size:2em; + color: #A5B; +} +article h2 { + font-size:1.5em; + color: #BB8; } -section p:nth-of-type(1) > img { +article h3 { + font-size:1.25em; + color: #AC4; +} +section > p:nth-of-type(1) > img { height:100px; } article { margin-right: 2%; margin-left: 3%; - text-indent: 3%; float: left; width: 83%; background: #FFF; @@ -23,6 +30,7 @@ article padding-right:0%; padding-left:0%; padding: 1.6em 1.6em; + font-family: Merriweather, "Liberation Serif", "Segoe UI"; } article img { float: right; @@ -32,10 +40,10 @@ article img { article { float: none; margin-right: 7%; - margin-left: 390px; + margin-left: 300px; width: auto; - font-size:1.3em; + font-size:1em; padding-right:5%; padding-left:5%; @@ -48,11 +56,10 @@ article img { } @media only screen and (min-width: 768px) { - section p:first-of-type { + section > p:first-of-type { margin-top: 2.5%; margin-bottom: 2.5%; padding-left: 6%; - text-indent: 5%; font-size: 0.65em; color: #944040; } @@ -64,4 +71,3 @@ article img { width:100px; height:100px; } - diff --git a/design/design.css b/design/design.css index 196891d..66c92db 100755 --- a/design/design.css +++ b/design/design.css @@ -2,6 +2,8 @@ @import url("sommaire.css"); @import url("confirmation.css"); @import url("commentaire.css"); +@import url("style.css"); +@import url("rainbow.css"); body { @@ -17,9 +19,6 @@ body background-repeat:no-repeat; background-position:top left; } -.fr -{ -} .fl { float: left; diff --git a/design/rainbow.css b/design/rainbow.css new file mode 100644 index 0000000..905eb8e --- /dev/null +++ b/design/rainbow.css @@ -0,0 +1,85 @@ +/* + +Style with support for rainbow parens + +*/ + +.hljs { + display: block; + overflow-x: auto; + padding: 0.5em; + background: #474949; + color: #d1d9e1; +} + + +.hljs-comment, +.hljs-quote { + color: #969896; + font-style: italic; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-literal, +.hljs-type, +.hljs-addition { + color: #cc99cc; +} + +.hljs-number, +.hljs-selector-attr, +.hljs-selector-pseudo { + color: #f99157; +} + +.hljs-string, +.hljs-doctag, +.hljs-regexp { + color: #8abeb7; +} + +.hljs-title, +.hljs-name, +.hljs-section, +.hljs-built_in { + color: #b5bd68; +} + +.hljs-variable, +.hljs-template-variable, +.hljs-selector-id, +.hljs-class .hljs-title { + color: #ffcc66; +} + +.hljs-section, +.hljs-name, +.hljs-strong { + font-weight: bold; +} + +.hljs-symbol, +.hljs-bullet, +.hljs-subst, +.hljs-meta, +.hljs-link { + color: #f99157; +} + +.hljs-deletion { + color: #dc322f; +} + +.hljs-formula { + background: #eee8d5; +} + +.hljs-attr, +.hljs-attribute { + color: #81a2be; +} + +.hljs-emphasis { + font-style: italic; +} diff --git a/design/style.css b/design/style.css new file mode 100644 index 0000000..c1f1315 --- /dev/null +++ b/design/style.css @@ -0,0 +1,164 @@ +body { font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif; line-height: 1.6; word-wrap: break-word; padding: 30px; font-size: 16px; color: rgb(51, 51, 51); background-color: rgb(255, 255, 255); overflow: scroll; margin: 5%;} + +.directory { + cursor: pointer; + list-style-type: disc; +} +.file { + list-style: circle; +} +.file a { + padding-top: 5px; + padding-bottom: 5px; +} + +.qcm_item p { margin: 0; padding: 0; display:inline;} +.qcm_check { padding-left: 32px;} +.qcm_radio { padding-left: 32px;} + +blockquote { + color: #777; + padding: 1px 2%; + border-left: 5px solid #ccc; +} + +.special-box { + background: #eee7da; + margin: 12.5px 12.5px; + padding: 10px 0 10px 95px; + color: #424242; + min-height: 60px; +} +.special-box::before{ + content: ""; + display: block; + width: 48px; + height: 48px; + background-repeat: no-repeat; + margin: 0px 0 -48px -70px; +} +.information{ + background: #daeaee; +} +.information::before{ + background-image: url("/img/ic_info_black_48px.svg"); +} +.comment{ + background: #eea; +} +.comment::before{ + background-image: url("/img/ic_comment_black_48px.svg"); +} +.attention{ + background: #eee7da; +} +.attention::before{ + background-image: url("/img/ic_error_black_48px.svg"); +} +.question{ + background: #e2daee; +} +.question::before{ + background-image: url("/img/ic_help_black_48px.svg"); +} +.good{ + background: #aea; +} +.good::before{ + background-image: url("/img/ic_good_black_48px.svg"); +} +.bad{ + background: #eaa; +} +.bad::before{ + background-image: url("/img/ic_bad_black_48px.svg"); +} +.secret { + background: #eee; + padding: 10px 0 10px 15px; + min-height: 20px; +} +.hiden_block_quote { + display: none; +} +table { + border-collapse: collapse; + padding: 7px 13px; +} + +table, th, td { + border: 1px solid #dfe2e5; + padding: 7px 13px; +} +.special-box-content { + margin-top: 5px; +} +kbd { + background-color: #f8f6ea; + padding: 2px 6px; + border-radius: 3px; + border: 1px solid #e0dab6; + border-bottom-width: 3px; + text-shadow: 0 1px 0 #fff; + color: #5e551f; +} +.view { + position: relative; +} +.raw_button { + position: absolute; + top:10px; + right:0; + + margin : 0; + padding : 0; + border : 0; + background : transparent; + font-family : inherit; + font-size : 1em; + cursor : pointer; +} +.raw_button > div { + width : 40px; + height : 24px; + background : rgb(192,192,192) url('image.png') no-repeat center center; + line-height : 24px; + border : 1px solid rgba(27, 31, 35, 0.2); + border-radius : 3px; + font-size: 12px; + + color: #24292e; + background-color: #eff3f6; + background-image: linear-gradient(-180deg, #fafbfc 0%, #eff3f6 90%); + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; +} + +.raw_button > div > div { + font-weight: bold; +} + +.no-style { + text-decoration: none; +} +.valid { + border: 2px solid #c0392b; + border-radius: 2px; + outline: none; + border-color: #9f9; + box-shadow: 0 0 5px #9f9; +} +.invalid { + + border: 2px solid #c0392b; + border-radius: 2px; + outline: none; + border-color: #f99; + box-shadow: 0 0 5px #f99; +} +.glowing { + border: 2px solid #c0392b; + border-radius: 2px; + outline: none; + border-color: #99f; + box-shadow: 0 0 5px #99f; +} -- cgit v1.2.3-54-g00ecf