From 378b81c35385eac105911b225f476da33bb3489d Mon Sep 17 00:00:00 2001 From: Matt Mascarenhas Date: Wed, 20 May 2020 23:47:23 +0100 Subject: [PATCH] Style the NAV menus --- cmuratori/hero/cinera__hero.css | 57 +++++++++++++++++ miotatsu/riscy/cinera__riscy.css | 85 +++++++++++++++++++++----- pervognsen/bitwise/cinera__bitwise.css | 57 +++++++++++++++++ 3 files changed, 185 insertions(+), 14 deletions(-) diff --git a/cmuratori/hero/cinera__hero.css b/cmuratori/hero/cinera__hero.css index dd9fe10..2f73034 100644 --- a/cmuratori/hero/cinera__hero.css +++ b/cmuratori/hero/cinera__hero.css @@ -16,6 +16,63 @@ * */ +/* NAV */ +.cineraNavDropdown.hero .cineraNavTitle, +.cineraNavHorizontal.hero li a, +.cineraNavHorizontal.hero li.current > a:hover, +.cineraNavPlain.hero a, +.cineraNavPlain.hero li.current > a:hover { + color: #FFFFFF; +} + +.cineraNavDropdown.hero .cineraNavTitle, +/* NOTE(matt): Dropdown Current (swap with Non-current, to taste) */ +.cineraNavDropdown.hero .cineraNavHorizontal.hero li.current a, +.cineraNavDropdown.hero .cineraNavHorizontal.hero li.current a:hover, +/* */ +.cineraNavHorizontal.hero li a { + background-color: #161616; +} + +/* Dropdown Non-current (swap with Current, to taste) */ +.cineraNavDropdown.hero .cineraNavHorizontal.hero li a, +/* */ +.cineraNavHorizontal.hero li.current a, +.cineraNavHorizontal.hero li.current a:hover { + background-color: #000000; +} + +.cineraNavDropdown.hero .cineraNavHorizontal.hero li a:hover, +.cineraNavHorizontal.hero li a:hover { + background-color: #080808; +} + +.cineraNavHorizontal.hero, +.cineraNavHorizontal.hero li a { + border-color: #222222; +} + +.cineraNavHorizontal.hero li.current > ul > li:first-child > a, +.cineraNavHorizontal.hero li.current > ul > li:first-child > ul > li:first-child > a { + border-left-color: #222222; +} + +.cineraNavHorizontal.hero li a:hover, +.cineraNavPlain.hero a:hover { + color: #0471C5; +} + +.cineraNavHorizontal.hero li.current a, +.cineraNavHorizontal.hero li.current a:hover { + border-bottom-color: transparent; +} + +.cineraNavHorizontal.hero li.current ul li a { + border-bottom-color: transparent; + border-left-color: transparent; +} +/* /NAV */ + #cineraIndexControl.hero .cineraQueryContainer .inputContainer #query, #cineraIndexControl.hero .cineraFilterProject, diff --git a/miotatsu/riscy/cinera__riscy.css b/miotatsu/riscy/cinera__riscy.css index 15c6edd..054d6b8 100644 --- a/miotatsu/riscy/cinera__riscy.css +++ b/miotatsu/riscy/cinera__riscy.css @@ -1,14 +1,14 @@ /* * Base colours: - * background-color: #EEE; - * color: #000; + * background-color: #EEEEEE; + * color: #000000; * * :hover * background-color: #FFF8E7; * * .progress - background-color: rgb(42, 49, 114); - color: #FFF; + background-color: rgb(42, 49, 114); / #2A3172 + color: #FFFFFF; * * .faded background-color: rgba(42, 49, 114, 0.7); @@ -16,6 +16,63 @@ * */ +/* NAV */ +.cineraNavDropdown.riscy .cineraNavTitle, +.cineraNavHorizontal.riscy li a, +.cineraNavHorizontal.riscy li.current > a:hover, +.cineraNavPlain.riscy a, +.cineraNavPlain.riscy li.current > a:hover { + color: #2A3172; +} + +.cineraNavDropdown.riscy .cineraNavTitle, +/* NOTE(matt): Dropdown Current (swap with Non-current, to taste) */ +.cineraNavDropdown.riscy .cineraNavHorizontal.riscy li.current a, +.cineraNavDropdown.riscy .cineraNavHorizontal.riscy li.current a:hover, +/* */ +.cineraNavHorizontal.riscy li a { + background-color: #FFF8E7; +} + +/* Dropdown Non-current (swap with Current, to taste) */ +.cineraNavDropdown.riscy .cineraNavHorizontal.riscy li a, +/* */ +.cineraNavHorizontal.riscy li.current a, +.cineraNavHorizontal.riscy li.current a:hover { + background-color: #FFFFFF; +} + +.cineraNavDropdown.riscy .cineraNavHorizontal.riscy li a:hover, +.cineraNavHorizontal.riscy li a:hover { + background-color: #FFFCF3; +} + +.cineraNavHorizontal.riscy, +.cineraNavHorizontal.riscy li a { + border-color: #F6B21A; +} + +.cineraNavHorizontal.riscy li.current > ul > li:first-child > a, +.cineraNavHorizontal.riscy li.current > ul > li:first-child > ul > li:first-child > a { + border-left-color: #F6B21A; +} + +.cineraNavHorizontal.riscy li a:hover, +.cineraNavPlain.riscy a:hover { + color: #F6B21A; +} + +.cineraNavHorizontal.riscy li.current a, +.cineraNavHorizontal.riscy li.current a:hover { + border-bottom-color: transparent; +} + +.cineraNavHorizontal.riscy li.current ul li a { + border-bottom-color: transparent; + border-left-color: transparent; +} +/* /NAV */ + #cineraIndexControl.riscy .cineraQueryContainer .inputContainer #query, #cineraIndexControl.riscy .cineraFilterProject, @@ -35,7 +92,7 @@ .cineraPlayerContainer .markers_container.riscy, .cineraPlayerContainer .markers_container.riscy > .episodeMarker, .cineraPlayerContainer .markers_container.riscy > .markers .marker { - background-color: #EEE; + background-color: #EEEEEE; } .cineraDefaultMediumIndicator { @@ -48,7 +105,7 @@ .cineraIndexProject.riscy .cineraProjectTitle, #cineraResults .dayContainer:nth-child(2n).riscy, #cineraIndex .cineraIndexProject.riscy .cineraIndexEntries div:nth-child(2n) { - background-color: #FFF; + background-color: #FFFFFF; } #cineraResults .markerList.riscy > .marker, @@ -88,16 +145,16 @@ .cineraPlayerContainer .markers_container.riscy > .episodeMarker, .cineraPlayerContainer .markers_container.riscy > .markers .marker > .cineraContent, .cineraPlayerContainer .markers_container.riscy > .markers .marker > .cineraContent .categoryMedium { - color: #000; + color: #000000; } /* Visited Indicator */ #cineraIndex .cineraIndexProject.riscy .cineraIndexEntries div a::before { - color: #EEE; + color: #EEEEEE; } #cineraIndex .cineraIndexProject.riscy .cineraIndexEntries div:nth-child(2n) a::before { - color: #FFF; + color: #FFFFFF; } #cineraIndex .cineraIndexProject.riscy .cineraIndexEntries div a:visited::before { @@ -159,7 +216,7 @@ .cineraPlayerContainer .markers_container.riscy > .markers .marker > .progress .cineraContent, .cineraPlayerContainer .markers_container.riscy > .markers .marker > .progress .cineraContent .categoryMedium { background-color: rgb(42, 49, 114); - color: #FFF; + color: #FFFFFF; } /*.cineraMenus.riscy > .menu > .refs .ref.current:hover,*/ @@ -213,18 +270,18 @@ */ @keyframes riscy_fade_mode { - 0% { color: #FFF; } - 100% { color: #000; } + 0% { color: #FFFFFF; } + 100% { color: #000000; } } @keyframes riscy_fade_text { - 0% { color: #000; } + 0% { color: #000000; } 100% { color: #888; } } @keyframes riscy_fade_background { 0% { background-color: rgba(246, 178, 26, 0.8);} - 100% { background-color: #EEE; } + 100% { background-color: #EEEEEE; } } /* TODO(matt): Get this to work! */ diff --git a/pervognsen/bitwise/cinera__bitwise.css b/pervognsen/bitwise/cinera__bitwise.css index d7991bc..c1f4832 100644 --- a/pervognsen/bitwise/cinera__bitwise.css +++ b/pervognsen/bitwise/cinera__bitwise.css @@ -16,6 +16,63 @@ * border-color: #8EB08F; */ +/* NAV */ +.cineraNavDropdown.bitwise .cineraNavTitle, +.cineraNavHorizontal.bitwise li a, +.cineraNavHorizontal.bitwise li.current > a:hover, +.cineraNavPlain.bitwise a, +.cineraNavPlain.bitwise li.current > a:hover { + color: #FFFFFF; +} + +.cineraNavDropdown.bitwise .cineraNavTitle, +/* NOTE(matt): Dropdown Current (swap with Non-current, to taste) */ +.cineraNavDropdown.bitwise .cineraNavHorizontal.bitwise li.current a, +.cineraNavDropdown.bitwise .cineraNavHorizontal.bitwise li.current a:hover, +/* */ +.cineraNavHorizontal.bitwise li a { + background-color: #161616; +} + +/* Dropdown Non-current (swap with Current, to taste) */ +.cineraNavDropdown.bitwise .cineraNavHorizontal.bitwise li a, +/* */ +.cineraNavHorizontal.bitwise li.current a, +.cineraNavHorizontal.bitwise li.current a:hover { + background-color: #000000; +} + +.cineraNavDropdown.bitwise .cineraNavHorizontal.bitwise li a:hover, +.cineraNavHorizontal.bitwise li a:hover { + background-color: #080808; +} + +.cineraNavHorizontal.bitwise, +.cineraNavHorizontal.bitwise li a { + border-color: #8EB08F; +} + +.cineraNavHorizontal.bitwise li.current > ul > li:first-child > a, +.cineraNavHorizontal.bitwise li.current > ul > li:first-child > ul > li:first-child > a { + border-left-color: #8EB08F; +} + +.cineraNavHorizontal.bitwise li a:hover, +.cineraNavPlain.bitwise a:hover { + color: #7ABDE8; +} + +.cineraNavHorizontal.bitwise li.current a, +.cineraNavHorizontal.bitwise li.current a:hover { + border-bottom-color: transparent; +} + +.cineraNavHorizontal.bitwise li.current ul li a { + border-bottom-color: transparent; + border-left-color: transparent; +} +/* /NAV */ + #cineraIndexControl.bitwise .cineraQueryContainer .inputContainer #query, #cineraIndexControl.bitwise .cineraFilterProject, #cineraResults .dayContainer.bitwise,