@lightspeed/design-system-css 0.4.0 → 0.6.1

package/src/themes/types.ts

@@ -1,68 +0,0 @@
-export interface ThemeConfig {
-  theme: Theme
-  mapName: string
-  filename: string
-}
-
-export interface Theme {
-  background: string
-  backgroundInverse: string
-  box: string
-  boxInverse: string
-  boxSupplementary: string
-  do: string
-  doDarker: string
-  doHighlight: string
-  doLighter: string
-  framing: string
-  framingInverse: string
-  go: string
-  goDarker: string
-  goHighlight: string
-  goLighter: string
-  goldenSand: string
-  gothic: string
-  keyline: string
-  keylineInverse: string
-  lavenderPurple: string
-  navIconSelected: string
-  navIconUnselected: string
-  navSideDrawer: string
-  navSideTabs: string
-  navTop: string
-  newYorkPink: string
-  no: string
-  noDarker: string
-  noHighlight: string
-  noLighter: string
-  overlay: string
-  selectArrowsBg: string
-  shadow: string
-  shuttleGray: string
-  sinbad: string
-  success: string
-  supplementary: string
-  supplementaryDarker: string
-  supplementaryHighlight: string
-  supplementaryLighter: string
-  supplementaryText: string
-  tacao: string
-  text: string
-  textAction: string
-  textInverse: string
-  textNav: string
-}
-
-// Some swatches require an "rgb" swatch (e.g. vd-background--rgb) to help apps integrate themes
-export const requiredRgbSwatches = [
-  'background',
-  'box',
-  'boxInverse',
-  'do',
-  'go',
-  'navSideDrawer',
-  'navSideTabs',
-  'navTop',
-  'no',
-  'supplementary',
-]

package/src/themes/xseries/dark.ts

@@ -1,90 +0,0 @@
-import { Theme } from '../types'
-
-const backgrounds = {
-  inert: {
-    background: '#141217',
-    box: '#1E1C21',
-    backgroundInverse: '#F4F2F5',
-    boxInverse: '#FFFFFF',
-    success: '#15BF20',
-  },
-  interactive: {
-    goLighter: '#6054FF',
-    go: '#477BFF',
-    goDarker: '#352ACF',
-    goHighlight: 'rgba(0, 23, 229, .1)',
-    noLighter: '#D4301D',
-    no: '#EB4F29',
-    noDarker: '#A12416',
-    supplementaryLighter: '#3C6996',
-    supplementary: '#5B83AC',
-    supplementaryDarker: '#284563',
-  },
-}
-
-const foregrounds = {
-  inert: {
-    text: '#E7E5E8',
-    textInverse: '#0B0B0B',
-    textAction: '#FFFFFF',
-    selectArrowsBg: '#E7E5E8',
-
-    shadow: 'rgba(0, 0, 0, 0.35)',
-    overlay: 'rgba(43, 54, 61, 0.65)',
-  },
-  borders: {
-    framing: '#27252A',
-    keyline: '#37353A',
-    framingInverse: '#E7E5E8',
-    keylineInverse: '#C9C7CA',
-  },
-}
-
-const discretionary = {
-  goldenSand: '#E6B03D',
-  tacao: '#ED6B44',
-  newYorkPink: '#DE3CEC',
-  gothic: '#A02FB6',
-  lavenderPurple: '#501897',
-  sinbad: '#6952F6',
-  shuttleGray: '#5D5D5D',
-}
-
-const navigation = {
-  // When updating `navTop` ensure you also update the `<meta name="theme-color" content="#0B0B0B" />` in the head of index.html
-  navTop: '#0B0B0B',
-  navSideTabs: '#27252A',
-  navSideDrawer: '#1E1C21',
-  navIconUnselected: '#FFFFFF',
-  navIconSelected: '#E7E5E8',
-}
-
-const deprecated = {
-  boxSupplementary: '#27252A',
-  textNav: '#FFFFFF',
-  supplementaryText: '#5B83AC',
-  supplementaryHighlight: 'rgba(0, 61, 229, .1)',
-  doHighlight: 'rgba(0, 23, 229, .1)',
-  noHighlight: 'rgba(229, 0, 0,.1)',
-  doLighter: '#618EFF',
-  do: '#477BFF',
-  doDarker: '#406FE5',
-}
-
-export const xSeriesDarkThemeByCategory = {
-  backgrounds,
-  foregrounds,
-  discretionary,
-  navigation,
-  deprecated,
-}
-
-export const xSeriesDarkTheme: Theme = {
-  ...backgrounds.inert,
-  ...backgrounds.interactive,
-  ...foregrounds.inert,
-  ...foregrounds.borders,
-  ...discretionary,
-  ...navigation,
-  ...deprecated,
-}

