@shohojdhara/atomix 0.2.9 → 0.3.1

package/dist/themes/shaj-default.css

@@ -930,7 +930,6 @@ summary {
   --atomix-link-decoration: none;
   --atomix-link-hover-color: var(--atomix-primary-7);
   --atomix-link-hover-color-rgb: var(--atomix-primary-7);
-  --atomix-code-color: #ef4444;
   --atomix-highlight-bg: #fef08a;
   --atomix-border-width: 1px;
   --atomix-border-style: solid;
@@ -941,9 +940,7 @@ summary {
   --atomix-border-radius-lg: 0.625rem;
   --atomix-border-radius-xl: 0.75rem;
   --atomix-border-radius-xxl: 1rem;
-  --atomix-border-radius-2xl: var(
-    --atomix-border-radius-xxl
-  );
+  --atomix-border-radius-2xl: var(--atomix-border-radius-xxl);
   --atomix-border-radius-3xl: 1.5rem;
   --atomix-border-radius-4xl: 2rem;
   --atomix-border-radius-pill: 50rem;
@@ -958,6 +955,136 @@ summary {
   --atomix-form-valid-border-color: #22c55e;
   --atomix-form-invalid-color: #ef4444;
   --atomix-form-invalid-border-color: #ef4444;
+  --atomix-spacing-0: 0rem;
+  --atomix-spacing-1: 0.25rem;
+  --atomix-spacing-px-6: 0.375rem;
+  --atomix-spacing-2: 0.5rem;
+  --atomix-spacing-px-10: 0.625rem;
+  --atomix-spacing-3: 0.75rem;
+  --atomix-spacing-px-14: 0.875rem;
+  --atomix-spacing-4: 1rem;
+  --atomix-spacing-5: 1.25rem;
+  --atomix-spacing-px-22: 1.375rem;
+  --atomix-spacing-6: 1.5rem;
+  --atomix-spacing-7: 1.75rem;
+  --atomix-spacing-px-30: 1.875rem;
+  --atomix-spacing-8: 2rem;
+  --atomix-spacing-9: 2.25rem;
+  --atomix-spacing-10: 2.5rem;
+  --atomix-spacing-11: 2.75rem;
+  --atomix-spacing-12: 3rem;
+  --atomix-spacing-14: 3.5rem;
+  --atomix-spacing-16: 4rem;
+  --atomix-spacing-20: 5rem;
+  --atomix-spacing-24: 6rem;
+  --atomix-spacing-28: 7rem;
+  --atomix-spacing-32: 8rem;
+  --atomix-spacing-36: 9rem;
+  --atomix-spacing-40: 10rem;
+  --atomix-spacing-44: 11rem;
+  --atomix-spacing-48: 12rem;
+  --atomix-spacing-52: 13rem;
+  --atomix-spacing-56: 14rem;
+  --atomix-spacing-60: 15rem;
+  --atomix-spacing-64: 16rem;
+  --atomix-spacing-72: 18rem;
+  --atomix-spacing-80: 20rem;
+  --atomix-spacing-90: 22.5rem;
+  --atomix-spacing-200: 50rem;
+  --atomix-red-1: #fef2f2;
+  --atomix-red-2: #fee2e2;
+  --atomix-red-3: #fecaca;
+  --atomix-red-4: #fca5a5;
+  --atomix-red-5: #f87171;
+  --atomix-red-6: #ef4444;
+  --atomix-red-7: #dc2626;
+  --atomix-red-8: #b91c1c;
+  --atomix-red-9: #991b1b;
+  --atomix-red-10: #7f1d1d;
+  --atomix-green-1: #f0fdf4;
+  --atomix-green-2: #dcfce7;
+  --atomix-green-3: #bbf7d0;
+  --atomix-green-4: #86efac;
+  --atomix-green-5: #4ade80;
+  --atomix-green-6: #22c55e;
+  --atomix-green-7: #16a34a;
+  --atomix-green-8: #15803d;
+  --atomix-green-9: #166534;
+  --atomix-green-10: #14532d;
+  --atomix-blue-1: #eff6ff;
+  --atomix-blue-2: #dbeafe;
+  --atomix-blue-3: #bfdbfe;
+  --atomix-blue-4: #93c5fd;
+  --atomix-blue-5: #60a5fa;
+  --atomix-blue-6: #3b82f6;
+  --atomix-blue-7: #2563eb;
+  --atomix-blue-8: #1d4ed8;
+  --atomix-blue-9: #1e40af;
+  --atomix-blue-10: #1e3a8a;
+  --atomix-yellow-1: #fefce8;
+  --atomix-yellow-2: #fef9c3;
+  --atomix-yellow-3: #fef08a;
+  --atomix-yellow-4: #fde047;
+  --atomix-yellow-5: #facc15;
+  --atomix-yellow-6: #eab308;
+  --atomix-yellow-7: #ca8a04;
+  --atomix-yellow-8: #a16207;
+  --atomix-yellow-9: #854d0e;
+  --atomix-yellow-10: #713f12;
+  --atomix-font-weight-light: 300;
+  --atomix-font-weight-normal: 400;
+  --atomix-font-weight-medium: 500;
+  --atomix-font-weight-semibold: 600;
+  --atomix-font-weight-bold: 700;
+  --atomix-font-weight-heavy: 800;
+  --atomix-font-weight-black: 900;
+  --atomix-line-height-base: 1.6;
+  --atomix-line-height-sm: 1.4;
+  --atomix-line-height-lg: 1.8;
+  --atomix-font-size-xl: 1.5rem;
+  --atomix-font-size-2xl: 2rem;
+  --atomix-display-1: 4.5rem;
+  --atomix-letter-spacing-h1: -1.5px;
+  --atomix-letter-spacing-h2: -1px;
+  --atomix-letter-spacing-h3: -0.75px;
+  --atomix-letter-spacing-h4: -0.5px;
+  --atomix-letter-spacing-h5: -0.25px;
+  --atomix-letter-spacing-h6: 0px;
+  --atomix-transition-duration-fast: 0.15s;
+  --atomix-transition-duration-base: 0.3s;
+  --atomix-transition-duration-slow: 0.5s;
+  --atomix-transition-duration-slower: 0.7s;
+  --atomix-easing-base: cubic-bezier(0.23, 1, 0.32, 1);
+  --atomix-easing-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
+  --atomix-easing-ease-out: cubic-bezier(0, 0, 0.2, 1);
+  --atomix-easing-ease-in: cubic-bezier(0.4, 0, 1, 1);
+  --atomix-easing-ease-linear: linear;
+  --atomix-transition-fast: all 0.15s cubic-bezier(0.23, 1, 0.32, 1);
+  --atomix-transition-base: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
+  --atomix-transition-slow: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
+  --atomix-z-n1: -1;
+  --atomix-z-0: 0;
+  --atomix-z-1: 1;
+  --atomix-z-2: 2;
+  --atomix-z-3: 3;
+  --atomix-z-4: 4;
+  --atomix-z-5: 5;
+  --atomix-z-dropdown: 1000;
+  --atomix-z-sticky: 1020;
+  --atomix-z-fixed: 1030;
+  --atomix-z-modal: 1040;
+  --atomix-z-popover: 1050;
+  --atomix-z-tooltip: 1060;
+  --atomix-z-drawer: 1070;
+  --atomix-breakpoint-xs: 0;
+  --atomix-breakpoint-sm: 576px;
+  --atomix-breakpoint-md: 768px;
+  --atomix-breakpoint-lg: 992px;
+  --atomix-breakpoint-xl: 1200px;
+  --atomix-breakpoint-xxl: 1440px;
+  --atomix-focus-ring-width: 3px;
+  --atomix-focus-ring-offset: 2px;
+  --atomix-focus-ring-opacity: 0.25;
 }
 [data-atomix-color-mode=dark] {
   color-scheme: dark;
@@ -971,6 +1098,14 @@ summary {
   --atomix-success: #22c55e;
   --atomix-warning: #eab308;
   --atomix-info: #3b82f6;
+  --atomix-primary-rgb: 14, 165, 233;
+  --atomix-secondary-rgb: 75, 85, 99;
+  --atomix-light-rgb: 249, 250, 251;
+  --atomix-dark-rgb: 55, 65, 81;
+  --atomix-error-rgb: 239, 68, 68;
+  --atomix-success-rgb: 34, 197, 94;
+  --atomix-warning-rgb: 234, 179, 8;
+  --atomix-info-rgb: 59, 130, 246;
   --atomix-primary-text-emphasis: #ffffff;
   --atomix-secondary-text-emphasis: #e5e7eb;
   --atomix-tertiary-text-emphasis: #d1d5db;
@@ -1029,6 +1164,7 @@ summary {
   --atomix-link-color: var(--atomix-primary-4);
   --atomix-link-color-rgb: var(--atomix-primary-4);
   --atomix-link-hover-color: rgb(50.2255639098, 185.6917293233, 250.2744360902);
+  --atomix-link-hover-color-rgb: 50.2255639098, 185.6917293233, 250.2744360902;
   --atomix-code-color: #f87171;
   --atomix-border-color: var(--atomix-gray-5);
   --atomix-border-color-translucent: rgba(255, 255, 255, 0.15);
@@ -2401,7 +2537,7 @@ a, a:hover {
   position: relative;
   --atomix-glass-radius: var(--atomix-radius-md, 16px);
   --atomix-glass-transform: none;
-  --atomix-glass-transition: all var(--atomix-transition-duration, 0s) ease-out;
+  --atomix-glass-transition: all var(--atomix-transition-duration, 0.15s) ease-out;
   --atomix-glass-position: absolute;
   --atomix-glass-container-width: 100%;
   --atomix-glass-container-height: 100%;
@@ -2508,10 +2644,14 @@ a, a:hover {
   height: 100%;
   pointer-events: none;
 }
+.c-atomix-glass__filter svg {
+  border-radius: var(--atomix-glass-radius);
+}
 .c-atomix-glass__filter-overlay {
   position: absolute;
   inset: 0;
   pointer-events: none;
+  border-radius: var(--atomix-glass-radius);
 }
 .c-atomix-glass__filter-shadow {
   position: absolute;
@@ -2522,6 +2662,7 @@ a, a:hover {
   position: relative;
   width: var(--atomix-glass-container-width);
   height: var(--atomix-glass-container-height);
+  border-radius: var(--atomix-glass-radius);
 }
 .c-atomix-glass__background-layer {
   position: absolute;
@@ -2529,7 +2670,6 @@ a, a:hover {
   border-radius: var(--atomix-glass-radius);
   transform: var(--atomix-glass-transform);
   transition: var(--atomix-glass-transition);
-  will-change: transform;
 }
 .c-atomix-glass__background-layer--dark {
   background-color: var(--atomix-gray-9, #1f2937);
@@ -2613,7 +2753,7 @@ a, a:hover {
 }
 .c-badge--glass {
   background-color: color-mix(in srgb, var(--atomix-tag-bg-color) 20%, transparent);
-  border: 1px solid color-mix(in srgb, var(--atomix-tag-color) 90%, transparent);
+  border: 1px solid color-mix(in srgb, var(--atomix-tag-color) 50%, transparent);
 }
 .c-badge--primary {
   --atomix-tag-bg-color: var(--atomix-brand-bg-subtle);
@@ -3646,6 +3786,35 @@ a, a:hover {
   padding: var(--atomix-card-icon-padding);
   border-radius: 50rem;
 }
+.c-card__footer {
+  margin-top: var(--atomix-card-spacer-y);
+  padding-top: var(--atomix-card-spacer-y);
+  border-top: 1px solid var(--atomix-card-border-color);
+}
+.c-card__footer--align-start {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+.c-card__footer--align-center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.c-card__footer--align-end {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+}
+.c-card__footer--align-between {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.c-card__body--scrollable {
+  overflow-y: auto;
+  overflow-x: hidden;
+}
 .c-card:hover {
   background-color: var(--atomix-card-bg-hover);
 }
@@ -3777,6 +3946,31 @@ a, a:hover {
 .c-card--interactive:active:not(.c-card--interactive--disabled) {
   transform: translateY(0);
 }
+.c-card--hoverable {
+  cursor: pointer;
+  transition: all 0.2s ease-in-out;
+}
+.c-card--hoverable:hover:not(.c-card--hoverable--disabled) {
+  transform: translateY(-2px);
+}
+.c-card--hoverable:active:not(.c-card--hoverable--disabled) {
+  transform: translateY(0);
+}
+.c-card--hoverable--hover-elevation-none:hover:not(.c-card--hoverable--disabled) {
+  box-shadow: none;
+}
+.c-card--hoverable--hover-elevation-sm:hover:not(.c-card--hoverable--disabled) {
+  box-shadow: var(--atomix-box-shadow-sm);
+}
+.c-card--hoverable--hover-elevation-md:hover:not(.c-card--hoverable--disabled) {
+  box-shadow: var(--atomix-box-shadow-md);
+}
+.c-card--hoverable--hover-elevation-lg:hover:not(.c-card--hoverable--disabled) {
+  box-shadow: var(--atomix-box-shadow-lg);
+}
+.c-card--hoverable--hover-elevation-xl:hover:not(.c-card--hoverable--disabled) {
+  box-shadow: var(--atomix-box-shadow-xl);
+}
 .c-card--primary {
   --atomix-card-bg: var(--atomix-brand-bg-subtle);
   --atomix-card-bg-hover: var(--atomix-brand-bg-subtle);
@@ -3875,7 +4069,7 @@ a, a:hover {
   .c-card {
     transition: none;
   }
-  .c-card--interactive:hover:not(.c-card--disabled) {
+  .c-card--interactive:hover:not(.c-card--disabled), .c-card--hoverable:hover:not(.c-card--disabled) {
     transform: none;
   }
   .c-card__spinner {
@@ -4116,7 +4310,6 @@ a, a:hover {
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   position: relative;
   overflow: hidden;
-  font-size: 0.875rem;
 }
 .c-chart__action::before {
   content: "";
@@ -4276,7 +4469,7 @@ a, a:hover {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 0.375rem 0;
+  padding: 0;
   gap: 0.75rem;
 }
 .c-chart__settings-menu-item--info {
@@ -5846,6 +6039,9 @@ a, a:hover {
   --atomix-dropdown-link-hover-color: var(--atomix-dark-text-emphasis);
   --atomix-dropdown-link-hover-bg: var(--atomix-dark-bg-subtle);
 }
+.c-dropdown--glass .c-dropdown__menu-inner {
+  box-shadow: none;
+}
 .c-dropdown.is-open .c-dropdown__toggle-icon {
   transform: rotate(-180deg);
 }
@@ -8333,8 +8529,12 @@ a, a:hover {
 .c-modal--xl {
   --atomix-modal-width: var(--atomix-modal-xl);
 }
-.c-modal--glass .c-modal .c-modal--glass .c-modal__content {
+.c-modal--glass .c-modal__content {
   background-color: color-mix(in srgb, var(--atomix-modal-content-bg) 50%, transparent);
+  box-shadow: none;
+  border-radius: inherit;
+  width: var(--atomix-modal-width);
+  height: 100%;
 }
 .c-modal.is-open .c-modal__backdrop {
   opacity: var(--atomix-modal-backdrop-opacity);
@@ -9310,6 +9510,10 @@ a, a:hover {
   left: calc(var(--atomix-popover-arrow-offset) * -1);
   transform: translateY(-50%) rotate(45deg);
 }
+.c-popover--glass .c-popover__content-inner {
+  background-color: color-mix(in srgb, var(--atomix-popover-bg) 50%, transparent);
+  box-shadow: none;
+}
 .c-product-review {
   --atomix-product-review-padding: 1.5rem;
   --atomix-product-review-border-radius: var(--atomix-border-radius);
@@ -13763,19 +13967,19 @@ body.is-open-photoviewer {
 .u-m-1 {
   margin: 0.25rem;
 }
-.u-m-1\.5 {
+.u-m-px-6 {
   margin: 0.375rem;
 }
 .u-m-2 {
   margin: 0.5rem;
 }
-.u-m-2\.5 {
+.u-m-px-10 {
   margin: 0.625rem;
 }
 .u-m-3 {
   margin: 0.75rem;
 }
-.u-m-3\.5 {
+.u-m-px-14 {
   margin: 0.875rem;
 }
 .u-m-4 {
@@ -13784,7 +13988,7 @@ body.is-open-photoviewer {
 .u-m-5 {
   margin: 1.25rem;
 }
-.u-m-5\.5 {
+.u-m-px-22 {
   margin: 1.375rem;
 }
 .u-m-6 {
@@ -13793,7 +13997,7 @@ body.is-open-photoviewer {
 .u-m-7 {
   margin: 1.75rem;
 }
-.u-m-7\.5 {
+.u-m-px-30 {
   margin: 1.875rem;
 }
 .u-m-8 {
@@ -13876,7 +14080,7 @@ body.is-open-photoviewer {
   margin-right: 0.25rem;
   margin-left: 0.25rem;
 }
-.u-mx-1\.5 {
+.u-mx-px-6 {
   margin-right: 0.375rem;
   margin-left: 0.375rem;
 }
@@ -13884,7 +14088,7 @@ body.is-open-photoviewer {
   margin-right: 0.5rem;
   margin-left: 0.5rem;
 }
-.u-mx-2\.5 {
+.u-mx-px-10 {
   margin-right: 0.625rem;
   margin-left: 0.625rem;
 }
@@ -13892,7 +14096,7 @@ body.is-open-photoviewer {
   margin-right: 0.75rem;
   margin-left: 0.75rem;
 }
-.u-mx-3\.5 {
+.u-mx-px-14 {
   margin-right: 0.875rem;
   margin-left: 0.875rem;
 }
@@ -13904,7 +14108,7 @@ body.is-open-photoviewer {
   margin-right: 1.25rem;
   margin-left: 1.25rem;
 }
-.u-mx-5\.5 {
+.u-mx-px-22 {
   margin-right: 1.375rem;
   margin-left: 1.375rem;
 }
@@ -13916,7 +14120,7 @@ body.is-open-photoviewer {
   margin-right: 1.75rem;
   margin-left: 1.75rem;
 }
-.u-mx-7\.5 {
+.u-mx-px-30 {
   margin-right: 1.875rem;
   margin-left: 1.875rem;
 }
@@ -14024,7 +14228,7 @@ body.is-open-photoviewer {
   margin-top: 0.25rem;
   margin-bottom: 0.25rem;
 }
-.u-my-1\.5 {
+.u-my-px-6 {
   margin-top: 0.375rem;
   margin-bottom: 0.375rem;
 }
@@ -14032,7 +14236,7 @@ body.is-open-photoviewer {
   margin-top: 0.5rem;
   margin-bottom: 0.5rem;
 }
-.u-my-2\.5 {
+.u-my-px-10 {
   margin-top: 0.625rem;
   margin-bottom: 0.625rem;
 }
@@ -14040,7 +14244,7 @@ body.is-open-photoviewer {
   margin-top: 0.75rem;
   margin-bottom: 0.75rem;
 }
-.u-my-3\.5 {
+.u-my-px-14 {
   margin-top: 0.875rem;
   margin-bottom: 0.875rem;
 }
@@ -14052,7 +14256,7 @@ body.is-open-photoviewer {
   margin-top: 1.25rem;
   margin-bottom: 1.25rem;
 }
-.u-my-5\.5 {
+.u-my-px-22 {
   margin-top: 1.375rem;
   margin-bottom: 1.375rem;
 }
@@ -14064,7 +14268,7 @@ body.is-open-photoviewer {
   margin-top: 1.75rem;
   margin-bottom: 1.75rem;
 }
-.u-my-7\.5 {
+.u-my-px-30 {
   margin-top: 1.875rem;
   margin-bottom: 1.875rem;
 }
@@ -14170,19 +14374,19 @@ body.is-open-photoviewer {
 .u-mt-1 {
   margin-top: 0.25rem;
 }
-.u-mt-1\.5 {
+.u-mt-px-6 {
   margin-top: 0.375rem;
 }
 .u-mt-2 {
   margin-top: 0.5rem;
 }
-.u-mt-2\.5 {
+.u-mt-px-10 {
   margin-top: 0.625rem;
 }
 .u-mt-3 {
   margin-top: 0.75rem;
 }
-.u-mt-3\.5 {
+.u-mt-px-14 {
   margin-top: 0.875rem;
 }
 .u-mt-4 {
@@ -14191,7 +14395,7 @@ body.is-open-photoviewer {
 .u-mt-5 {
   margin-top: 1.25rem;
 }
-.u-mt-5\.5 {
+.u-mt-px-22 {
   margin-top: 1.375rem;
 }
 .u-mt-6 {
@@ -14200,7 +14404,7 @@ body.is-open-photoviewer {
 .u-mt-7 {
   margin-top: 1.75rem;
 }
-.u-mt-7\.5 {
+.u-mt-px-30 {
   margin-top: 1.875rem;
 }
 .u-mt-8 {
@@ -14281,19 +14485,19 @@ body.is-open-photoviewer {
 .u-me-1 {
   margin-right: 0.25rem;
 }
-.u-me-1\.5 {
+.u-me-px-6 {
   margin-right: 0.375rem;
 }
 .u-me-2 {
   margin-right: 0.5rem;
 }
-.u-me-2\.5 {
+.u-me-px-10 {
   margin-right: 0.625rem;
 }
 .u-me-3 {
   margin-right: 0.75rem;
 }
-.u-me-3\.5 {
+.u-me-px-14 {
   margin-right: 0.875rem;
 }
 .u-me-4 {
@@ -14302,7 +14506,7 @@ body.is-open-photoviewer {
 .u-me-5 {
   margin-right: 1.25rem;
 }
-.u-me-5\.5 {
+.u-me-px-22 {
   margin-right: 1.375rem;
 }
 .u-me-6 {
@@ -14311,7 +14515,7 @@ body.is-open-photoviewer {
 .u-me-7 {
   margin-right: 1.75rem;
 }
-.u-me-7\.5 {
+.u-me-px-30 {
   margin-right: 1.875rem;
 }
 .u-me-8 {
@@ -14392,19 +14596,19 @@ body.is-open-photoviewer {
 .u-mb-1 {
   margin-bottom: 0.25rem;
 }
-.u-mb-1\.5 {
+.u-mb-px-6 {
   margin-bottom: 0.375rem;
 }
 .u-mb-2 {
   margin-bottom: 0.5rem;
 }
-.u-mb-2\.5 {
+.u-mb-px-10 {
   margin-bottom: 0.625rem;
 }
 .u-mb-3 {
   margin-bottom: 0.75rem;
 }
-.u-mb-3\.5 {
+.u-mb-px-14 {
   margin-bottom: 0.875rem;
 }
 .u-mb-4 {
@@ -14413,7 +14617,7 @@ body.is-open-photoviewer {
 .u-mb-5 {
   margin-bottom: 1.25rem;
 }
-.u-mb-5\.5 {
+.u-mb-px-22 {
   margin-bottom: 1.375rem;
 }
 .u-mb-6 {
@@ -14422,7 +14626,7 @@ body.is-open-photoviewer {
 .u-mb-7 {
   margin-bottom: 1.75rem;
 }
-.u-mb-7\.5 {
+.u-mb-px-30 {
   margin-bottom: 1.875rem;
 }
 .u-mb-8 {
@@ -14503,19 +14707,19 @@ body.is-open-photoviewer {
 .u-ms-1 {
   margin-left: 0.25rem;
 }
-.u-ms-1\.5 {
+.u-ms-px-6 {
   margin-left: 0.375rem;
 }
 .u-ms-2 {
   margin-left: 0.5rem;
 }
-.u-ms-2\.5 {
+.u-ms-px-10 {
   margin-left: 0.625rem;
 }
 .u-ms-3 {
   margin-left: 0.75rem;
 }
-.u-ms-3\.5 {
+.u-ms-px-14 {
   margin-left: 0.875rem;
 }
 .u-ms-4 {
@@ -14524,7 +14728,7 @@ body.is-open-photoviewer {
 .u-ms-5 {
   margin-left: 1.25rem;
 }
-.u-ms-5\.5 {
+.u-ms-px-22 {
   margin-left: 1.375rem;
 }
 .u-ms-6 {
@@ -14533,7 +14737,7 @@ body.is-open-photoviewer {
 .u-ms-7 {
   margin-left: 1.75rem;
 }
-.u-ms-7\.5 {
+.u-ms-px-30 {
   margin-left: 1.875rem;
 }
 .u-ms-8 {
@@ -14614,19 +14818,19 @@ body.is-open-photoviewer {
 .u-p-1 {
   padding: 0.25rem;
 }
-.u-p-1\.5 {
+.u-p-px-6 {
   padding: 0.375rem;
 }
 .u-p-2 {
   padding: 0.5rem;
 }
-.u-p-2\.5 {
+.u-p-px-10 {
   padding: 0.625rem;
 }
 .u-p-3 {
   padding: 0.75rem;
 }
-.u-p-3\.5 {
+.u-p-px-14 {
   padding: 0.875rem;
 }
 .u-p-4 {
@@ -14635,7 +14839,7 @@ body.is-open-photoviewer {
 .u-p-5 {
   padding: 1.25rem;
 }
-.u-p-5\.5 {
+.u-p-px-22 {
   padding: 1.375rem;
 }
 .u-p-6 {
@@ -14644,7 +14848,7 @@ body.is-open-photoviewer {
 .u-p-7 {
   padding: 1.75rem;
 }
-.u-p-7\.5 {
+.u-p-px-30 {
   padding: 1.875rem;
 }
 .u-p-8 {
@@ -14724,7 +14928,7 @@ body.is-open-photoviewer {
   padding-right: 0.25rem;
   padding-left: 0.25rem;
 }
-.u-px-1\.5 {
+.u-px-px-6 {
   padding-right: 0.375rem;
   padding-left: 0.375rem;
 }
@@ -14732,7 +14936,7 @@ body.is-open-photoviewer {
   padding-right: 0.5rem;
   padding-left: 0.5rem;
 }
-.u-px-2\.5 {
+.u-px-px-10 {
   padding-right: 0.625rem;
   padding-left: 0.625rem;
 }
@@ -14740,7 +14944,7 @@ body.is-open-photoviewer {
   padding-right: 0.75rem;
   padding-left: 0.75rem;
 }
-.u-px-3\.5 {
+.u-px-px-14 {
   padding-right: 0.875rem;
   padding-left: 0.875rem;
 }
@@ -14752,7 +14956,7 @@ body.is-open-photoviewer {
   padding-right: 1.25rem;
   padding-left: 1.25rem;
 }
-.u-px-5\.5 {
+.u-px-px-22 {
   padding-right: 1.375rem;
   padding-left: 1.375rem;
 }
@@ -14764,7 +14968,7 @@ body.is-open-photoviewer {
   padding-right: 1.75rem;
   padding-left: 1.75rem;
 }
-.u-px-7\.5 {
+.u-px-px-30 {
   padding-right: 1.875rem;
   padding-left: 1.875rem;
 }
@@ -14868,7 +15072,7 @@ body.is-open-photoviewer {
   padding-top: 0.25rem;
   padding-bottom: 0.25rem;
 }
-.u-py-1\.5 {
+.u-py-px-6 {
   padding-top: 0.375rem;
   padding-bottom: 0.375rem;
 }
@@ -14876,7 +15080,7 @@ body.is-open-photoviewer {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
 }
-.u-py-2\.5 {
+.u-py-px-10 {
   padding-top: 0.625rem;
   padding-bottom: 0.625rem;
 }
@@ -14884,7 +15088,7 @@ body.is-open-photoviewer {
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
 }
-.u-py-3\.5 {
+.u-py-px-14 {
   padding-top: 0.875rem;
   padding-bottom: 0.875rem;
 }
@@ -14896,7 +15100,7 @@ body.is-open-photoviewer {
   padding-top: 1.25rem;
   padding-bottom: 1.25rem;
 }
-.u-py-5\.5 {
+.u-py-px-22 {
   padding-top: 1.375rem;
   padding-bottom: 1.375rem;
 }
@@ -14908,7 +15112,7 @@ body.is-open-photoviewer {
   padding-top: 1.75rem;
   padding-bottom: 1.75rem;
 }
-.u-py-7\.5 {
+.u-py-px-30 {
   padding-top: 1.875rem;
   padding-bottom: 1.875rem;
 }
@@ -15010,19 +15214,19 @@ body.is-open-photoviewer {
 .u-pt-1 {
   padding-top: 0.25rem;
 }
-.u-pt-1\.5 {
+.u-pt-px-6 {
   padding-top: 0.375rem;
 }
 .u-pt-2 {
   padding-top: 0.5rem;
 }
-.u-pt-2\.5 {
+.u-pt-px-10 {
   padding-top: 0.625rem;
 }
 .u-pt-3 {
   padding-top: 0.75rem;
 }
-.u-pt-3\.5 {
+.u-pt-px-14 {
   padding-top: 0.875rem;
 }
 .u-pt-4 {
@@ -15031,7 +15235,7 @@ body.is-open-photoviewer {
 .u-pt-5 {
   padding-top: 1.25rem;
 }
-.u-pt-5\.5 {
+.u-pt-px-22 {
   padding-top: 1.375rem;
 }
 .u-pt-6 {
@@ -15040,7 +15244,7 @@ body.is-open-photoviewer {
 .u-pt-7 {
   padding-top: 1.75rem;
 }
-.u-pt-7\.5 {
+.u-pt-px-30 {
   padding-top: 1.875rem;
 }
 .u-pt-8 {
@@ -15118,19 +15322,19 @@ body.is-open-photoviewer {
 .u-pe-1 {
   padding-right: 0.25rem;
 }
-.u-pe-1\.5 {
+.u-pe-px-6 {
   padding-right: 0.375rem;
 }
 .u-pe-2 {
   padding-right: 0.5rem;
 }
-.u-pe-2\.5 {
+.u-pe-px-10 {
   padding-right: 0.625rem;
 }
 .u-pe-3 {
   padding-right: 0.75rem;
 }
-.u-pe-3\.5 {
+.u-pe-px-14 {
   padding-right: 0.875rem;
 }
 .u-pe-4 {
@@ -15139,7 +15343,7 @@ body.is-open-photoviewer {
 .u-pe-5 {
   padding-right: 1.25rem;
 }
-.u-pe-5\.5 {
+.u-pe-px-22 {
   padding-right: 1.375rem;
 }
 .u-pe-6 {
@@ -15148,7 +15352,7 @@ body.is-open-photoviewer {
 .u-pe-7 {
   padding-right: 1.75rem;
 }
-.u-pe-7\.5 {
+.u-pe-px-30 {
   padding-right: 1.875rem;
 }
 .u-pe-8 {
@@ -15226,19 +15430,19 @@ body.is-open-photoviewer {
 .u-pb-1 {
   padding-bottom: 0.25rem;
 }
-.u-pb-1\.5 {
+.u-pb-px-6 {
   padding-bottom: 0.375rem;
 }
 .u-pb-2 {
   padding-bottom: 0.5rem;
 }
-.u-pb-2\.5 {
+.u-pb-px-10 {
   padding-bottom: 0.625rem;
 }
 .u-pb-3 {
   padding-bottom: 0.75rem;
 }
-.u-pb-3\.5 {
+.u-pb-px-14 {
   padding-bottom: 0.875rem;
 }
 .u-pb-4 {
@@ -15247,7 +15451,7 @@ body.is-open-photoviewer {
 .u-pb-5 {
   padding-bottom: 1.25rem;
 }
-.u-pb-5\.5 {
+.u-pb-px-22 {
   padding-bottom: 1.375rem;
 }
 .u-pb-6 {
@@ -15256,7 +15460,7 @@ body.is-open-photoviewer {
 .u-pb-7 {
   padding-bottom: 1.75rem;
 }
-.u-pb-7\.5 {
+.u-pb-px-30 {
   padding-bottom: 1.875rem;
 }
 .u-pb-8 {
@@ -15334,19 +15538,19 @@ body.is-open-photoviewer {
 .u-ps-1 {
   padding-left: 0.25rem;
 }
-.u-ps-1\.5 {
+.u-ps-px-6 {
   padding-left: 0.375rem;
 }
 .u-ps-2 {
   padding-left: 0.5rem;
 }
-.u-ps-2\.5 {
+.u-ps-px-10 {
   padding-left: 0.625rem;
 }
 .u-ps-3 {
   padding-left: 0.75rem;
 }
-.u-ps-3\.5 {
+.u-ps-px-14 {
   padding-left: 0.875rem;
 }
 .u-ps-4 {
@@ -15355,7 +15559,7 @@ body.is-open-photoviewer {
 .u-ps-5 {
   padding-left: 1.25rem;
 }
-.u-ps-5\.5 {
+.u-ps-px-22 {
   padding-left: 1.375rem;
 }
 .u-ps-6 {
@@ -15364,7 +15568,7 @@ body.is-open-photoviewer {
 .u-ps-7 {
   padding-left: 1.75rem;
 }
-.u-ps-7\.5 {
+.u-ps-px-30 {
   padding-left: 1.875rem;
 }
 .u-ps-8 {
@@ -15442,19 +15646,19 @@ body.is-open-photoviewer {
 .u-gap-1 {
   gap: 0.25rem;
 }
-.u-gap-1\.5 {
+.u-gap-px-6 {
   gap: 0.375rem;
 }
 .u-gap-2 {
   gap: 0.5rem;
 }
-.u-gap-2\.5 {
+.u-gap-px-10 {
   gap: 0.625rem;
 }
 .u-gap-3 {
   gap: 0.75rem;
 }
-.u-gap-3\.5 {
+.u-gap-px-14 {
   gap: 0.875rem;
 }
 .u-gap-4 {
@@ -15463,7 +15667,7 @@ body.is-open-photoviewer {
 .u-gap-5 {
   gap: 1.25rem;
 }
-.u-gap-5\.5 {
+.u-gap-px-22 {
   gap: 1.375rem;
 }
 .u-gap-6 {
@@ -15472,7 +15676,7 @@ body.is-open-photoviewer {
 .u-gap-7 {
   gap: 1.75rem;
 }
-.u-gap-7\.5 {
+.u-gap-px-30 {
   gap: 1.875rem;
 }
 .u-gap-8 {
@@ -15550,19 +15754,19 @@ body.is-open-photoviewer {
 .u-row-gap-1 {
   row-gap: 0.25rem;
 }
-.u-row-gap-1\.5 {
+.u-row-gap-px-6 {
   row-gap: 0.375rem;
 }
 .u-row-gap-2 {
   row-gap: 0.5rem;
 }
-.u-row-gap-2\.5 {
+.u-row-gap-px-10 {
   row-gap: 0.625rem;
 }
 .u-row-gap-3 {
   row-gap: 0.75rem;
 }
-.u-row-gap-3\.5 {
+.u-row-gap-px-14 {
   row-gap: 0.875rem;
 }
 .u-row-gap-4 {
@@ -15571,7 +15775,7 @@ body.is-open-photoviewer {
 .u-row-gap-5 {
   row-gap: 1.25rem;
 }
-.u-row-gap-5\.5 {
+.u-row-gap-px-22 {
   row-gap: 1.375rem;
 }
 .u-row-gap-6 {
@@ -15580,7 +15784,7 @@ body.is-open-photoviewer {
 .u-row-gap-7 {
   row-gap: 1.75rem;
 }
-.u-row-gap-7\.5 {
+.u-row-gap-px-30 {
   row-gap: 1.875rem;
 }
 .u-row-gap-8 {
@@ -15660,7 +15864,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 0.25rem;
        column-gap: 0.25rem;
 }
-.u-column-gap-1\.5 {
+.u-column-gap-px-6 {
   -moz-column-gap: 0.375rem;
        column-gap: 0.375rem;
 }
@@ -15668,7 +15872,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 0.5rem;
        column-gap: 0.5rem;
 }
-.u-column-gap-2\.5 {
+.u-column-gap-px-10 {
   -moz-column-gap: 0.625rem;
        column-gap: 0.625rem;
 }
@@ -15676,7 +15880,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 0.75rem;
        column-gap: 0.75rem;
 }
-.u-column-gap-3\.5 {
+.u-column-gap-px-14 {
   -moz-column-gap: 0.875rem;
        column-gap: 0.875rem;
 }
@@ -15688,7 +15892,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 1.25rem;
        column-gap: 1.25rem;
 }
-.u-column-gap-5\.5 {
+.u-column-gap-px-22 {
   -moz-column-gap: 1.375rem;
        column-gap: 1.375rem;
 }
@@ -15700,7 +15904,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 1.75rem;
        column-gap: 1.75rem;
 }
-.u-column-gap-7\.5 {
+.u-column-gap-px-30 {
   -moz-column-gap: 1.875rem;
        column-gap: 1.875rem;
 }