From 9f43a4b276d36596a08ba9acf2f6bd045773e6af Mon Sep 17 00:00:00 2001
From: Randall Morey <randall@randallmorey.com>
Date: Thu, 1 Oct 2020 16:19:53 -0400
Subject: [PATCH] chore: tweak styles to align with design

---
 addons/rose/addon/styles/rose/components/card/_link.scss    | 4 ++++
 addons/rose/addon/styles/rose/components/header/_index.scss | 3 ++-
 addons/rose/addon/styles/rose/variables/color/_css.scss     | 2 +-
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/addons/rose/addon/styles/rose/components/card/_link.scss b/addons/rose/addon/styles/rose/components/card/_link.scss
index a62df13f8..c31ccbdbd 100644
--- a/addons/rose/addon/styles/rose/components/card/_link.scss
+++ b/addons/rose/addon/styles/rose/components/card/_link.scss
@@ -1,6 +1,8 @@
 @use '../../variables/sizing';
 @use '../../utilities/type';
 
+$xxxs: sizing.rems(xxxs); // 2
+
 .rose-card-link {
   @include type.type(s);
   border: sizing.rems(xxxxs) solid var(--ui-gray-subtler-2);
@@ -9,6 +11,8 @@
   display: inline-flex;
   flex-direction: column;
   margin: 0 sizing.rems(m) sizing.rems(m) 0;
+  box-shadow: 0 $xxxs $xxxs rgba(var(--stark-components), var(--opacity-4)),
+    0 $xxxs $xxxs rgba(var(--stark-components), var(--opacity-4));
 
   a {
     text-decoration: none;
diff --git a/addons/rose/addon/styles/rose/components/header/_index.scss b/addons/rose/addon/styles/rose/components/header/_index.scss
index 6ba8aba30..f464a4f80 100644
--- a/addons/rose/addon/styles/rose/components/header/_index.scss
+++ b/addons/rose/addon/styles/rose/components/header/_index.scss
@@ -12,7 +12,8 @@
   display: grid;
   grid-template-areas: 'brand nav utilities';
   grid-template-columns: 0.01fr auto 1fr;
-  background: var(--black) linear-gradient(90deg, #191a1c 0%, #1b212d 100%);
+  background: var(--black);
+  box-shadow: inset 0 -#{sizing.rems(xxxxs)} 0 var(--ui-border-subtler-1);
 }
 
 @media (max-width: media.width(small)) {
diff --git a/addons/rose/addon/styles/rose/variables/color/_css.scss b/addons/rose/addon/styles/rose/variables/color/_css.scss
index cb000c5df..5c910e93a 100644
--- a/addons/rose/addon/styles/rose/variables/color/_css.scss
+++ b/addons/rose/addon/styles/rose/variables/color/_css.scss
@@ -83,7 +83,7 @@
 @media (prefers-color-scheme: dark) {
   :root {
     // poles
-    --subtle: #{darken(color(ui-gray, 900), 3%)};
+    --subtle: var(--black);
     --stark: #{color(ui-gray, 100)};
     --stark-components: 255, 255, 255;