X-Git-Url: https://git.mdrn.pl/edumed.git/blobdiff_plain/e76fdcf2a2488b1787c74fe8dccfa38d7ac04c84..2d06b37b45d3ba1ba224f63855631147c82cc103:/edumed/static/css/main.scss diff --git a/edumed/static/css/main.scss b/edumed/static/css/main.scss index 56517d9..962336e 100755 --- a/edumed/static/css/main.scss +++ b/edumed/static/css/main.scss @@ -1,18 +1,18 @@ $px: .0625em; #main-promobox { - /*position: absolute; - top: 0; - right: 10 * $px;*/ float: right; border-radius: 15*$px; - background: #f8b323; + background: #16a487; padding: 1.5em 20*$px; width: 220*$px - 2 * 20*$px; height: 235*$px - 2 * 1.5em; + a { + display: block; + } h1 { color: white; margin: 0; @@ -20,7 +20,7 @@ $px: .0625em; font-size: .9em; } h1:before { - content: url(/static/img/icons/announce.png); + content: url(/static/img/icons/announce_white.png); margin-right: 1.2em; vertical-align: top; } @@ -43,12 +43,12 @@ $px: .0625em; #main-sections { clear: both; float: left; - margin-top: 1.1em; + margin-top: 1.2em; width: 700*$px; h1 { font-size: .9em; - margin: 0 0 0 1.6em; + margin: 0 0 0 20*$px; text-transform: uppercase; } @@ -61,35 +61,54 @@ $px: .0625em; margin-top: 20*$px; margin-left: 20*$px; float: left; - width: 160*$px; height: 90*$px; border-radius: 15*$px; - display: table; a { - display: table-cell; - padding-left: 27*$px; - vertical-align: middle; - height: 100%; color: white; text-transform: uppercase; - font-size: .9em; + display: block; + height: 80*$px; + display: table; + padding: 5px; + + .in-box { + font-size: .9em; + height: 100%; + width: 100%; + display: table-cell; + vertical-align: middle; + border: 1px solid transparent; + border-radius: 10*$px; + padding: 0 16*$px; + + .name { + display: block; + font-size: 1.5em; + line-height: 1em; + margin-bottom: .2em; + } + } + } + a:hover .in-box { + border: 1px solid white; } } .box1 {background-color: #adaeaf;} .box2 {background-color: #f8b323;} .box3 {background-color: #16a487;} .box4 {background-color: #5e6165;} - .box5 {background-color: #16a487;} + // .box5 {background-color: #16a487;} + .box5 {background-color: #f8b323;} .box6 {background-color: #363a3e;} .box7 {background-color: #adaeaf;} .box8 {background-color: #ed7831;} } } -#main-chosen { +#main-howto { float: right; - margin-top: 1.1em; + margin-top: 1.2em; width: 220*$px; h1 { @@ -99,19 +118,45 @@ $px: .0625em; } ul { - margin: 17*$px 0 0 1.4em;; - padding: 0; - list-style-position:inside; + margin: 17*$px 0 17*$px 1.4em; li { font-size: .9em; text-transform: uppercase; line-height: 1.25em; - - a { - color: #363a3e; - } } + a:before { + height: 20*$px; + } + + .knowledge:before {content: url(/static/img/icons/knowledge_dark.png);} + .activity:before {content: url(/static/img/icons/activity_dark.png);} + .lesson-plan:before {content: url(/static/img/icons/lesson-plan_dark.png);} + .reference:before {content: url(/static/img/icons/reference_dark.png);} + .knowledge:hover:before {content: url(/static/img/icons/knowledge_orange.png);} + .activity:hover:before {content: url(/static/img/icons/activity_orange.png);} + .lesson-plan:hover:before {content: url(/static/img/icons/lesson-plan_orange.png);} + .reference:hover:before {content: url(/static/img/icons/reference_orange.png);} + + } + p { + margin: 0 0 30*$px 1.4em; + } +} + +#main-chosen { + clear: left; + float: left; + margin-top: 2em; + + h1 { + font-size: .9em; + margin: 0 0 1em 20*$px; + text-transform: uppercase; + } + + .levelth { + margin-left: 20*$px; } } @@ -131,17 +176,8 @@ $px: .0625em; ul, ol { margin: 1.1em 0 0 0; - padding: 0; - list-style-position:inside; - color: #ed7831; font-size: .9em; line-height: 1.15em; - - li { - a { - color: #ed7831; - } - } } } }