Init themes

sass/themes/default.sass

@@ -0,0 +1,107 @@
+\:root
+  // Initial variables
+  --black: #{$black}
+  --black-bis: #{$black-bis}
+  --black-ter: #{$black-ter}
+  --grey-darker: #{$grey-darker}
+  --grey-dark: #{$grey-dark}
+  --grey: #{$grey}
+  --grey-light: #{$grey-light}
+  --grey-lighter: #{$grey-lighter}
+  --grey-lightest: #{$grey-lightest}
+  --white-ter: #{$white-ter}
+  --white-bis: #{$white-bis}
+  --white: #{$white}
+  --orange: #{$orange}
+  --yellow: #{$yellow}
+  --green: #{$green}
+  --turquoise: #{$turquoise}
+  --cyan: #{$cyan}
+  --blue: #{$blue}
+  --purple: #{$purple}
+  --red: #{$red}
+  --family-sans-serif: #{$family-sans-serif}
+  --family-monospace: #{$family-monospace}
+  --render-mode: #{$render-mode}
+  --size-1: #{$size-1}
+  --size-2: #{$size-2}
+  --size-3: #{$size-3}
+  --size-4: #{$size-4}
+  --size-5: #{$size-5}
+  --size-6: #{$size-6}
+  --size-7: #{$size-7}
+  --weight-light: #{$weight-light}
+  --weight-normal: #{$weight-normal}
+  --weight-medium: #{$weight-medium}
+  --weight-semibold: #{$weight-semibold}
+  --weight-bold: #{$weight-bold}
+  --block-spacing: #{$block-spacing}
+  --easing: #{$easing}
+  --radius-small: #{$radius-small}
+  --radius: #{$radius}
+  --radius-large: #{$radius-large}
+  --radius-rounded: #{$radius-rounded}
+  --speed: #{$speed}
+  // Derived variables
+  --primary: var(--turquoise)
+  --info: var(--cyan)
+  --success: var(--green)
+  --warning: var(--yellow)
+  --danger: var(--red)
+  --light: var(--white-ter)
+  --dark: var(--grey-darker)
+  --orange-invert: #{findColorInvert($orange)}
+  --yellow-invert: #{findColorInvert($yellow)}
+  --green-invert: #{findColorInvert($green)}
+  --turquoise-invert: #{findColorInvert($turquoise)}
+  --cyan-invert: #{findColorInvert($cyan)}
+  --blue-invert: #{findColorInvert($blue)}
+  --purple-invert: #{findColorInvert($purple)}
+  --red-invert: #{findColorInvert($red)}
+  --primary-invert: #{findColorInvert($primary)}
+  --primary-light: findLightColor($primary)
+  --primary-dark: findDarkColor($primary)
+  --info-invert: #{findColorInvert($info)}
+  --info-light: findLightColor($info)
+  --info-dark: findDarkColor($info)
+  --success-invert: #{findColorInvert($success)}
+  --success-light: findLightColor($success)
+  --success-dark: findDarkColor($success)
+  --warning-invert: #{findColorInvert($warning)}
+  --warning-light: findLightColor($warning)
+  --warning-dark: findDarkColor($warning)
+  --danger-invert: #{findColorInvert($danger)}
+  --danger-light: findLightColor($danger)
+  --danger-dark: findDarkColor($danger)
+  --light-invert: #{findColorInvert($light)}
+  --dark-invert: #{findColorInvert($dark)}
+  --scheme-main: var(--white)
+  --scheme-main-bis: var(--white-bis)
+  --scheme-main-ter: var(--white-ter)
+  --scheme-invert: var(--black)
+  --scheme-invert-bis: var(--black-bis)
+  --scheme-invert-ter: var(--black-ter)
+  --background: var(--white-ter)
+  --border: var(--grey-lighter)
+  --border-hover: var(--grey-light)
+  --border-light: var(--grey-lightest)
+  --border-light-hover: var(--grey-light)
+  --text: var(--grey-dark)
+  --text-invert: #{findColorInvert($text)}
+  --text-light: var(--grey)
+  --text-strong: var(--grey-darker)
+  --code: var(--red)
+  --code-background: var(--background)
+  --pre: var(--text)
+  --pre-background: var(--background)
+  --link: var(--blue)
+  --link-invert: #{findColorInvert($link)}
+  --link-light: findLightColor($link)
+  --link-dark: findDarkColor($link)
+  --link-visited: var(--purple)
+  --link-hover: var(--grey-darker)
+  --link-hover-border: var(--grey-light)
+  --link-focus: var(--grey-darker)
+  --link-focus-border: var(--blue)
+  --link-active: var(--grey-darker)
+  --link-active-border: var(--grey-dark)