package/src/themes/xseries/light.ts

@@ -1,89 +0,0 @@
-import { Theme } from '../types'
-
-const backgrounds = {
-  inert: {
-    background: '#F4F2F5',
-    box: '#FFFFFF',
-    backgroundInverse: '#141217',
-    boxInverse: '#1E1C21',
-    success: '#0E7B1D',
-  },
-  interactive: {
-    goLighter: '#6054FF',
-    go: '#3F32F5',
-    goDarker: '#352ACF',
-    goHighlight: 'rgba(128, 140, 255, .1)',
-    noLighter: '#D4301D',
-    no: '#BB2A1A',
-    noDarker: '#A12416',
-    supplementaryLighter: '#3C6996',
-    supplementary: '#32577D',
-    supplementaryDarker: '#284563',
-  },
-}
-
-const foregrounds = {
-  inert: {
-    text: '#27252A',
-    textInverse: '#FFFFFF',
-    textAction: '#FFFFFF',
-    selectArrowsBg: '#27252A',
-    shadow: 'rgba(0, 0, 0, 0.35)',
-    overlay: 'rgba(0, 0, 0, 0.35)',
-  },
-  borders: {
-    framing: '#E7E5E8',
-    keyline: '#C9C7CA',
-    framingInverse: '#27252A',
-    keylineInverse: '#37353A',
-  },
-}
-
-const discretionary = {
-  goldenSand: '#E6B03D',
-  tacao: '#ED6B44',
-  newYorkPink: '#DE3CEC',
-  gothic: '#A02FB6',
-  lavenderPurple: '#501897',
-  sinbad: '#6952F6',
-  shuttleGray: '#5D5D5D',
-}
-
-const navigation = {
-  // When updating `navTop` ensure you also update the `<meta name="theme-color" content="#0B0B0B" />` in the head of index.html
-  navTop: '#0B0B0B',
-  navSideTabs: '#E7E5E8',
-  navSideDrawer: '#FFFFFF',
-  navIconUnselected: '#27252A',
-  navIconSelected: '#3F32F5',
-}
-
-const deprecated = {
-  boxSupplementary: '#E7E5E8',
-  textNav: '#FFFFFF',
-  supplementaryText: '#32577D',
-  supplementaryHighlight: 'rgba(76, 124, 255, 0.1)',
-  doHighlight: 'rgba(128, 140, 255, .1)',
-  noHighlight: 'rgba(255, 128, 128, .1)',
-  doLighter: '#6054FF',
-  do: '#3F32F5',
-  doDarker: '#352ACF',
-}
-
-export const xSeriesLightThemeByCategory = {
-  backgrounds,
-  foregrounds,
-  discretionary,
-  navigation,
-  deprecated,
-}
-
-export const xSeriesLightTheme: Theme = {
-  ...backgrounds.inert,
-  ...backgrounds.interactive,
-  ...foregrounds.inert,
-  ...foregrounds.borders,
-  ...discretionary,
-  ...navigation,
-  ...deprecated,
-}

package/src/vend.ui/styles/global/colour/themes/_theme-keys.scss

@@ -1,5 +0,0 @@
-// THIS IS A GENERATED FILE. DO NOT EDIT.
-
-$vd-theme-required-base-keys: background,box,background-inverse,box-inverse,success,go-lighter,go,go-darker,go-highlight,no-lighter,no,no-darker,supplementary-lighter,supplementary,supplementary-darker,text,text-inverse,text-action,select-arrows-bg,shadow,overlay,framing,keyline,framing-inverse,keyline-inverse,golden-sand,tacao,new-york-pink,gothic,lavender-purple,sinbad,shuttle-gray,nav-top,nav-side-tabs,nav-side-drawer,nav-icon-unselected,nav-icon-selected,box-supplementary,text-nav,supplementary--text,supplementary-highlight,do-highlight,no-highlight,do-lighter,do,do-darker;
-$vd-theme-available-rgb-keys: background,box,box-inverse,do,go,nav-side-drawer,nav-side-tabs,nav-top,no,supplementary;
-$vd-theme-available-keys: background,box,background-inverse,box-inverse,success,go-lighter,go,go-darker,go-highlight,no-lighter,no,no-darker,supplementary-lighter,supplementary,supplementary-darker,text,text-inverse,text-action,select-arrows-bg,shadow,overlay,framing,keyline,framing-inverse,keyline-inverse,golden-sand,tacao,new-york-pink,gothic,lavender-purple,sinbad,shuttle-gray,nav-top,nav-side-tabs,nav-side-drawer,nav-icon-unselected,nav-icon-selected,box-supplementary,text-nav,supplementary--text,supplementary-highlight,do-highlight,no-highlight,do-lighter,do,do-darker,background-rgb,box-rgb,box-inverse-rgb,do-rgb,go-rgb,nav-side-drawer-rgb,nav-side-tabs-rgb,nav-top-rgb,no-rgb,supplementary-rgb;

