From d38e0af8b61ebd1ce5748a878eeb6158d0229671 Mon Sep 17 00:00:00 2001 From: Ricardo Wurmus Date: Tue, 20 Dec 2022 13:15:05 +0100 Subject: Remove bootstrap.css and build CSS from SCSS sources. --- assets/mumi.scss | 525 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 525 insertions(+) create mode 100644 assets/mumi.scss (limited to 'assets/mumi.scss') diff --git a/assets/mumi.scss b/assets/mumi.scss new file mode 100644 index 0000000..eda6a4b --- /dev/null +++ b/assets/mumi.scss @@ -0,0 +1,525 @@ +// Override default variables +//$primary-hue: 12; +//$primary: #ff3300; +//$primary-600: #ff3300; + + + +$commit_header: #005cc5; + +// Import full Pico source code +@import "pico/scss/pico"; + +:root { + --spacing: .5em; + --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; +} +:root:not([data-theme="dark"]) { + --background-color: #{#fcfbf3}; +} + +* { + box-sizing: border-box; +} + + +html { + scroll-padding-top: 70px; /* height of sticky header */ +} + +html, body { + background-color: #fff; + width: 100%; + padding: 0px; + margin: 0px; +} + +body { + height: auto; +} + +h1 { + clear: both; + margin-top: 1.3rem; + margin-bottom: 0.5rem; +} + +.title { + clear: both; + font-size: 16px; + margin-bottom: 1rem; + border-bottom: 1px dashed #ddd; + padding: 0px; + padding-bottom: 1rem; + color: #586069; +} + +.comment-box { + margin-top: 1rem; + margin-bottom: 2rem; + border-top: 1px dashed #ddd; + padding-top: 1rem; +} + +h2 { + border-bottom: 1px solid #eee; + padding-bottom: 5px; +} + +ul.merged li, ul.blockedby li, ul.blocks li { + display: inline-block; +} +ul.merged li + li:before, +ul.blockedby li + li:before, +ul.blocks li + li:before { + content: ", "; +} + +p + p { + text-indent: 0.5rem; + margin-top: 1.0rem; +} + +.card-body form { + padding-bottom: 1em; +} + +tr.heading th { + background-color: #f8f9fa; + font-weight: bold; +} + +tr td:nth-child(1), +tr td:nth-child(4) { + width: 4rem; +} + +tr td:nth-child(3){ + width: 19rem; +} + +tr.serious svg { + fill: #ff5a2a; + margin-right: .5em; + height: 1.2em; + vertical-align: text-bottom; +} +tr.important svg { + fill: #000; + margin-right: .5em; + height: 1.2em; + vertical-align: text-bottom; +} + +nav { + background: #333333; + border-color: #1A1A1A1A; + border-style: none none solid none; + border-width: thin; + width: 100%; + margin-bottom: 1rem; + padding: .5em; + color: #fff; + border-radius: 0; +} + +nav span.navbar-text { + display: flex; + flex-grow: 1; +} + +@media (max-width: 576px) { + nav span.navbar-text { + display: none; + } +} + +@media (min-width: 576px) { + #search input:focus { + width: 400px; + } + #search #search-hints { + width: 400px; + } +} + +@media (min-width: 768px) { + #search input:focus { + width: 500px; + } + #search.form-inline #search-hints { + width: 500px; + } +} + +#search #search-hints { + display: none; + position: absolute; + background: white; + top: 2.5rem; + border: 1px solid #ced4da; + border-top: none; + box-shadow: 3px 3px 10px #ddd; + padding: 1em; + z-index: 2; + color: #212529; +} +#search.form-inline:focus-within #search-hints { + display: block; +} +#search { z-index: 3; } + +footer { + border-color: #1A1A1A1A; + border-style: dashed none none none; + border-width: 2px; + width: 100%; + align-items: center; + text-align: center; + margin-top: 3rem; + padding: 1rem; + color: #586069; + background: #fafafa; +} + +table { + width: 100%; +} + +/* messages */ +.row.event { + margin-bottom: 1em; + font-size: 1.2em; +} + +.info .stat { + display: inline-grid; + color: #586069; + margin-right: 1em; +} +.info .stat .label { + display: block; +} + +a.line-anchor { + position: absolute; + visibility: hidden; +} +a.line-anchor:before { + content: "# "; + margin-left: -2em; + padding-right: 2em; +} + +div.line:hover a.line-anchor { + visibility: visible; +} + +a.message-anchor { + display: block; + position: relative; + visibility: hidden; +} + +#sidebar { + display: none; + position: fixed; + right: 10px; + top: 100px; + background: white; + border: 1px solid #ddd; + border-radius: 6px; + padding: .5em; + padding-right: 1.5em; + z-index: 1; + max-height: 500px; + overflow-y: auto; +} + +@media (min-width: 1200px) { + #sidebar { + display: block; + } +} + +#sidebar li { + width: max-content; +} + +.conversation .avatar { + display: none; +} + +#sidebar .avatar, +.message .from .avatar { + width: 1.2em; + height: 1.2em; + border-radius: 3px; + color: #fff; + display: inline-flex; + justify-content: center; + align-items: center; + margin-right: 3px; +} + +@media (min-width: 768px) { + .conversation .avatar { + height: 48px; + width: 48px; + border: 1px solid #ddd; + border-radius: 6px; + color: #fff; + display: flex; + justify-content: center; + align-items: center; + font-size: 32px; + position: absolute; + } +} + +.address + .address:before { + content: ", "; +} + +@media (min-width: 768px) { + .message { + margin-left: 65px; + } +} + +@media (max-width: 768px) { + h1 { + font-size: 2rem; + } +} + +details { + margin-top: .5em; +} + +.message details { + border-top: 2px dotted #efefef; + border-bottom: 2px dotted #efefef; +} +.message details summary { + color: #586069; + padding: 1em 0; +} + +.message .body pre { + background: transparent; + border: none; +} + +.message .body .multipart { + padding-bottom: 1rem; +} + +.message .body .attachment + .multipart, +.message .body .multipart + .multipart { + padding-top: 1rem; + padding-bottom: 1rem; + border-top: 1px dashed #ddd; +} + +.multipart.application-pgp-signature { + display: none; +} + +.multipart.text-x-patch { +} + +.multipart.scheme { + white-space: pre-wrap; + font-family: monospace; +} + +.attachment:before { + background-image: url('/img/file.svg'); + background-size: 1rem; + display: inline-block; + height: 1rem; + width: 1rem; + content: ""; + margin-right: 0.2em; +} + +.download-message, +.download-part { + float: right; + font-size: 0.8em; + font-style: italic; +} + +@media (min-width: 768px) { + .message .card-header:before { + content: ""; + border-color: transparent; + border-right-color: #ddd; + border-style: solid solid outset; + border-width: 10px; + height: 0; + width: 0; + margin-left: -40px; + top: calc(1rem - 1px); + position: absolute; + } + .message .card:before { + content: ""; + border-color: transparent; + border-right-color: #f8f9fa; + border-style: solid solid outset; + border-width: 9px; + height: 0; + width: 0; + left: -18px; + top: 1rem; + position: absolute; + z-index: 10; + } + .message .from .avatar { + display: none; + } +} + +.message .from { + display: inline-block; +} + +.message .from .address { + font-weight: bold; +} + +.message .details { + margin-top: .5em; + display: none; +} + +.message div.line { + white-space: pre-wrap; + font-family: monospace; + display: block; +} + +/* diff styles */ +div.line pre { + margin: 0; + font-family: inherit; + font-size: inherit; + color: inherit; +} + +.message .diff div.line.diff.file { + color: #005cc5; +} +.message .diff div.line.diff.separator { + color: #005cc5; +} +.message .diff div.line.diff.addition { + color: #22863a; + background-color: #f0fff4; +} +.message .diff div.line.diff.deletion { + color: #b31d28; + background-color: #ffeef0; +} +.message .diff div.line.diff.range { + color: #6f42c1; + font-weight: bold; +} + +/* commit styles */ +.message span.commit { + font-family: monospace; +} +.message span.commit.attribution { + color: $commit_header; +} +.message span.commit.header { + color: $commit_header; +} +.message span.commit.changelog { + color: $commit_header; +} + +/* quote styles */ +.message .quote div.line { + color: #3868cc; +} + +.message .snippet { + background-color: #fbfbfb; +} + +.filter { + display: inline-block; + color: #fff; + background: #aaa; + text-align: center; + padding: 2px; + border-radius: 3px; + font-family: monospace; + margin: 1px; +} + +.status-tag { + display: inline-block; + color: #fff; + text-align: center; + padding: 4px; + border-radius: 3px; + margin-right: 8px; +} + +.status-tag.done { + background: #cb2431; +} +.status-tag.open { + background: #2cbe4e; +} + +.error.parse { + font-style: italic; + font-size: 0.8em; +} + +.message .body.card-body { + padding: .8rem; +} + + + +/* Syntax highlighting code, by David Thompson, borrowed + from: + https://git.dthompson.us/blog.git/blob_plain/refs/heads/haunt-migration:/css/dthompson.css + David Thompson gives permission for this to be GPLv3+ and CC BY-SA 4.0 + + Modified significantly since. +*/ + + +.syntax-special, .syntax-element { + color: #856; + font-weight: bold; +} + +.syntax-symbol { + color: #423; +} + +.syntax-string { + color: #484; +} + +.syntax-keyword, .syntax-attribute { + color: #921; +} + +.syntax-comment { + color: #666; +} + +.syntax-open, .syntax-close { + color: #688; +} -- cgit v1.2.3