@appartmint/mint 1.3.0 → 1.3.1

package/src/scss/imports/util/_vars.scss

@@ -0,0 +1,262 @@
+/// _vars.scss - Global variables
+/// @author App Art Mint LLC
+///
+/// @group Vars
+@charset 'utf-8';
+
+/// Global Colors
+$bitcoin: #FF9900;
+$ethereum: #3C3C3D;
+$venmo: #008CFF;
+$facebook: #3b5998;
+$twitter: #1da1f2;
+$youtube: #F00;
+$apple: #DDD;
+$apple-music: #fc3c44;
+$spotify: #84bd00;
+$soundcloud: #f26f23;
+$bandcamp: #629aa9;
+$amazon-0: #F90;
+$amazon-1: #146eb4;
+$napster-0: #2ca6de;
+$napster-1: #fdb813;
+$google-play-0: #f55a34;
+$google-play-1: #ffd119;
+$google-play-2: #ff8c00;
+$instagram-0: #8a3ab9;
+$instagram-1: #4c68d7;
+$instagram-2: #cd486b;
+$instagram-3: #fbad50;
+$instagram-4: #fccc63;
+$instagram-5: #bc2a8d;
+$instagram-6: #e95950;
+
+/// Application Colors
+$black: #000 !default;
+$white: #fff !default;
+$grey: #888 !default;
+$trans-light: rgba(255, 255, 255, 0) !default;
+$trans-dark: rgba(0, 0, 0, 0) !default;
+
+$brand: #bada55 !default;
+$accent: #483d8b !default;
+$success: #208a20 !default;
+$danger: #ff4d4d !default;
+$warning: #ffaa22 !default;
+$info: $brand !default;
+
+$fore: lighten($black, 10%) !default;
+$back: darken($white, 10%) !default;
+
+/// Fonts
+$font-primary: sans-serif !default;
+$font-secondary: serif !default;
+$font-backups: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji' !default;
+$font-secondary-backups: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji' !default;
+$font-height: 1.25 !default;
+
+/// Font Sizes
+$font-size-tiny: (
+    h1: 15vw,
+    h2: 12vw,
+    h3: 10vw,
+    h4: 8vw,
+    h5: 7vw,
+    h6: 6vw,
+    p: 1rem,
+) !default;
+$font-size-mobile: (
+    h1: 2.5rem,
+    h2: 2rem,
+    h3: 1.75rem,
+    h4: 1.5rem,
+    h5: 1.25rem,
+    h6: 1.125rem,
+    p: 1rem,
+) !default;
+$font-size-desktop: (
+    h1: 3rem,
+    h2: 2.5rem,
+    h3: 2rem,
+    h4: 1.75rem,
+    h5: 1.5rem,
+    h6: 1.25rem,
+    p: 1.125rem,
+) !default;
+
+/// Structure
+$grid-gap: 2rem !default;
+
+/// Outline width
+$border-width: 0.125rem !default;
+$border-radius: 1rem !default;
+
+/// Root
+$root-bg-image: null !default;
+$root-bg-filter: null !default;
+$root-bg-size: null !default;
+$root-bg-position: null !default;
+
+/// Header
+$header-height: 4rem !default;
+$header-break: sm !default;
+$header-link-border-radius: $border-radius !default;
+
+/// Footer
+$footer-back: back !default;
+$footer-heel-back: brand-6 !default;
+$footer-shadow: null !default;
+
+/// Default Shadows
+$shadow-color: glow-2 !default;
+$shadow-size: 0 0 2rem -0.5rem !default;
+
+/// Images
+$image-shadow-size: 0.5rem !default;
+
+/// Buttons
+$link-color: brand-4 !default;
+$link-color-hover: accent-2 !default;
+
+$menu-bar-height: 0.4rem !default;
+$menu-bar-width: $menu-bar-height * 8 !default;
+$menu-btn-height: $menu-bar-height * 8 !default;
+$menu-btn-padding: $menu-bar-height * 1.5 !default;
+$menu-bar-color: fore !default;
+$menu-btn-color: shadow-6 !default;
+$menu-btn-shadow-color: $shadow-color !default;
+$menu-btn-shadow-size: $shadow-size !default;
+
+$btn-radius: $border-radius !default;
+$btn-fore: fore !default;
+$btn-fore-alt: $btn-fore !default;
+$btn-fore-hover: back !default;
+$btn-fore-alt-hover: $btn-fore-hover !default;
+$btn-back-alt: trans !default;
+$btn-back-alt-hover: accent-2 !default;
+
+$btn-padding-v: 0.5rem !default;
+$btn-padding-h: 1rem !default;
+$btn-padding-adjust: 0.75rem !default;
+
+$pill-radius: $border-radius !default;
+
+/// Cards
+$card-bg-color: back !default;
+$card-padding: 1.5rem !default;
+$card-radius: $border-radius !default;
+$card-shadow-color: $shadow-color !default;
+$card-shadow-size: $shadow-size !default;
+$card-logo-size: 4rem !default;
+
+/// Texture
+$texture-padding: 1rem !default;
+
+$texture-bg: null !default;
+$texture-bg-size: cover !default;
+$texture-bg-position: top !default;
+$texture-blend: null !default;
+$texture-filter: null !default;
+$texture-opacity: 1 !default;
+
+$texture-alt-bg: null !default;
+$texture-alt-num: 0 !default;
+$texture-alt-opacity: 1 !default;
+$texture-alt-bg-size: cover !default;
+$texture-alt-bg-position: center !default;
+$texture-alt-mask: null !default;
+$texture-alt-blend: null !default;
+
+$texture-border-width: 1.25rem !default;
+$texture-border-type: solid !default;
+$texture-border-color: null !default;
+$texture-border-image: null !default;
+$texture-border-slice: 42 42 !default;
+$texture-border-repeat: round !default;
+
+/// Backgrounds
+$back-bg-blur: 0.15vw !default;
+
+/// Material
+$mat-table-bg: back !default;
+$mat-table-fore: fore !default;
+$mat-select-bg: brand-4 !default;
+
+/// Amplify
+$amp-font-primary: fore !default;
+$amp-background-error: glow-0 !default;
+$amp-font-warning: warning !default;
+$amp-font-success: success !default;
+$amp-font-info: info !default;
+$amp-border-width: $border-width !default;
+
+
+/// Themes
+$theme-default: light !default;
+
+/// Default Theme (light)
+/// Buttons
+$btn-back-default: brand-2;
+$btn-back: $btn-back-default !default;
+
+$btn-border-default: brand-4;
+$btn-border: $btn-border-default !default;
+
+/// Header
+$header-back-default: brand-2;
+$header-back: $header-back-default !default;
+
+$header-fore-default: fore;
+$header-fore: $header-fore-default !default;
+
+$header-link-back-hover-default: shadow-5;
+$header-link-back-hover: $header-link-back-hover-default !default;
+
+$header-link-fore-default: fore;
+$header-link-fore: $header-link-fore-default !default;
+
+$header-link-fore-hover-default: back;
+$header-link-fore-hover: $header-link-fore-hover-default !default;
+
+/// Footer
+$footer-heel-fore-default: back;
+$footer-heel-fore: $footer-heel-fore-default !default;
+
+/// Amplify
+$amp-border-primary-default: brand-5;
+$amp-border-primary: $amp-border-primary-default !default;
+$amp-border-focus-default: brand-4;
+$amp-border-focus: $amp-border-focus-default !default;
+$amp-font-hover-default: brand-3;
+$amp-font-hover: $amp-font-hover-default !default;
+$amp-font-interactive-default: brand-5;
+$amp-font-interactive: $amp-font-interactive-default !default;
+$amp-font-secondary-default: brand-6;
+$amp-font-secondary: $amp-font-secondary-default !default;
+$amp-font-error-default: danger-5 !default;
+$amp-font-error: $amp-font-error-default !default;
+
+
+/// Dark Theme
+@if ($theme-default == dark) {
+
+    /// Buttons
+    $btn-back: if($btn-back != $btn-back-default, $btn-back, brand-5);
+    $btn-border: if($btn-border != $btn-border-default, $btn-border, brand-2);
+
+    /// Header
+    $header-back: if($header-back != $header-back-default, $header-back, brand-4);
+    $header-fore: if($header-fore != $header-fore-default, $header-fore, back);
+    $header-link-back-hover: if($header-link-back-hover != $header-link-back-hover-default, $header-link-back-hover, glow-5);
+
+    /// Footer
+    $footer-heel-fore: if($footer-heel-fore != $footer-heel-fore-default, $footer-heel-fore, fore);
+
+	/// Amplify
+	$amp-border-primary: if($amp-border-primary != $amp-border-primary-default, $amp-border-primary, brand-1);
+	$amp-border-focus: if($amp-border-focus != $amp-border-focus-default, $amp-border-focus, brand-3);
+	$amp-font-hover: if($amp-font-hover != $amp-font-hover-default, $amp-font-hover, brand-0);
+	$amp-font-interactive: if($amp-font-interactive != $amp-font-interactive-default, $amp-font-interactive, brand-1);
+	$amp-font-secondary: if($amp-font-secondary != $amp-font-secondary-default, $amp-font-secondary, brand-0);
+	$amp-font-error: if($amp-font-error != $amp-font-error-default, $amp-font-error, danger-4);
+}

package/src/scss/mint.scss

@@ -0,0 +1,7 @@
+/// mint.scss - Front-end library of App Art Mint LLC
+/// @author App Art Mint LLC
+/// 
+/// @group Mint
+
+/// Forwards
+@use './imports';

package/src/scss/noscript.scss

@@ -0,0 +1,14 @@
+/// noscript.scss - Styles for when JavaScript is disabled
+/// @author App Art Mint LLC
+/// 
+/// @group Main
+@charset 'utf-8';
+
+/// Imports
+@use './imports/util' as *;
+
+#{id(header)} {
+    #{id(wrapper)} {
+        position: unset !important;
+    }
+}