@featherk/styles 0.6.3 → 0.6.5

package/dist/v8.2.0/external-styles/featherk-overrides--k-datetime.css

@@ -1,3 +1,11 @@
+.fk-daterangepicker .k-maskedtextbox {
+  width: 16rem;
+  min-width: 16rem;
+}
+.fk-daterangepicker .k-maskedtextbox:has(.k-clear-value) {
+  width: 18rem;
+  min-width: 18rem; /* FEATHER-1155 */
+}
 .fk-daterangepicker .k-input-suffix,
 .fk-daterangepicker .k-input-prefix {
   cursor: pointer;
@@ -65,3 +73,32 @@
 .k-animation-container:has(.k-calendar-view) {
   margin-top: 0.25rem;
 }
+
+/* Custom Time Picker */
+.fk-timepicker .k-timepicker {
+  width: 10rem;
+  min-width: 10rem;
+  display: flex;
+  justify-content: space-between;
+}
+
+.fk-timepicker .k-timepicker.k-input .k-maskedtextbox.k-input,
+.fk-timepicker .k-timepicker.k-input.k-focus .k-maskedtextbox.k-input {
+  /* get rid of the outline on .k-maskedtextbox */
+  border: 0;
+  outline: 0;
+}
+
+/* Custom Date Picker */
+.fk-datepicker .k-datepicker {
+  width: 10rem;
+  min-width: 10rem;
+  display: flex;
+  justify-content: space-between;
+}
+.fk-datepicker .k-datepicker.k-input .k-maskedtextbox.k-input,
+.fk-datepicker .k-datepicker.k-input.k-focus .k-maskedtextbox.k-input {
+  /* get rid of the outline on .k-maskedtextbox */
+  border: 0;
+  outline: 0;
+}

package/dist/v8.2.0/external-styles/featherk-overrides--k-menu.css

@@ -11,13 +11,20 @@
   content: "";
   position: absolute;
   top: 0;
-  bottom: 0;
   background: var(--kendo-color-border);
   width: 1px;
   margin: 0 -1px;
   pointer-events: none;
 }
 
+/* FEATHER-1141 */
+.fk-menu .k-menu.k-menu-horizontal > .k-item.k-menu-item.fk-separator-prefix::before {
+  left: 0;
+}
+.fk-menu .k-menu.k-menu-horizontal > .k-item.k-menu-item.fk-separator-suffix::after {
+  right: 0;
+}
+
 /* VERTICAL */
 .fk-menu
   .k-menu.k-menu-vertical

package/dist/v8.2.0/external-styles/featherk-overrides--k-version.css

@@ -0,0 +1,3 @@
+.tb-v8_2_0 {
+  font-family: "Inter";
+}

package/dist/v8.2.0/scss/_externalStyles.scss

@@ -1,19 +1,21 @@
     @use "../external-styles/featherk-map-evitiAdvisor.css";
   
-      @use "../external-styles/featherk-overrides--k-tooltip.css";
-  
-      @use "../external-styles/featherk-overrides--k-popup-alert.css";
-  
-      @use "../external-styles/featherk-overrides--k-expander.css";
-  
       @use "../external-styles/featherk-overrides--k-slider.css";
   
       @use "../external-styles/featherk-overrides--k-grid.css";
   
       @use "../external-styles/featherk-overrides--k-loader.css";
   
+      @use "../external-styles/featherk-overrides--k-popup-alert.css";
+  
+      @use "../external-styles/featherk-overrides--k-tooltip.css";
+  
+      @use "../external-styles/featherk-overrides--k-expander.css";
+  
+      @use "../external-styles/featherk-overrides--k-zerowidthspace.css";
+  
       @use "../external-styles/featherk-overrides--k-datetime.css";
   
       @use "../external-styles/featherk-overrides--k-menu.css";
   
-      @use "../external-styles/featherk-overrides--k-zerowidthspace.css";
+      @use "../external-styles/featherk-overrides--k-version.css";

package/dist/v8.2.0/scss/_fonts.scss

