styles.scss in jekyll-theme-easy-wedding-0.1.22

- old
+ new

@@ -11,10 +11,11 @@
   }
 }
 
 // Theme Variables
 $text-color: {{site.data.settings.theme.text_color | default: "#404040"}};
+$text-color-lighter: scale-color({{site.data.settings.theme.text_color | default: "#404040"}}, $lightness: 70%);
 
 $primary-color: {{site.data.settings.theme.primary_color | default: "#fff"}};
 $primary-text-color: text-clr($primary-color);
 $primary-color-darker: scale-color({{site.data.settings.theme.primary_color | default: "#fff"}}, $lightness: -10%);
 $primary-text-color-darker: text-clr($primary-color-darker);
@@ -31,10 +32,11 @@
 $accent-color: {{site.data.settings.theme.accent_color | default: "#219ab3"}};
 $accent-color-darker: scale-color({{site.data.settings.theme.accent_color | default: "#fff"}}, $lightness: -10%);
 $accent-color-darkest: scale-color({{site.data.settings.theme.accent_color | default: "#fff"}}, $lightness: -30%);
 
 $background-color: {{site.data.settings.theme.background_color | default: "#fff"}};
+$background-color-lighter: scale-color({{site.data.settings.theme.background_color | default: "#fff"}}, $lightness: 50%);
 
 :root {
     --intro-background: radial-gradient(ellipse at center, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 0%,
              rgba(0,0,0,0.65) 100%),url({{site.data.settings.hero_image}}) no-repeat center center scroll;
     
@@ -47,10 +49,11 @@
         --intro-background-position: {{site.data.settings.mobile_hero_position | default: "center center"}};
         {% endif %}
     }
 
     --text-color: #{$text-color};
+    --text-color-lighter: #{$text-color-lighter};
 
     --primary-color: #{$primary-color};
     --primary-color-darker: #{$primary-color-darker};
     --primary-color-darkest: #{$primary-color-darkest};
     --primary-text-color: #{$primary-text-color};
@@ -67,6 +70,7 @@
     --accent-color: #{$accent-color};
     --accent-color-darker: #{$accent-color-darker};
     --accent-color-darkest: #{$accent-color-darkest};
 
     --background-color: #{$background-color};
+    --background-color-lighter: #{$background-color-lighter};
 }