@ornikar/bumper 2.0.1-canary.7572adc2e30f541d2bcef92dd996237207ebbb9c.0 → 2.0.1-canary.79e367e962c957c016c4df67dbcf515c8f45ff0e.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ornikar/bumper",
-  "version": "2.0.1-canary.7572adc2e30f541d2bcef92dd996237207ebbb9c.0",
+  "version": "2.0.1-canary.79e367e962c957c016c4df67dbcf515c8f45ff0e.0",
   "license": "MIT",
   "repository": {
     "directory": "@ornikar/bumper",

package/src/themes/__snapshots__/light.stories.tsx.snap

@@ -41,7 +41,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -84,7 +84,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -127,7 +127,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -170,7 +170,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#563B56",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -213,7 +213,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#563B56",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -256,7 +256,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#563B56",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -299,7 +299,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -342,7 +342,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -385,7 +385,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#563B56",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -428,7 +428,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -471,7 +471,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -514,7 +514,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -557,7 +557,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -600,7 +600,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -643,7 +643,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -686,7 +686,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#563B56",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -729,7 +729,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -772,7 +772,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -815,7 +815,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -858,7 +858,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -901,7 +901,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -944,7 +944,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -987,7 +987,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1030,7 +1030,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1073,7 +1073,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1116,7 +1116,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1159,7 +1159,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1202,7 +1202,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1245,7 +1245,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1288,7 +1288,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1331,7 +1331,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1374,7 +1374,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1417,7 +1417,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1460,7 +1460,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1503,7 +1503,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1546,7 +1546,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1589,7 +1589,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1632,7 +1632,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1675,7 +1675,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1718,7 +1718,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1761,7 +1761,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1804,7 +1804,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1847,7 +1847,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1874,12 +1874,12 @@ exports[`bumper/Theme Light 1`] = `
         }
         suppressHighlighting={true}
       >
-        #EAE3D6
+        #A8A8A8
       </Text>
       <View
         style={
           {
-            "backgroundColor": "#EAE3D6",
+            "backgroundColor": "#A8A8A8",
             "height": 20,
             "width": 20,
           }
@@ -1890,7 +1890,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#563B56",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1933,7 +1933,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#563B56",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -1960,55 +1960,12 @@ exports[`bumper/Theme Light 1`] = `
         }
         suppressHighlighting={true}
       >
-        #FFFFFF33
-      </Text>
-      <View
-        style={
-          {
-            "backgroundColor": "#FFFFFF33",
-            "height": 20,
-            "width": 20,
-          }
-        }
-      />
-    </View>
-    <View
-      style={
-        {
-          "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
-          "borderBottomWidth": 2,
-          "borderStyle": "solid",
-          "flexDirection": "column",
-          "paddingBottom": 8,
-          "paddingTop": 8,
-        }
-      }
-    >
-      <Text
-        style={
-          {
-            "fontFamily": "GTStandard",
-          }
-        }
-        suppressHighlighting={true}
-      >
-        border.base.accent
-      </Text>
-      <Text
-        style={
-          {
-            "fontFamily": "GTStandard",
-          }
-        }
-        suppressHighlighting={true}
-      >
-        #563B56
+        #FFFFFF99
       </Text>
       <View
         style={
           {
-            "backgroundColor": "#563B56",
+            "backgroundColor": "#FFFFFF99",
             "height": 20,
             "width": 20,
           }
@@ -2019,7 +1976,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -2062,7 +2019,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -2105,7 +2062,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -2148,7 +2105,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",
@@ -2191,7 +2148,7 @@ exports[`bumper/Theme Light 1`] = `
       style={
         {
           "backgroundColor": "#ffffff",
-          "borderBottomColor": "#EAE3D6",
+          "borderBottomColor": "#A8A8A8",
           "borderBottomWidth": 2,
           "borderStyle": "solid",
           "flexDirection": "column",

package/src/themes/__snapshots_web__/light.stories.tsx.snap

@@ -837,10 +837,10 @@ exports[`bumper/Theme Light 1`] = `
                 class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
                 data-disable-theme="true"
               >
-                #EAE3D6
+                #A8A8A8
               </span>
               <div
-                class="_display-flex _alignItems-stretch _flexDirection-column _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-EAE3D635 _width-t-size-20 _height-t-size-20"
+                class="_display-flex _alignItems-stretch _flexDirection-column _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-A8A8A835 _width-t-size-20 _height-t-size-20"
               />
             </div>
             <div
@@ -875,29 +875,10 @@ exports[`bumper/Theme Light 1`] = `
                 class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
                 data-disable-theme="true"
               >
-                #FFFFFF33
-              </span>
-              <div
-                class="_display-flex _alignItems-stretch _flexDirection-column _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-FFFFFF3335 _width-t-size-20 _height-t-size-20"
-              />
-            </div>
-            <div
-              class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-8 _paddingBottom-t-space-8 _borderBottomWidth-t-space-2 _borderBottomColor-border--bas1360415901 _backgroundColor-bg--base--l872590407 _borderBottomStyle-solid"
-            >
-              <span
-                class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
-                data-disable-theme="true"
-              >
-                border.base.accent
-              </span>
-              <span
-                class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
-                data-disable-theme="true"
-              >
-                #563B56
+                #FFFFFF99
               </span>
               <div
-                class="_display-flex _alignItems-stretch _flexDirection-column _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-563B5635 _width-t-size-20 _height-t-size-20"
+                class="_display-flex _alignItems-stretch _flexDirection-column _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-FFFFFF9935 _width-t-size-20 _height-t-size-20"
               />
             </div>
             <div

package/src/themes/light.ts

@@ -1,8 +1,5 @@
 import { deepPurpleColorPalette } from './palettes/deepPurpleColorPalette';
 
-// WARNING
-// If you modify this theme, don't forget to update the theme in @ornikar/kitt-universal as well
-// https://github.com/ornikar/kitt/blob/79e367e962c957c016c4df67dbcf515c8f45ff0e/@ornikar/kitt-universal/src/themes/late-ocean/colors.ts#L28
 export const light = {
   // content
   'content.base.hi': deepPurpleColorPalette['grey.9'],
@@ -51,10 +48,9 @@ export const light = {
 
   // borders
   'border.base.hi': deepPurpleColorPalette['grey.9'],
-  'border.base.mid': deepPurpleColorPalette['beige.3'],
+  'border.base.mid': deepPurpleColorPalette['grey.3'],
   'border.base.onContrasted.hi': deepPurpleColorPalette['grey.0'],
-  'border.base.onContrasted.mid': deepPurpleColorPalette['white-alpha.20'],
-  'border.base.accent': deepPurpleColorPalette['deepPurple.8'],
+  'border.base.onContrasted.mid': deepPurpleColorPalette['white-alpha.60'],
   'border.info': deepPurpleColorPalette['blue.6'],
   'border.success': deepPurpleColorPalette['green.6'],
   'border.warning': deepPurpleColorPalette['yellow.6'],