@@ -1,3 +1,11 @@
+@font-face {
+  font-family: Inter;
+  src: url('../fonts/Inter-Regular.woff2') format('woff2');
+  font-style: normal;
+  font-weight: 400;
+  font-display: auto;
+}
+
 @font-face {
   font-family: Inter;
   src: url('../fonts/Inter-Light.woff2') format('woff2');
@@ -16,33 +24,33 @@
 
 @font-face {
   font-family: Inter;
-  src: url('../fonts/Inter-LightItalic.woff2') format('woff2');
+  src: url('../fonts/Inter-BoldItalic.woff2') format('woff2');
   font-style: italic;
-  font-weight: 300;
+  font-weight: 700;
   font-display: auto;
 }
 
 @font-face {
   font-family: Inter;
-  src: url('../fonts/Inter-Italic.woff2') format('woff2');
+  src: url('../fonts/Inter-MediumItalic.woff2') format('woff2');
   font-style: italic;
-  font-weight: 400;
+  font-weight: 500;
   font-display: auto;
 }
 
 @font-face {
   font-family: Inter;
-  src: url('../fonts/Inter-Regular.woff2') format('woff2');
-  font-style: normal;
-  font-weight: 400;
+  src: url('../fonts/Inter-LightItalic.woff2') format('woff2');
+  font-style: italic;
+  font-weight: 300;
   font-display: auto;
 }
 
 @font-face {
   font-family: Inter;
-  src: url('../fonts/Inter-MediumItalic.woff2') format('woff2');
+  src: url('../fonts/Inter-Italic.woff2') format('woff2');
   font-style: italic;
-  font-weight: 500;
+  font-weight: 400;
   font-display: auto;
 }
 
@@ -52,12 +60,4 @@
   font-style: normal;
   font-weight: 500;
   font-display: auto;
-}
-
-@font-face {
-  font-family: Inter;
-  src: url('../fonts/Inter-BoldItalic.woff2') format('woff2');
-  font-style: italic;
-  font-weight: 700;
-  font-display: auto;
 }

package/dist/v8.2.0/scss/_overrides.scss

@@ -629,10 +629,6 @@
             background-color: initial !important;
             background-image: $fk-feather-focused-on-surface-gradient !important;
         
-}
-    h1{
-                    @extend %fk-typography-feather-heading-1;
-      
 }
     .k-menu-popup .k-group.k-menu-group .k-item.k-menu-item .k-link.k-menu-link{
     padding-left: 16px;
@@ -1285,30 +1281,14 @@
     h2{
                     @extend %fk-typography-feather-heading-2;
       
-}
-    h3{
-                    @extend %fk-typography-feather-heading-3;
-      
 }
     h4{
                     @extend %fk-typography-feather-heading-4;
       
-}
-    h5{
-                    @extend %fk-typography-feather-heading-5;
-      
 }
     h6{
                     @extend %fk-typography-feather-heading-6;
       
-}
-    ul{
-                    @extend %fk-typography-feather-body-small;
-      
-}
-    div{
-                    @extend %fk-typography-feather-body-small;
-      
 }
     .k-grid.k-grid-md .k-table{
     border-collapse: separate;
@@ -2370,7 +2350,7 @@
             transition-duration: 280ms;
             transition-property: all;
             transition-timing-function: ease-out;
-            min-width: 208px;
+            min-width: unset;
         
 }
     .k-timepicker.k-input.k-input-solid{
@@ -4431,10 +4411,10 @@
             border-left-style: solid;
             border-right-style: solid;
             border-top-style: solid;
-            border-bottom-left-radius: $fk-feather-border-radius;
-            border-bottom-right-radius: $fk-feather-border-radius;
-            border-top-left-radius: $fk-feather-border-radius;
-            border-top-right-radius: $fk-feather-border-radius;
+            border-bottom-left-radius: $fk-kendo-border-radius;
+            border-bottom-right-radius: $fk-kendo-border-radius;
+            border-top-left-radius: $fk-kendo-border-radius;
+            border-top-right-radius: $fk-kendo-border-radius;
         
 }
     .k-expander.k-expanded .k-expander-content-wrapper{
@@ -4494,10 +4474,10 @@
         
 }
     .k-expander .k-expander-header{
-    border-bottom-left-radius: $fk-feather-border-radius-s;
-            border-bottom-right-radius: $fk-feather-border-radius-s;
-            border-top-left-radius: $fk-feather-border-radius-s;
-            border-top-right-radius: $fk-feather-border-radius-s;
+    border-bottom-left-radius: $fk-kendo-border-radius;
+            border-bottom-right-radius: $fk-kendo-border-radius;
+            border-top-left-radius: $fk-kendo-border-radius;
+            border-top-right-radius: $fk-kendo-border-radius;
         
 }
     .k-expander.k-expanded{
@@ -4508,10 +4488,6 @@
             border-left-style: solid;
             border-right-style: solid;
             border-top-style: solid;
-            border-bottom-left-radius: $fk-feather-border-radius;
-            border-bottom-right-radius: $fk-feather-border-radius;
-            border-top-left-radius: $fk-feather-border-radius;
-            border-top-right-radius: $fk-feather-border-radius;
             z-index: 1;
         
 }
@@ -5375,4 +5351,48 @@
             background-color: initial;
             background-image: $fk-feather-focused-on-surface-gradient;
         
+}
+    div.fk-container{
+    padding-bottom: $fk-kendo-expander-content-padding-x;
+            padding-left: $fk-kendo-expander-content-padding-x;
+            padding-right: $fk-kendo-expander-content-padding-x;
+            padding-top: $fk-kendo-expander-content-padding-x;
+            background-color: $fk-kendo-component-bg;
+            background-image: none;
+            border-bottom-left-radius: $fk-kendo-border-radius;
+            border-bottom-right-radius: $fk-kendo-border-radius;
+            border-top-left-radius: $fk-kendo-border-radius;
+            border-top-right-radius: $fk-kendo-border-radius;
+            border-bottom-width: $fk-kendo-expander-border-width;
+            border-left-width: $fk-kendo-expander-border-width;
+            border-right-width: $fk-kendo-expander-border-width;
+            border-top-width: $fk-kendo-expander-border-width;
+            border-bottom-color: $fk-kendo-component-border;
+            border-bottom-style: solid;
+            border-left-color: $fk-kendo-component-border;
+            border-left-style: solid;
+            border-right-color: $fk-kendo-component-border;
+            border-right-style: solid;
+            border-top-color: $fk-kendo-component-border;
+            border-top-style: solid;
+            display: flex;
+            flex-direction: column;
+            row-gap: $fk-kendo-expander-spacing-y;
+        
+}
+    p{
+    font-family: Inter;
+        
+}
+    h1:hover{
+                    @extend %fk-typography-feather-heading-1;
+      
+}
+    h1{
+                    @extend %fk-typography-feather-heading-1;
+      
+}
+    h3{
+                    @extend %fk-typography-feather-heading-3;
+      
 }

