From: cain-ish Date: Mon, 15 Feb 2016 12:45:14 +0000 (+0100) Subject: Split promobox into 2 + carousel height fix X-Git-Url: https://git.mdrn.pl/edumed.git/commitdiff_plain/29d00a3749ebfcf255932d7d0d0c9013c2e9a5a3?ds=sidebyside;hp=cc3642cc8629e6568c75e15283b4cfcc60e02a53 Split promobox into 2 + carousel height fix --- diff --git a/edumed/static/css/main.css b/edumed/static/css/main.css index bbba26e..80bdea8 100644 --- a/edumed/static/css/main.css +++ b/edumed/static/css/main.css @@ -1,14 +1,14 @@ #main-promobox { float: right; - width: 11.25em; + width: 12.5em; height: 11.6875em; } #main-promobox a { background: #16a487; - padding: 0.75em 1.25em; + padding: 1em 1.25em; border-radius: 0.9375em; display: block; - margin-bottom: 1.4em; - width: 8.75em; + margin-bottom: 1em; + width: 10em; float: left; } @@ -23,14 +23,16 @@ } #main-promobox h1 { background: #16a487; - padding: 0.75em 1.25em; + padding: 1em 1.25em; border-radius: 0.9375em; color: white; margin: 0; text-transform: uppercase; font-size: .9em; - width: 10em; + width: 11.375em; float: left; + padding-top: 1.25em; + padding-bottom: 1.25em; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } diff --git a/edumed/static/css/main.scss b/edumed/static/css/main.scss index 9b27291..1818e60 100755 --- a/edumed/static/css/main.scss +++ b/edumed/static/css/main.scss @@ -2,22 +2,22 @@ $px: .0625em; @mixin main-promobox-shape() { background: #16a487; - padding: 0.75em 20*$px; + padding: 1em 20*$px; border-radius: 15*$px; } #main-promobox { float: right; - width: 220*$px - 2 * 20*$px; + width: 220*$px - 20*$px; height: 235*$px - 2 * 1.5em; a { @include main-promobox-shape(); display: block; - margin-bottom: 1.4em; - width: 220*$px - 4 * 20*$px; + margin-bottom: 1em; + width: 220*$px - 3 * 20*$px; float: left; &:first-of-type { @@ -36,8 +36,10 @@ $px: .0625em; margin: 0; text-transform: uppercase; font-size: .9em; - width: 220*$px - 3 * 20*$px; + width: 222*$px - 2 * 20*$px; float: left; + padding-top: 1.25em; + padding-bottom: 1.25em; border-bottom-right-radius: 0; border-bottom-left-radius: 0; }