chore(css): lint

vtex · Dec 1, 2023 · 1aacabf · 1aacabf
1 parent ef3df40
commit 1aacabf
Show file tree

Hide file tree

Showing 13 changed files with 62 additions and 470 deletions.
diff --git a/packages/components/src/flex/stories/story.css b/packages/components/src/flex/stories/story.css
@@ -1,5 +1,5 @@
 .item {
   background-color: lightblue;
-  width: 100px;
-  height: 100px;
+  width: 6.25rem;
+  height: 6.25rem;
 }
diff --git a/packages/components/src/grid/stories/story.css b/packages/components/src/grid/stories/story.css
@@ -1,5 +1,5 @@
 .cell {
   background-color: lightblue;
   width: 100%;
-  height: 56px;
+  height: 3.5rem;
 }
diff --git a/packages/components/src/pagination/stories/style.css b/packages/components/src/pagination/stories/style.css
@@ -1,3 +1,3 @@
 .pagination-container {
-  margin: 24px;
+  margin: 1.5rem;
 }
diff --git a/packages/components/src/popover/stories/styles.css b/packages/components/src/popover/stories/styles.css
@@ -1,5 +1,5 @@
 .content {
-  height: 112px;
-  width: 192px;
+  height: 7rem;
+  width: 12rem;
   background: var(--sl-bg-muted);
 }
diff --git a/packages/components/src/scroll-area/scroll-area.css b/packages/components/src/scroll-area/scroll-area.css
@@ -56,8 +56,8 @@
       transform: translate(-50%, -50%);
       width: 100%;
       height: 100%;
-      min-width: 44px;
-      min-height: 44px;
+      min-width: 2.75rem;
+      min-height: 2.75rem;
     }
   }
 }
diff --git a/packages/components/src/select-field/stories/style.css b/packages/components/src/select-field/stories/style.css
@@ -1,5 +1,5 @@
 .select-container {
-  margin: 16px;
+  margin: 1rem;
   display: grid;
   align-items: start;
   gap: 16px;

diff --git a/packages/components/src/simple-table/simple-table.css b/packages/components/src/simple-table/simple-table.css
@@ -3,7 +3,7 @@
     width: 100%;
 
     &[data-virtualize='true'] {
-      height: 500px;
+      height: 31.25rem;
       overflow-y: auto;
     }
   }

diff --git a/packages/components/src/textarea/stories/style.css b/packages/components/src/textarea/stories/style.css
@@ -1,3 +1,3 @@
 .textarea-container {
-  margin: 26px;
+  margin: 1.625rem;
 }
diff --git a/packages/components/src/virtual/virtual.css b/packages/components/src/virtual/virtual.css
@@ -7,7 +7,7 @@
     top: 0;
     left: 0;
     width: 100%;
-    height: var(--sl-virtual-item-size, 0px);
+    height: var(--sl-virtual-item-size, 0rem);
     transform: translateY(var(--sl-virtual-item-start, 0px));
   }
 
@@ -20,7 +20,7 @@
   }
 
   [data-sl-virtual] {
-    height: 500px;
+    height: 31.25rem;
     overflow-y: auto;
     width: 100%;
   }

diff --git a/packages/date/CHANGELOG.md b/packages/date/CHANGELOG.md
diff --git a/packages/date/src/date-field/date-field.css b/packages/date/src/date-field/date-field.css
@@ -6,7 +6,7 @@
     gap: var(--sl-space-05);
     border: var(--sl-border-strong);
     border-radius: var(--sl-border-radius-medium);
-    height: 44px;
+    height: 2.75rem;
     padding: var(--sl-space-3) var(--sl-space-4);
     justify-content: flex-start;
     align-items: center;

diff --git a/packages/date/src/date-field/date-field.tsx b/packages/date/src/date-field/date-field.tsx
@@ -15,6 +15,11 @@ import { Field, FieldLabel } from '@vtex/shoreline-components'
 import { DateSegment } from '../date-segment'
 import './date-field.css'
 
+/**
+ * Allow users to select a date in a segmented field
+ * @example
+ * <DateField label="Date" />
+ */
 export const DateField = forwardRef<HTMLDivElement, DateFieldProps>(
   function DateField(props, forwardedRef) {
     const {
@@ -56,18 +61,55 @@ export const DateField = forwardRef<HTMLDivElement, DateFieldProps>(
 )
 
 export interface DateFieldProps {
+  /**
+   * Custom className
+   */
   className?: string
+  /**
+   * Granularity of the filed
+   * @default 'day'
+   */
   granularity?: 'day' | 'hour' | 'minute' | 'second'
+  /**
+   * Hour cycle
+   * @default 24
+   */
   hourCycle?: 12 | 24
+  /**
+   * Field label
+   */
   label?: string
+  /**
+   * Field locale
+   * @default 'en-US'
+   */
   locale?: string
+  /**
+   * Wheter has error
+   * @default false
+   */
   error?: boolean
+  /**
+   * Field value
+   */
   value?: DateValue
+  /**
+   * Minimal date allowed
+   */
   minValue?: DateValue
+  /**
+   * Maximun date allowed
+   */
   maxValue?: DateValue
+  /**
+   * Callback after value changes
+   */
   onChange?:
     | Dispatch<SetStateAction<CalendarDate>>
     | Dispatch<SetStateAction<ZonedDateTime>>
     | Dispatch<SetStateAction<CalendarDateTime>>
+  /**
+   * Default field value
+   */
   defaultValue?: DateValue
 }
diff --git a/packages/stylelint/src/plugins/no-px-values/index.js b/packages/stylelint/src/plugins/no-px-values/index.js
@@ -20,6 +20,12 @@ const spaceProps = [
   'padding-right',
   'padding-top',
   'padding-bottom',
+  'height',
+  'width',
+  'max-height',
+  'max-width',
+  'min-height',
+  'min-width',
 ]
 
 module.exports = stylelint.createPlugin(