package/dist/v8.2.0/scss/_tokens.scss

@@ -258,6 +258,7 @@ $fk-error-emphasis:  rgb(187.5, 65.25, 87);
 $fk-error-on-subtle:  rgb(57.75, 0.7, 10.85);
 $fk-on-error:  white;
 $fk-error-on-surface:  rgb(123.75, 1.5, 23.25);
+$fk-dark-on-surface: rgba(10,12,27,0.6);
 $fk-on-dark: $fk-feather-primary-text-on-color;
 $fk-kendo-appbar-dark-text: $fk-on-dark;
 $fk-on-app-surface: $fk-feather-secondary-text-on-surface;
@@ -297,6 +298,7 @@ $fk-kendo-chip-outline-selected-text: $fk-feather-primary-text-on-color;
 $fk-kendo-color-editor-bg: $fk-app-surface;
 $fk-kendo-color-gradient-bg: $fk-app-surface;
 $fk-kendo-component-text: $fk-on-app-surface;
+$fk-kendo-component-border: $fk-border;
 $fk-kendo-component-header-text: $fk-feather-primary-text-on-surface;
 $fk-kendo-invalid-border: $fk-error;
 $fk-kendo-drawer-hover-bg: $fk-base-hover;
@@ -493,6 +495,7 @@ $kendo-chip-outline-selected-text: $fk-kendo-chip-outline-selected-text;
 $kendo-color-editor-bg: $fk-kendo-color-editor-bg;
 $kendo-color-gradient-bg: $fk-kendo-color-gradient-bg;
 $kendo-component-text: $fk-kendo-component-text;
+$kendo-component-border: $fk-kendo-component-border;
 $kendo-component-header-text: $fk-kendo-component-header-text;
 $kendo-invalid-border: $fk-kendo-invalid-border;
 $kendo-drawer-hover-bg: $fk-kendo-drawer-hover-bg;
@@ -570,6 +573,7 @@ error-emphasis:  rgb(187.5, 65.25, 87),
 error-on-subtle:  rgb(57.75, 0.7, 10.85),
 on-error:  white,
 error-on-surface:  rgb(123.75, 1.5, 23.25),
+dark-on-surface: rgba(10,12,27,0.6),
 on-dark: $fk-feather-primary-text-on-color,
 on-app-surface: $fk-feather-secondary-text-on-surface,
 surface-alt: $fk-feather-surface-shade-1,

package/dist/v8.2.0/scss/custom-components/_fk-container-with-heading.scss

@@ -0,0 +1,22 @@
+
+    .fk-container .fk-container-actions{
+    justify-content: end;
+            display: inline-flex;
+        
+}
+    .fk-container .fk-container-content{
+    display: flex;
+        
+}
+    .fk-container{
+                    @extend %fk-typography-feather-body-small;
+      
+}
+    .fk-container .fk-container-heading-section{
+    height: auto;
+            display: flex;
+            flex-direction: column;
+            justify-content: space-around;
+            align-items: stretch;
+        
+}

package/dist/v8.2.0/scss/custom-components/index.scss

@@ -0,0 +1,2 @@
+
+@import 'fk-container-with-heading';

package/dist/v8.2.0/scss/index.scss

@@ -6,4 +6,5 @@
 @import 'kendo';
 @import 'placeholders';
 @import 'externalStyles';
-@import 'overrides';
+@import 'overrides';
+@import 'custom-components';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@featherk/styles",
-  "version": "0.6.3",
+  "version": "0.6.5",
   "type": "module",
   "files": [
     "dist"