From f8f06f9fad453bd0737d6ecaa7685e787a42d4d9 Mon Sep 17 00:00:00 2001 From: Noah Loomans Date: Tue, 30 Jan 2018 13:14:54 +0100 Subject: Add styling to week selector --- src/client/style/_component-week-selector.scss | 38 ++++++++++++++++++++++++++ src/client/style/index.scss | 1 + 2 files changed, 39 insertions(+) create mode 100644 src/client/style/_component-week-selector.scss (limited to 'src/client/style') diff --git a/src/client/style/_component-week-selector.scss b/src/client/style/_component-week-selector.scss new file mode 100644 index 0000000..0d7696b --- /dev/null +++ b/src/client/style/_component-week-selector.scss @@ -0,0 +1,38 @@ +.week-selector { + display: flex; + padding: 8px; + padding-bottom: 0; + color: white; + align-items: center; + + .text { + flex-grow: 1; + text-align: center; + } + + button { + background-color: initial; + border: initial; + color: inherit; + padding: 8px; + border-radius: 4px; + + svg { + font-size: 2em; + } + + &:focus { + background-color: #D32F2F; + outline: none; + } + + &:active { + background-color: #B81111; + outline: none; + } + + &::-moz-focus-inner { + border: 0; // Remove the dotted line outline from Firefox + } + } +} diff --git a/src/client/style/index.scss b/src/client/style/index.scss index 763a329..e6ca14d 100644 --- a/src/client/style/index.scss +++ b/src/client/style/index.scss @@ -12,3 +12,4 @@ body { @import "component-search"; @import "component-help-box"; +@import "component-week-selector"; -- cgit v1.1