package/src/vend.ui/styles/global/colour/themes/xseries/_theme-dark.scss

@@ -1,53 +0,0 @@
-// THIS IS A GENERATED FILE. DO NOT EDIT.
-
-// stylelint-disable vend/use-colour-function
-
-$vd-xseries-theme-dark: (
-  background:#141217,
-  box:#1E1C21,
-  background-inverse:#F4F2F5,
-  box-inverse:#FFFFFF,
-  success:#15BF20,
-  go-lighter:#6054FF,
-  go:#477BFF,
-  go-darker:#352ACF,
-  go-highlight:rgba(0, 23, 229, .1),
-  no-lighter:#D4301D,
-  no:#EB4F29,
-  no-darker:#A12416,
-  supplementary-lighter:#3C6996,
-  supplementary:#5B83AC,
-  supplementary-darker:#284563,
-  text:#E7E5E8,
-  text-inverse:#0B0B0B,
-  text-action:#FFFFFF,
-  select-arrows-bg:#E7E5E8,
-  shadow:rgba(0, 0, 0, 0.35),
-  overlay:rgba(43, 54, 61, 0.65),
-  framing:#27252A,
-  keyline:#37353A,
-  framing-inverse:#E7E5E8,
-  keyline-inverse:#C9C7CA,
-  golden-sand:#E6B03D,
-  tacao:#ED6B44,
-  new-york-pink:#DE3CEC,
-  gothic:#A02FB6,
-  lavender-purple:#501897,
-  sinbad:#6952F6,
-  shuttle-gray:#5D5D5D,
-  nav-top:#0B0B0B,
-  nav-side-tabs:#27252A,
-  nav-side-drawer:#1E1C21,
-  nav-icon-unselected:#FFFFFF,
-  nav-icon-selected:#E7E5E8,
-  box-supplementary:#27252A,
-  text-nav:#FFFFFF,
-  supplementary--text:#5B83AC,
-  supplementary-highlight:rgba(0, 61, 229, .1),
-  do-highlight:rgba(0, 23, 229, .1),
-  no-highlight:rgba(229, 0, 0,.1),
-  do-lighter:#618EFF,
-  do:#477BFF,
-  do-darker:#406FE5);
-
-// stylelint-enable vend/use-colour-function

package/src/vend.ui/styles/global/colour/themes/xseries/_theme-light.scss

@@ -1,53 +0,0 @@
-// THIS IS A GENERATED FILE. DO NOT EDIT.
-
-// stylelint-disable vend/use-colour-function
-
-$vd-xseries-theme-light: (
-  background:#F4F2F5,
-  box:#FFFFFF,
-  background-inverse:#141217,
-  box-inverse:#1E1C21,
-  success:#0E7B1D,
-  go-lighter:#6054FF,
-  go:#3F32F5,
-  go-darker:#352ACF,
-  go-highlight:rgba(128, 140, 255, .1),
-  no-lighter:#D4301D,
-  no:#BB2A1A,
-  no-darker:#A12416,
-  supplementary-lighter:#3C6996,
-  supplementary:#32577D,
-  supplementary-darker:#284563,
-  text:#27252A,
-  text-inverse:#FFFFFF,
-  text-action:#FFFFFF,
-  select-arrows-bg:#27252A,
-  shadow:rgba(0, 0, 0, 0.35),
-  overlay:rgba(0, 0, 0, 0.35),
-  framing:#E7E5E8,
-  keyline:#C9C7CA,
-  framing-inverse:#27252A,
-  keyline-inverse:#37353A,
-  golden-sand:#E6B03D,
-  tacao:#ED6B44,
-  new-york-pink:#DE3CEC,
-  gothic:#A02FB6,
-  lavender-purple:#501897,
-  sinbad:#6952F6,
-  shuttle-gray:#5D5D5D,
-  nav-top:#0B0B0B,
-  nav-side-tabs:#E7E5E8,
-  nav-side-drawer:#FFFFFF,
-  nav-icon-unselected:#27252A,
-  nav-icon-selected:#3F32F5,
-  box-supplementary:#E7E5E8,
-  text-nav:#FFFFFF,
-  supplementary--text:#32577D,
-  supplementary-highlight:rgba(76, 124, 255, 0.1),
-  do-highlight:rgba(128, 140, 255, .1),
-  no-highlight:rgba(255, 128, 128, .1),
-  do-lighter:#6054FF,
-  do:#3F32F5,
-  do-darker:#352ACF);
-
-// stylelint-enable vend/use-colour-function