From 3568718f99aaa82b1b1e7b5dfd6edff26f40f8d3 Mon Sep 17 00:00:00 2001 From: Jan Jastrow Date: Wed, 2 Sep 2015 21:33:30 +0200 Subject: [PATCH] Header --- css/main.css | 78 ++++++++++++++++++++------------ css/main.min.css | 2 +- img/circle-of-brain.png | Bin 0 -> 2451 bytes index.html | 21 +++++---- src/img/circle-of-brain.png | Bin 0 -> 2490 bytes src/scss/_defaults.scss | 2 +- src/scss/main.scss | 86 ++++++++++++++++++++++-------------- 7 files changed, 119 insertions(+), 70 deletions(-) create mode 100644 img/circle-of-brain.png create mode 100644 src/img/circle-of-brain.png diff --git a/css/main.css b/css/main.css index 076d35a..7fea1b7 100644 --- a/css/main.css +++ b/css/main.css @@ -487,15 +487,19 @@ textarea { /* @import 'font-awesome'; */ /* Content --------------------------*/ +html { + font-size: 62.5%; } + body { color: #000; - font-family: Open Sans, Helvetica, Arial, sans-serif; - font-size: 12pt; + font-family: Open Sans, Helvetica Neue, Helvetica, Arial, sans-serif; + font-size: 1.4rem; + /* =14px */ -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: auto; } h1, h2, h3 { - font-family: Open Sans, Helvetica, Arial, sans-serif; + font-family: Open Sans, Helvetica Neue, Helvetica, Arial, sans-serif; font-weight: 700; line-height: 1.2em; margin: 0.4em 0em; } @@ -510,31 +514,6 @@ h2 { h3 { font-size: 1.25em; } -p { - line-height: 1.45em; - padding: 0.5em 0; } - -ul li { - margin: 0.3em 0em 0.3em 0.5em; - list-style-position: inside; - list-style-type: square; - font-size: 1em; } - ul li p { - padding-left: 1em; } - -a { - color: #660000; - -webkit-transition: color 0.2s ease; - transition: color 0.2s ease; } - a:hover, a:active, a:focus { - color: #b30000; } - a:active { - position: relative; - top: 1px; } - -a.notdown:active { - position: inherit; } - @media screen { a.external:after { content: "\00A0" "[" "\2197" "]"; } } @@ -545,6 +524,49 @@ a.notdown:active { /* Header --------------------------*/ +.oben { + background-color: #f4f4f4; + border-bottom: #8ec6f0 3px solid; } + +.oben--logo { + display: block; + margin: 0 auto; + padding: 10px 0; } + +.oben--menu { + margin: 0 auto; + padding-bottom: 16px; + list-style: none; + letter-spacing: -0.31em; + text-align: center; } + +.oben--menu--item { + display: inline-block; + letter-spacing: normal; + background-color: #fff; + border: 1px solid #3498e4; + font-size: 1.2rem; } + .oben--menu--item a { + display: inline-block; + color: #3498e4; + padding: 4px 20px; + text-decoration: none; } + .oben--menu--item a:hover { + background-color: #e8f3fc; + border-radius: inherit; } + .oben--menu--item:first-child { + border-top-left-radius: 6px; + border-bottom-left-radius: 6px; } + .oben--menu--item:last-child { + border-top-right-radius: 6px; + border-bottom-right-radius: 6px; } + +.oben--menu--item__active a { + background-color: #3498e4; + color: #fff; } + .oben--menu--item__active a:hover { + background-color: #3498e4; } + /* Content --------------------------*/ .fa { diff --git a/css/main.min.css b/css/main.min.css index 8cc8810..2dec15a 100644 --- a/css/main.min.css +++ b/css/main.min.css @@ -1 +1 @@ -/*! normalize.css v3.0.2 | MIT License | git.io/normalize */body,mark{color:#000}img,legend{border:0}.column.full,.video>*{width:100%}body,h1,h2,h3{font-family:Open Sans,Helvetica,Arial,sans-serif}b,h1,h2,h3,optgroup,strong{font-weight:700}html{font-family:sans-serif;height:100%;box-sizing:border-box;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;font-size:12pt;-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent;color:#600;-webkit-transition:color .2s ease;transition:color .2s ease}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}dfn{font-style:italic}mark{background:#ff0}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{padding:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*,:after,:before{box-sizing:inherit;padding:0;margin:0}.container,.row{margin:0 auto}@-ms-viewport{width:device-width}.clearfix::after,.clearfix::before{content:" ";display:table}.clearfix::after{clear:both}canvas,iframe,img,select,svg,textarea,video{max-width:100%}.overflow-container{overflow-y:scroll}.aspect-ratio{height:0;padding-top:56.25%;position:relative}.aspect-ratio--object{height:100%;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;z-index:100}.video{position:relative;height:0;padding-bottom:56.25%}.video>*{position:absolute;top:0;left:0;height:100%}.row{overflow:hidden;max-width:10in}.fullrow{max-width:100%}.column{float:left;margin-left:5%}.column:first-child{margin-left:0}.column.three-fourth{width:63.75%}.column.two-thirds{width:65%}.column.half{width:47.5%}.column.one-third{width:30%}.column.one-fourth{width:21.25%}h1,h2,h3{line-height:1.2em;margin:.4em 0}h1{font-size:2em;word-break:break-all}h2{font-size:1.5em}h3{font-size:1.25em}p{line-height:1.45em;padding:.5em 0}ul li{margin:.3em 0 .3em .5em;list-style-position:inside;list-style-type:square;font-size:1em}ul li p{padding-left:1em}a:active,a:focus,a:hover{color:#b30000}a:active{position:relative;top:1px}a.notdown:active{position:inherit}@media screen{a.external:after{content:"\00A0" "[" "\2197" "]"}}@media print{a[href]:after{content:" (" attr(href) ")"}}.fa{margin-right:.3em;speak:none}.button{text-overflow:ellipsis}@media screen and (max-width:768px){.column.full,.column.half,.column.three-fourth,.column.two-thirds{float:none;margin:0;width:100%}.column.one-fourth,.column.one-third{float:left;margin:0;width:50%;padding:.4em}}@media screen and (max-width:568px){.column.one-third,.column.two-third{float:none;margin:0;width:100%}}@media screen and (max-width:480px){.column.full,.column.half,.column.one-fourth,.column.one-third,.column.three-fourth,.column.two-thirds{float:left;margin:0;width:100%}} \ No newline at end of file +/*! normalize.css v3.0.2 | MIT License | git.io/normalize */body,mark{color:#000}img,legend{border:0}.column.full,.video>*{width:100%}body,h1,h2,h3{font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif}b,h1,h2,h3,optgroup,strong{font-weight:700}html{font-family:sans-serif;height:100%;box-sizing:border-box;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;font-size:62.5%}body{margin:0;font-size:1.4rem;-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}dfn{font-style:italic}mark{background:#ff0}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{padding:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*,:after,:before{box-sizing:inherit;padding:0;margin:0}.container,.row{margin:0 auto}@-ms-viewport{width:device-width}.clearfix::after,.clearfix::before{content:" ";display:table}.clearfix::after{clear:both}canvas,iframe,img,select,svg,textarea,video{max-width:100%}.overflow-container{overflow-y:scroll}.aspect-ratio{height:0;padding-top:56.25%;position:relative}.aspect-ratio--object{height:100%;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;z-index:100}.video{position:relative;height:0;padding-bottom:56.25%}.video>*{position:absolute;top:0;left:0;height:100%}.row{overflow:hidden;max-width:10in}.fullrow{max-width:100%}.column{float:left;margin-left:5%}.column:first-child{margin-left:0}.column.three-fourth{width:63.75%}.column.two-thirds{width:65%}.column.half{width:47.5%}.column.one-third{width:30%}.column.one-fourth{width:21.25%}h1,h2,h3{line-height:1.2em;margin:.4em 0}h1{font-size:2em;word-break:break-all}h2{font-size:1.5em}h3{font-size:1.25em}@media screen{a.external:after{content:"\00A0" "[" "\2197" "]"}}@media print{a[href]:after{content:" (" attr(href) ")"}}.oben{background-color:#f4f4f4;border-bottom:#8ec6f0 3px solid}.oben--logo{display:block;margin:0 auto;padding:10px 0}.oben--menu{margin:0 auto;padding-bottom:1pc;list-style:none;letter-spacing:-.31em;text-align:center}.oben--menu--item{display:inline-block;letter-spacing:normal;background-color:#fff;border:1px solid #3498e4;font-size:1.2rem}.oben--menu--item a{display:inline-block;color:#3498e4;padding:4px 20px;text-decoration:none}.oben--menu--item a:hover{background-color:#e8f3fc;border-radius:inherit}.oben--menu--item:first-child{border-top-left-radius:6px;border-bottom-left-radius:6px}.oben--menu--item:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.oben--menu--item__active a{background-color:#3498e4;color:#fff}.oben--menu--item__active a:hover{background-color:#3498e4}.fa{margin-right:.3em;speak:none}.button{text-overflow:ellipsis}@media screen and (max-width:768px){.column.full,.column.half,.column.three-fourth,.column.two-thirds{float:none;margin:0;width:100%}.column.one-fourth,.column.one-third{float:left;margin:0;width:50%;padding:.4em}}@media screen and (max-width:568px){.column.one-third,.column.two-third{float:none;margin:0;width:100%}}@media screen and (max-width:480px){.column.full,.column.half,.column.one-fourth,.column.one-third,.column.three-fourth,.column.two-thirds{float:left;margin:0;width:100%}} \ No newline at end of file diff --git a/img/circle-of-brain.png b/img/circle-of-brain.png new file mode 100644 index 0000000000000000000000000000000000000000..11bf070b1db487e6bc2ed8b8c805d3116397b35d GIT binary patch literal 2451 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 literal 0 HcmV?d00001 diff --git a/index.html b/index.html index 7b3231a..b0f33d2 100644 --- a/index.html +++ b/index.html @@ -2,8 +2,8 @@ - Title goes here - + 👤 Jastrow.me + @@ -15,14 +15,14 @@ - - + + - - + +