From 4c51916d386ee0322fced9758486c2e42e95dfc0 Mon Sep 17 00:00:00 2001 From: Jason McBrayer Date: Sun, 17 Mar 2019 17:12:50 -0400 Subject: [PATCH] Add minimalist small css theme --- .../migrations/0007_auto_20180618_2115.py | 3 + brutaldon/static/css/minimal-small.css | 267 ++++++++++++++++++ 2 files changed, 270 insertions(+) create mode 100644 brutaldon/static/css/minimal-small.css diff --git a/brutaldon/migrations/0007_auto_20180618_2115.py b/brutaldon/migrations/0007_auto_20180618_2115.py index 2c1d0bc..e547335 100644 --- a/brutaldon/migrations/0007_auto_20180618_2115.py +++ b/brutaldon/migrations/0007_auto_20180618_2115.py @@ -31,6 +31,9 @@ def set_up_default_themes(apps, schema_editor): large = Theme(name="Minimalist Large", main_css="css/minimal-large.css", is_brutalist=True) large.save() + small = Theme(name="Minimalist Small", main_css="css/minimal-small.css", + is_brutalist=True) + small.save() vt240 = Theme(name="vt240 amber", main_css="css/vt240don-amber.css", is_brutalist=True) vt240.save() diff --git a/brutaldon/static/css/minimal-small.css b/brutaldon/static/css/minimal-small.css new file mode 100644 index 0000000..bf1efdc --- /dev/null +++ b/brutaldon/static/css/minimal-small.css @@ -0,0 +1,267 @@ +body, input, textarea, select { + font-family: sans-serif; + background-color: #FAFAFA; + color: #000; + margin: 1ex; + font-size: normal; +} + +input[text], textarea +{ + margin: 0 auto; + position: relative; + width: 100%; + max-width: 100em; +} + +a { + color: blue; + text-decoration: underline; +} + +a:active { + color: red; + text-decoration: underline; +} + +a:visited { + color: purple; + text-decoration: underline; +} + +img.is-32x32 { + float: left; + max-width: 32px; + max-height: auto; + margin: 4px; +} + +.container { + margin: 0 auto; + position: relative; +} + +@media screen and (min-width: 1024px) { + .container { + max-width: 960px; + width: 960px; + } + .container.is-fluid { + margin-left: 64px; + margin-right: 64px; + max-width: none; + width: auto; + } + .navbar, + .navbar-menu, + .navbar-start, + .navbar-end { + align-items: stretch; + display: flex; + } + .navbar-start { + justify-content: flex-start; + margin-right: auto; + } + .navbar-end { + justify-content: flex-end; + margin-left: auto; + } +} + +@media screen and (max-width: 1279px) { + .container.is-widescreen { + max-width: 1152px; + width: auto; + } +} + +@media screen and (max-width: 1471px) { + .container.is-fullhd { + max-width: 1344px; + width: auto; + } +} + +@media screen and (min-width: 1280px) { + .container { + max-width: 1152px; + width: 1152px; + } +} + +@media screen and (min-width: 1472px) { + .container { + max-width: 1344px; + width: 1344px; + } +} + +body > section > div.container { + max-width: 100ex; +} + +.level { + clear: both; +} + +.title { + font-size: 3ex; + font-weight: bold; + margin-top: 1ex; + margin-bottom: 1ex; +} +.subtitle { + font-size: 1.5ex; + font-weight: bold; + margin-top: 0.25ex; + margin-bottom: 0.25ex; +} +.toot { + clear: both; +} + +.image.is-32x32, .is-32x32 img, img.is-32x32 { + width: 32px; + height: 32px; +} + +.image.is-48x48, .is-48x48 img, img.is-48x48 { + width: 48px; + height: 48px; +} + +.image.is-64x64, .is-64x64 img, img.is-64x64 { + width: 64px; + height: 64px; +} + +.image.is-96x96, .is-96x96 img, img.is-96x96 { + width: 96px; + height: 96px; +} + +.is-max-128 { + max-height: 128px; + max-width: 128px; +} + +.is-max-256 { + max-height: 256px; + max-width: 256px; +} + +.media { + padding: 1ex; + margin: 4px; + overflow: auto; +} + +.media.active-context { + background-color: #DDD; +} + + +.field +{ + margin-top: 1em; +} + +label +{ + font-weight: bold; +} + +.control, .select +{ + margin-top: 0.5ex; + margin-bottom: 0.5ex; +} + +.account-avatar +{ + display: inline-block; +} +.reblog-icon +{ + margin-top: 32px; + display: inline-block; +} + +.media-content +{ + margin-top: 1ex; +} + +.media-content > div > p +{ + margin-bottom: 1ex; +} + +.textarea +{ + max-width: 100%; +} + +.errorlist +{ + color: #FF0000; +} + +img.emoji +{ + display: inline; + max-height: 1.5rem; + max-width: 1.5rem; + vertical-align: text-bottom; +} + +hr.is-hidden +{ + display: none; +} + +.box +{ + border-radius: 3px; + border: 1px solid #000; + padding: 1em; + margin-bottom: 1em; + background-color: white; + color: black; +} + +.modal { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: none; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + overflow: hidden; + position: fixed; + z-index: 40; +} +.modal-background { + position: absolute; + background-color: rgba(10,10,10,.86); +} +.modal, .modal-background { + bottom: 0; + left: 0; + right: 0; + top: 0; +} + +.modal-content +{ + height: 90vh; + overflow: auto; + z-index: 60; +} + +.modal.is-active { + display: flex; +} +