diff --git a/mainsite/static/css/screen.css b/mainsite/static/css/screen.css index 76b9122..0176db5 100644 --- a/mainsite/static/css/screen.css +++ b/mainsite/static/css/screen.css @@ -122,30 +122,65 @@ h2 { } /* line 62, ../sass/screen.scss */ +h3 { + font-size: 1.5em; + text-align: left; + padding: 15px; + margin-bottom: 0.4em; +} + +/* line 69, ../sass/screen.scss */ strong, b { font-weight: bold; } -/* line 66, ../sass/screen.scss */ +/* line 73, ../sass/screen.scss */ i, em { font-style: italic; } -/* line 70, ../sass/screen.scss */ +/* line 77, ../sass/screen.scss */ a { color: #8c0e00; text-decoration: none; font-weight: bold; } -/* line 76, ../sass/screen.scss */ +/* From http://adis.ca/entry/2011/pretty-code-block-in-css/ */ +/* line 84, ../sass/screen.scss */ +pre { + font-family: "Courier 10 Pitch", Courier, monospace; + font-size: 80%; + line-height: 140%; + white-space: pre; + white-space: pre-wrap; + white-space: -moz-pre-wrap; + white-space: -o-pre-wrap; + background-color: #f0f0f0; + padding: 10px; +} + +/* From http://adis.ca/entry/2011/pretty-code-block-in-css/ */ +/* line 97, ../sass/screen.scss */ +code { + font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; + font-size: 80%; + line-height: 140%; + white-space: pre; + white-space: pre-wrap; + white-space: -moz-pre-wrap; + white-space: -o-pre-wrap; + background-color: #f0f0f0; +} + +/* line 108, ../sass/screen.scss */ header { max-width: 700px; margin: 0 auto; text-align: center; } @media screen and (min-width: 600px) { - /* line 76, ../sass/screen.scss */ + /* line 108, ../sass/screen.scss */ header { border-bottom: 3px solid #000; position: relative; @@ -153,7 +188,7 @@ header { margin: 30px auto; margin-bottom: 55px; } - /* line 87, ../sass/screen.scss */ + /* line 119, ../sass/screen.scss */ header:after { content: " "; position: absolute; @@ -165,14 +200,14 @@ header { } } -/* line 99, ../sass/screen.scss */ +/* line 131, ../sass/screen.scss */ .container { margin: 0 auto; max-width: 1200px; width: 100%; } @media screen and (min-width: 600px) { - /* line 99, ../sass/screen.scss */ + /* line 131, ../sass/screen.scss */ .container { display: table; display: flex; @@ -180,26 +215,26 @@ header { } } -/* line 110, ../sass/screen.scss */ +/* line 142, ../sass/screen.scss */ .sidebar { width: 400px; padding-right: 40px; } -/* line 114, ../sass/screen.scss */ +/* line 146, ../sass/screen.scss */ .sidebar .minimenu { display: none; } -/* line 118, ../sass/screen.scss */ +/* line 150, ../sass/screen.scss */ .sidebar ul.nav { margin-bottom: 30px; } -/* line 121, ../sass/screen.scss */ +/* line 153, ../sass/screen.scss */ .sidebar ul.nav li { display: block; font-weight: normal; margin: 7px 0; } -/* line 126, ../sass/screen.scss */ +/* line 158, ../sass/screen.scss */ .sidebar ul.nav li a { border: 1px solid rgba(140, 14, 0, 0.5); background: #fff; @@ -209,19 +244,19 @@ header { text-align: center; } @media screen and (min-width: 600px) { - /* line 126, ../sass/screen.scss */ + /* line 158, ../sass/screen.scss */ .sidebar ul.nav li a { box-shadow: -2px 2px 0 #f06e00; transition: box-shadow 0.4s ease-out, transform 0.4s ease-out; } - /* line 138, ../sass/screen.scss */ + /* line 170, ../sass/screen.scss */ .sidebar ul.nav li a:hover { box-shadow: -6px 6px 0 #f06e00; transform: translateX(2px) translateY(-2px); } } -/* line 149, ../sass/screen.scss */ +/* line 181, ../sass/screen.scss */ .main { background: #fff; flex-grow: 1; @@ -229,7 +264,7 @@ header { width: 100%; border: 1px solid rgba(140, 14, 0, 0.7); } -/* line 156, ../sass/screen.scss */ +/* line 188, ../sass/screen.scss */ .main .last-publication a { display: block; max-width: 350px; @@ -245,66 +280,66 @@ header { box-shadow: 0 0 0 rgba(140, 14, 0, 0); transition: box-shadow 1s ease-out; } -/* line 171, ../sass/screen.scss */ +/* line 203, ../sass/screen.scss */ .main .last-publication a:hover { box-shadow: 0 0 5px #8c0e00; } -/* line 176, ../sass/screen.scss */ +/* line 208, ../sass/screen.scss */ .main .intro-text { margin-bottom: 40px; } -/* line 180, ../sass/screen.scss */ +/* line 212, ../sass/screen.scss */ .main p { - margin-bottom: 1em; + margin: 0.5em 0; } -/* line 184, ../sass/screen.scss */ +/* line 216, ../sass/screen.scss */ .main .md-text { text-align: justify; font-size: 1.1em; } -/* line 189, ../sass/screen.scss */ +/* line 221, ../sass/screen.scss */ .main ol, .main ul { list-style-position: outside; margin-left: 20px; margin-bottom: 1em; } -/* line 194, ../sass/screen.scss */ +/* line 226, ../sass/screen.scss */ .main ol { list-style-type: decimal; } -/* line 197, ../sass/screen.scss */ +/* line 229, ../sass/screen.scss */ .main ul { list-style-type: disc; } -/* line 200, ../sass/screen.scss */ +/* line 232, ../sass/screen.scss */ .main li { margin: 0.35em 0; } -/* line 205, ../sass/screen.scss */ +/* line 237, ../sass/screen.scss */ .publication-list { margin: 10px 5px; margin-left: 30px; padding: 0 30px; max-width: 700px; } -/* line 211, ../sass/screen.scss */ +/* line 243, ../sass/screen.scss */ .publication-list .publication-entry { display: flex; align-items: center; position: relative; border-bottom: 1px solid #86abcb; } -/* line 217, ../sass/screen.scss */ +/* line 249, ../sass/screen.scss */ .publication-list .publication-entry:first-child { border-top: 1px solid #86abcb; } -/* line 221, ../sass/screen.scss */ +/* line 253, ../sass/screen.scss */ .publication-list .publication-entry > span { padding: 7px 5px; display: inline-block; } -/* line 225, ../sass/screen.scss */ +/* line 257, ../sass/screen.scss */ .publication-list .publication-entry .publication-date { text-align: right; font-weight: light; @@ -312,16 +347,16 @@ header { font-style: italic; width: 100px; } -/* line 232, ../sass/screen.scss */ +/* line 264, ../sass/screen.scss */ .publication-list .publication-entry .publication-descr { font-size: 0.9em; opacity: 0.9; } -/* line 235, ../sass/screen.scss */ +/* line 267, ../sass/screen.scss */ .publication-list .publication-entry .publication-descr:before { content: "– "; } -/* line 239, ../sass/screen.scss */ +/* line 271, ../sass/screen.scss */ .publication-list .publication-entry a.overlay { position: absolute; z-index: 1; @@ -332,12 +367,12 @@ header { } @media screen and (max-width: 599px) { - /* line 251, ../sass/screen.scss */ + /* line 283, ../sass/screen.scss */ body { padding-top: 75px; } - /* line 254, ../sass/screen.scss */ + /* line 286, ../sass/screen.scss */ header, .sidebar { position: fixed; top: 0; @@ -345,7 +380,7 @@ header { width: 100%; } - /* line 260, ../sass/screen.scss */ + /* line 292, ../sass/screen.scss */ header { z-index: 15; right: 60px; @@ -354,13 +389,13 @@ header { height: 60px; line-height: 60px; } - /* line 267, ../sass/screen.scss */ + /* line 299, ../sass/screen.scss */ header img { max-height: 55px; vertical-align: middle; } - /* line 272, ../sass/screen.scss */ + /* line 304, ../sass/screen.scss */ .sidebar { z-index: 14; background: #f8ef78; @@ -370,18 +405,18 @@ header { max-height: 100vh; overflow-y: auto; } - /* line 281, ../sass/screen.scss */ + /* line 313, ../sass/screen.scss */ .sidebar .minimenu { position: absolute; right: 5px; top: 5px; display: block; } - /* line 286, ../sass/screen.scss */ + /* line 318, ../sass/screen.scss */ .sidebar .minimenu img { height: 50px; } - /* line 290, ../sass/screen.scss */ + /* line 322, ../sass/screen.scss */ .sidebar ul.nav { display: flex; width: 100%; @@ -390,17 +425,17 @@ header { font-size: 0.95em; margin-bottom: 10px; } - /* line 298, ../sass/screen.scss */ + /* line 330, ../sass/screen.scss */ .sidebar ul.nav li { display: inline-block; min-width: 150px; margin: 5px; } - /* line 302, ../sass/screen.scss */ + /* line 334, ../sass/screen.scss */ .sidebar ul.nav li a { padding: 10px; } - /* line 309, ../sass/screen.scss */ + /* line 341, ../sass/screen.scss */ .sidebar.collapse ul { display: none; } diff --git a/mainsite/static/sass/_colors.scss b/mainsite/static/sass/_colors.scss index ea754fd..2d41fce 100644 --- a/mainsite/static/sass/_colors.scss +++ b/mainsite/static/sass/_colors.scss @@ -8,3 +8,6 @@ $orange: #f06e00; $blanc: #fff; $pfont: "Source Sans Pro", sans-serif; $hfont: "Bitter", serif; +$codeGray: #f0f0f0; +$codeFont: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; +$preFont: "Courier 10 Pitch", Courier, monospace; diff --git a/mainsite/static/sass/screen.scss b/mainsite/static/sass/screen.scss index 49924f7..3f77d1a 100644 --- a/mainsite/static/sass/screen.scss +++ b/mainsite/static/sass/screen.scss @@ -59,6 +59,13 @@ h2 { margin-bottom: 0.7em; } +h3 { + font-size: 1.5em; + text-align: left; + padding: 15px; + margin-bottom: 0.4em; +} + strong, b { font-weight: bold; } @@ -73,6 +80,31 @@ a { font-weight: bold; } +/* From http://adis.ca/entry/2011/pretty-code-block-in-css/ */ +pre { + font-family: $preFont; + font-size: 80%; + line-height: 140%; + white-space: pre; + white-space: pre-wrap; + white-space: -moz-pre-wrap; + white-space: -o-pre-wrap; + background-color: $codeGray; + padding: 10px; +} + +/* From http://adis.ca/entry/2011/pretty-code-block-in-css/ */ +code { + font-family: $codeFont; + font-size: 80%; + line-height: 140%; + white-space: pre; + white-space: pre-wrap; + white-space: -moz-pre-wrap; + white-space: -o-pre-wrap; + background-color: $codeGray; +} + header { max-width: 700px; margin: 0 auto; @@ -178,7 +210,7 @@ header { } p { - margin-bottom: 1em; + margin: 0.5em 0; } .md-text {