From 2354b10eb5e9c7382726bc5e6e041ea30a903c90 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Mon, 16 Jul 2018 01:11:53 +0200 Subject: Add admin dashboard (#8029) --- app/javascript/styles/application.scss | 1 + app/javascript/styles/mastodon/dashboard.scss | 69 +++++++++++++++++++++++++++ 2 files changed, 70 insertions(+) create mode 100644 app/javascript/styles/mastodon/dashboard.scss (limited to 'app/javascript/styles') diff --git a/app/javascript/styles/application.scss b/app/javascript/styles/application.scss index f207c02a6..7b3b10dfe 100644 --- a/app/javascript/styles/application.scss +++ b/app/javascript/styles/application.scss @@ -21,5 +21,6 @@ @import 'mastodon/about'; @import 'mastodon/tables'; @import 'mastodon/admin'; +@import 'mastodon/dashboard'; @import 'mastodon/rtl'; @import 'mastodon/accessibility'; diff --git a/app/javascript/styles/mastodon/dashboard.scss b/app/javascript/styles/mastodon/dashboard.scss new file mode 100644 index 000000000..949ca733f --- /dev/null +++ b/app/javascript/styles/mastodon/dashboard.scss @@ -0,0 +1,69 @@ +.dashboard__counters { + display: flex; + flex-wrap: wrap; + margin: 0 -5px; + margin-bottom: 20px; + + & > div { + box-sizing: border-box; + flex: 0 0 33.333%; + padding: 0 5px; + margin-bottom: 10px; + + & > div, + & > a { + padding: 20px; + background: lighten($ui-base-color, 4%); + border-radius: 4px; + } + + & > a { + text-decoration: none; + color: inherit; + display: block; + + &:hover, + &:focus, + &:active { + background: lighten($ui-base-color, 8%); + } + } + } + + &__num { + text-align: center; + font-weight: 500; + font-size: 24px; + color: $primary-text-color; + font-family: 'mastodon-font-display', sans-serif; + margin-bottom: 20px; + } + + &__label { + font-size: 14px; + color: $darker-text-color; + text-align: center; + font-weight: 500; + } +} + +.dashboard__widgets { + display: flex; + flex-wrap: wrap; + margin: 0 -5px; + + & > div { + flex: 0 0 33.333%; + margin-bottom: 20px; + + & > div { + padding: 0 5px; + } + } + + a:not(.name-tag) { + color: $ui-secondary-color; + font-weight: 500; + text-decoration: none; + } +} -- cgit