@7shifts/sous-chef 4.4.1 → 4.6.0-beta.0

package/dist/index.css

@@ -1,23 +1,7 @@
-@font-face {
-  font-family: "SF Pro";
-  src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYTHIN.OTF") format("opentype");
-  font-weight: 100;
-  font-style: normal;
-  /* Preload the font */
-  unicode-range: U+0000-00FF; /* Basic Latin */
-}
-@font-face {
-  font-family: "SF Pro";
-  src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYLIGHT.OTF") format("opentype");
-  font-weight: 200;
-  font-style: normal;
-  /* Preload the font */
-  unicode-range: U+0000-00FF; /* Basic Latin */
-}
 @font-face {
   font-family: "SF Pro";
   src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYREGULAR.OTF") format("opentype");
-  font-weight: 300;
+  font-weight: normal;
   font-style: normal;
   /* Preload the font */
   unicode-range: U+0000-00FF; /* Basic Latin */
@@ -25,43 +9,11 @@
 @font-face {
   font-family: "SF Pro";
   src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYMEDIUM.OTF") format("opentype");
-  font-weight: 400;
-  font-style: normal;
-  /* Preload the font */
-  unicode-range: U+0000-00FF; /* Basic Latin */
-}
-@font-face {
-  font-family: "SF Pro";
-  src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYSEMIBOLD.OTF") format("opentype");
-  font-weight: 500;
-  font-style: normal;
-  /* Preload the font */
-  unicode-range: U+0000-00FF; /* Basic Latin */
-}
-@font-face {
-  font-family: "SF Pro";
-  src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYBOLD.OTF") format("opentype");
   font-weight: 600;
   font-style: normal;
   /* Preload the font */
   unicode-range: U+0000-00FF; /* Basic Latin */
 }
-@font-face {
-  font-family: "SF Pro";
-  src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYHEAVY.OTF") format("opentype");
-  font-weight: 700;
-  font-style: normal;
-  /* Preload the font */
-  unicode-range: U+0000-00FF; /* Basic Latin */
-}
-@font-face {
-  font-family: "SF Pro";
-  src: url("https://cdn.7shifts.com/fonts/SFPro/SFPRODISPLAYBLACK.OTF") format("opentype");
-  font-weight: 800;
-  font-style: normal;
-  /* Preload the font */
-  unicode-range: U+0000-00FF; /* Basic Latin */
-}
 @font-face {
   font-family: "Universal Sans Display";
   src: url("https://cdn.7shifts.com/fonts/UniversalSans/Universal-Sans-Display-500.ttf");
@@ -87,14 +39,10 @@
   --font-line-height-500: 1.75rem;
   --font-line-height-600: 2rem;
   --font-line-height-700: 2.75rem;
-  --p-font-weight-thin: 100;
-  --p-font-weight-light: 200;
-  --p-font-weight-normal: 300;
-  --p-font-weight-medium: 400;
+  --p-font-weight-light: 300;
+  --p-font-weight-normal: 400;
   --p-font-weight-semibold: 500;
   --p-font-weight-bold: 600;
-  --p-font-weight-heavy: 700;
-  --p-font-weight-black: 800;
 }
 :root {
   --color-white: #fff;
@@ -594,7 +542,7 @@ body * {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
@@ -632,7 +580,7 @@ Just for future references:
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
@@ -809,7 +757,7 @@ Just for future references:
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 
 ._MjV6R {
@@ -845,7 +793,7 @@ Just for future references:
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   line-height: normal;
   text-align: center;
   padding: 9px 12px;
@@ -1295,7 +1243,7 @@ Just for future references:
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
@@ -1326,30 +1274,30 @@ h1._6SgoN {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-600);
   line-height: var(--font-line-height-600);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
 }
 h1._i2LHD {
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 
 h2._6SgoN {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-500);
   line-height: var(--font-line-height-500);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
 }
 h2._i2LHD {
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 
 h3._6SgoN {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-400);
   line-height: var(--font-line-height-400);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
 }
 h3._i2LHD {
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 
 h4._6SgoN {
@@ -1359,7 +1307,7 @@ h4._6SgoN {
   font-weight: var(--p-font-weight-normal);
 }
 h4._i2LHD {
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 
 h5._6SgoN {
@@ -1369,7 +1317,7 @@ h5._6SgoN {
   font-weight: var(--p-font-weight-normal);
 }
 h5._i2LHD {
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 
 ._6SgoN {
@@ -1391,7 +1339,7 @@ h5._i2LHD {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-700);
   line-height: var(--font-line-height-700);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
 }
 ._yZbuO {
   font-family: var(--font-family-body);
@@ -1400,8 +1348,8 @@ h5._i2LHD {
   font-weight: var(--p-font-weight-normal);
 }
 ._i2LHD {
-  font-weight: var(--p-font-weight-medium);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
+  font-weight: var(--p-font-weight-bold);
 }
 ._NgSTT {
   font-style: italic;
@@ -1578,12 +1526,16 @@ h5._i2LHD {
   max-width: 300px;
   border-radius: var(--border-radius-400);
 }
+.dropdown-pane--custom-width ._W12mF {
+  min-width: 0;
+  max-width: none;
+}
 ._Zu9cD {
   background-color: var(--color-primary-container-variant);
 }
 ._Zu9cD ._xS6fS {
   color: var(--color-primary-on-container-variant);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 ._Zu9cD ._7EI7m {
   color: var(--color-primary-on-container-variant);
@@ -1647,12 +1599,36 @@ h5._i2LHD {
 ._ObP6B {
   display: flex;
   gap: 12px;
+  align-self: stretch;
   align-items: center;
 }
 ._UA23u {
   width: 16px;
   height: 16px;
 }
+._rvaeI {
+  background: none;
+  border: none;
+  box-sizing: border-box;
+  align-self: stretch;
+  margin-top: -8px;
+  margin-right: -12px;
+  margin-bottom: -8px;
+  margin-left: 0;
+  padding: 0 12px;
+  border-radius: var(--border-radius-400);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--color-surface-on-color-subtle);
+  cursor: pointer;
+}
+._rvaeI:hover:not(:disabled) {
+  background-color: var(--color-hover-darken);
+}
+._rvaeI:disabled {
+  cursor: auto;
+}
 ._dpo67 {
   display: flex;
   align-items: center;
@@ -1853,7 +1829,7 @@ h5._i2LHD {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   background: var(--color-surface-container-high);
   color: var(--color-surface-on-color-bold);
   border-left: 2px solid var(--color-outline);
@@ -1968,7 +1944,7 @@ h5._i2LHD {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-500);
   line-height: var(--font-line-height-500);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
   color: var(--color-surface-on-color-bold);
   padding: 0;
 }
@@ -2085,7 +2061,7 @@ h5._i2LHD {
 
 ._X7MoW:not(._AeJUw) {
   color: var(--color-primary-color);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   text-decoration: underline;
 }
 
@@ -2104,21 +2080,6 @@ h5._i2LHD {
   color: var(--color-surface-on-color-disabled);
 }
 
-._Mlgd- {
-  position: relative;
-  z-index: 1;
-  display: inline-flex;
-  align-items: center;
-  margin: 0;
-  padding: 0 0.25em;
-  white-space: nowrap;
-  color: currentColor;
-  border: 0;
-  border: 2px solid transparent;
-  font-size: var(--rdp-caption-font-size);
-  font-weight: var(--p-font-weight-medium);
-}
-
 ._eK8pw._eK8pw._eK8pw._eK8pw:not(:disabled) {
   background-color: var(--color-primary-container-variant);
   color: var(--color-primary-on-container-variant);
@@ -2184,7 +2145,7 @@ h5._i2LHD {
 
 ._Snv-V:not(._Zf-6C) {
   color: var(--color-primary-color);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   text-decoration: underline;
 }
 
@@ -2203,21 +2164,6 @@ h5._i2LHD {
   color: var(--color-surface-on-color-disabled);
 }
 
-._-s7XO {
-  position: relative;
-  z-index: 1;
-  display: inline-flex;
-  align-items: center;
-  margin: 0;
-  padding: 0 0.25em;
-  white-space: nowrap;
-  color: currentColor;
-  border: 0;
-  border: 2px solid transparent;
-  font-size: var(--rdp-caption-font-size);
-  font-weight: var(--p-font-weight-medium);
-}
-
 ._e0lOH._e0lOH {
   color: var(--color-primary-on-container-variant);
   border-radius: 0;
@@ -2389,6 +2335,84 @@ input:disabled + ._kmvBP::after {
   top: 10px;
   right: 10px;
 }
+._ZTU2m {
+  display: flex;
+  align-items: center;
+  padding: 0 20px;
+  gap: 40px;
+  height: 56px;
+}
+._Q5JgW, ._uC-Al, ._R1QhY {
+  display: flex;
+  align-items: center;
+  flex: 1;
+}
+._uC-Al {
+  justify-content: center;
+}
+._R1QhY {
+  justify-content: flex-end;
+  gap: 20px;
+}
+._YrKMz {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+._PcgHx {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 38px;
+  width: 38px;
+  border-radius: var(--border-radius-400);
+  position: relative;
+  background: none;
+  color: inherit;
+  border: none;
+  padding: 0;
+  font: inherit;
+  cursor: pointer;
+  outline: inherit;
+}
+._PcgHx:focus {
+  box-shadow: 0 0 8px 0 var(--color-shadow-active);
+}
+._FFTlJ {
+  position: absolute;
+  top: 0;
+  right: -5px;
+}
+._PcgHx:hover {
+  background-color: var(--color-hover-darken);
+}
+._048gS {
+  display: flex;
+  width: 100%;
+  height: 100vh; /* Fallback for browsers that don't support dvh */
+  height: 100dvh;
+  overflow: hidden;
+}
+._nKeKu {
+  flex-shrink: 0;
+  height: 100%;
+}
+._BQLkb {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+._PljPU {
+  flex-shrink: 0;
+}
+._VlXE9 {
+  flex: 1;
+  min-height: 0;
+  overflow: auto;
+  margin: 32px auto 0;
+}
 ._iSC5P._iSC5P {
   font-family: var(--font-family-body);
   font-size: var(--font-size-200);
@@ -2420,7 +2444,7 @@ input:disabled + ._kmvBP::after {
   font-size: var(--font-size-100);
   line-height: var(--font-line-height-100);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0 16px 8px 16px;
   background-color: unset;
   color: var(--color-surface-on-color-bold);
@@ -2524,7 +2548,7 @@ input:disabled + ._kmvBP::after {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
 }
 ._mp1Ok tr td {
   background: var(--color-surface-container-high);
@@ -2644,7 +2668,7 @@ input:disabled + ._kmvBP::after {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   color: var(--color-surface-on-color-bold);
 }
 
@@ -3453,7 +3477,7 @@ input:disabled + ._kmvBP::after {
   background-color: var(--color-surface-color);
   padding: 16px;
   color: var(--color-surface-on-color-bold);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   position: sticky;
   top: 0;
   z-index: 2;
@@ -3612,7 +3636,7 @@ input:disabled + ._kmvBP::after {
   box-sizing: border-box;
 }
 ._Mn-1P {
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   font-size: var(--font-size-normal);
   border: none;
   background-color: transparent;
@@ -3655,7 +3679,7 @@ input:disabled + ._kmvBP::after {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   position: relative;
   background-color: transparent;
   color: var(--color-surface-on-color-bold);
@@ -3689,7 +3713,7 @@ input:disabled + ._kmvBP::after {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-400);
   line-height: var(--font-line-height-400);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
   margin: 0;
 }
 ._zybxx {
@@ -3796,7 +3820,7 @@ input:disabled + ._kmvBP::after {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   color: var(--color-surface-on-color-bold);
   display: flex;
   align-items: center;
@@ -3874,7 +3898,7 @@ input:focus-visible + ._JXakU, input:focus-visible + ._ZxEwG {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
@@ -3901,7 +3925,7 @@ input:focus-visible + ._JXakU, input:focus-visible + ._ZxEwG {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
@@ -3920,7 +3944,7 @@ input:focus-visible + ._JXakU, input:focus-visible + ._ZxEwG {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
@@ -3994,7 +4018,7 @@ input:checked ~ ._P588B {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   padding: 0;
   width: auto;
   float: none;
@@ -4361,7 +4385,7 @@ input:disabled + ._Yfxkl::after {
 
 ._lFzs7:not(._TjttB) {
   color: var(--color-primary-color);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   text-decoration: underline;
 }
 
@@ -4380,21 +4404,6 @@ input:disabled + ._Yfxkl::after {
   color: var(--color-surface-on-color-disabled);
 }
 
-._rpq6- {
-  position: relative;
-  z-index: 1;
-  display: inline-flex;
-  align-items: center;
-  margin: 0;
-  padding: 0 0.25em;
-  white-space: nowrap;
-  color: currentColor;
-  border: 0;
-  border: 2px solid transparent;
-  font-size: var(--rdp-caption-font-size);
-  font-weight: var(--p-font-weight-medium);
-}
-
 ._rJolM._rJolM {
   color: var(--color-primary-color);
   border-radius: 0;
@@ -5695,7 +5704,7 @@ input._TEU6N {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-500);
   line-height: var(--font-line-height-500);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
   width: 40px;
   height: 40px;
 }
@@ -5707,7 +5716,7 @@ input._TEU6N {
   font-family: var(--font-family-heading);
   font-size: var(--font-size-600);
   line-height: var(--font-line-height-600);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-semibold);
   width: 80px;
   height: 80px;
 }
@@ -5729,7 +5738,7 @@ input._TEU6N {
   font-size: var(--font-size-100);
   line-height: var(--font-line-height-100);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   border-radius: var(--border-radius-300);
   padding: 2px 8px;
   display: inline-block;
@@ -5780,7 +5789,7 @@ input._TEU6N {
   font-size: var(--font-size-200);
   line-height: var(--font-line-height-200);
   font-weight: var(--p-font-weight-normal);
-  font-weight: var(--p-font-weight-medium);
+  font-weight: var(--p-font-weight-bold);
   border-radius: 25px;
   padding: 5px 12px;
   max-width: -moz-fit-content;
@@ -5970,7 +5979,6 @@ input._TEU6N {
   text-overflow: ellipsis;
   color: var(--nav-object-normal-color);
   font-family: var(--font-family-body);
-  font-weight: var(--p-font-weight-medium);
 }
 ._MFqwx {
   position: absolute;