@verisoft/ui-govcz 18.7.0 → 18.8.0

package/{sass → assets/sass}/main.scss

@@ -1,246 +1,246 @@
-$version: '0.0.1';
-
-@import './vendors/bootstrap';
-
-@import '@gov-design-system-ce/styles/lib/tokens.css';
-
-@import './header.scss';
-@import './scrollbar.scss';
-
-@import '@gov-design-system-ce/styles/lib/styles.css';
-@import '@gov-design-system-ce/styles/lib/layout.css';
-@import '@gov-design-system-ce/styles/lib/components.css';
-
-@import '@gov-design-system-ce/fonts/lib/roboto.css';
-
-:root {
-    --color-primary-600: var(--color-primary-700);
-    --gov-color-blue: var(--color-primary-700);
-    --color-evaluatin-pink: #e7877891;
-    --gov-app-max-width: 100%;
-    --layout-gap: var(--templates-margin-l);
-    --container-width: var(--templates-layout-page-limit-max);
-    --container-padding-horizontal: var(--templates-margin-l);
-    --container-padding-top: var(--templates-margin-l);
-    --container-padding-bottom: var(--templates-margin-8xl);
-}
-
-@media (max-width: 29.99em) {
-    :root {
-        --templates-layout-image-highlighted-height: 17.5rem;
-        --templates-layout-image-small-height: 17.5rem;
-        --templates-layout-page-limit-max: 40rem;
-        --templates-margin-none: 0rem;
-        --templates-margin-s: 0.375rem;
-        --templates-margin-m: 0.75rem;
-        --templates-margin-l: 1rem;
-        --templates-margin-xl: 1.75rem;
-        --templates-margin-2xl: 2.25rem;
-        --templates-margin-3xl: 2.625rem;
-        --templates-margin-4xl: 3rem;
-        --templates-margin-5xl: 3.625rem;
-        --templates-margin-6xl: 4rem;
-        --templates-margin-7xl: 4.5rem;
-        --templates-margin-8xl: 6.25rem;
-        --templates-margin-9xl: 9.25rem;
-        --templates-viewport-min: 18.75rem;
-        --templates-viewport-default: 22.5rem;
-        --templates-viewport-max: 50rem;
-        --templates-width-max-xs: 6.25rem;
-        --templates-width-max-s: 12.5rem;
-        --templates-width-max-m: 18.75rem;
-        --templates-width-max-l: 25rem;
-        --templates-width-max-xl: 31.25rem;
-        --templates-width-max-2xl: 37.5rem;
-        --templates-width-max-3xl: 43.75rem;
-        --templates-width-max-4xl: 50rem;
-        --templates-width-max-5xl: 50rem;
-        --templates-width-max-6xl: 50rem;
-        --templates-width-max-7xl: 50rem;
-        --templates-width-max-8xl: 50rem;
-        --templates-width-min-xs: 6.25rem;
-        --templates-width-min-s: 12.5rem;
-        --templates-width-min-m: 18.75rem;
-        --templates-width-min-l: 18.75rem;
-        --templates-width-min-2xl: 18.75rem;
-        --templates-width-min-3xl: 18.75rem;
-        --templates-width-min-4xl: 18.75rem;
-        --templates-width-min-5xl: 18.75rem;
-        --templates-width-min-6xl: 18.75rem;
-        --templates-width-min-7xl: 18.75rem;
-        --templates-width-min-8xl: 18.75rem;
-    }
-}
-
-@media (min-width: 30em) and (max-width: 63.99em) {
-    :root {
-        --templates-layout-image-small-height: 11.75rem;
-        --templates-layout-image-highlighted-height: 35.75rem;
-        --templates-layout-page-limit-max: 75rem;
-        --templates-margin-none: 0rem;
-        --templates-margin-s: 0.5rem;
-        --templates-margin-m: 1rem;
-        --templates-margin-l: 1.5rem;
-        --templates-margin-xl: 2rem;
-        --templates-margin-2xl: 2.5rem;
-        --templates-margin-3xl: 3rem;
-        --templates-margin-4xl: 3.5rem;
-        --templates-margin-5xl: 4rem;
-        --templates-margin-6xl: 4.5rem;
-        --templates-margin-7xl: 5rem;
-        --templates-margin-8xl: 7.5rem;
-        --templates-margin-9xl: 10rem;
-        --templates-viewport-min: 40rem;
-        --templates-viewport-default: 64rem;
-        --templates-viewport-max: 90rem;
-        --templates-width-max-xs: 6.25rem;
-        --templates-width-max-s: 12.5rem;
-        --templates-width-max-m: 18.75rem;
-        --templates-width-max-l: 25rem;
-        --templates-width-max-xl: 31.25rem;
-        --templates-width-max-2xl: 37.5rem;
-        --templates-width-max-3xl: 43.75rem;
-        --templates-width-max-4xl: 50rem;
-        --templates-width-max-5xl: 56.25rem;
-        --templates-width-max-6xl: 62.5rem;
-        --templates-width-max-7xl: 68.75rem;
-        --templates-width-max-8xl: 75rem;
-        --templates-width-min-xs: 6.25rem;
-        --templates-width-min-s: 12.5rem;
-        --templates-width-min-m: 18.75rem;
-        --templates-width-min-l: 25rem;
-        --templates-width-min-xl: 31.25rem;
-        --templates-width-min-2xl: 37.5rem;
-        --templates-width-min-3xl: 43.75rem;
-        --templates-width-min-4xl: 50rem;
-        --templates-width-min-5xl: 56.25rem;
-        --templates-width-min-6xl: 62.5rem;
-        --templates-width-min-7xl: 68.75rem;
-    }
-}
-
-@media (min-width: 64em) {
-    :root {
-        --templates-layout-image-small-height: 11.75rem;
-        --templates-layout-image-highlighted-height: 35.75rem;
-        --templates-layout-page-limit-max: 75rem;
-        --templates-margin-none: 0rem;
-        --templates-margin-s: 0.5rem;
-        --templates-margin-m: 1rem;
-        --templates-margin-l: 1.5rem;
-        --templates-margin-xl: 2rem;
-        --templates-margin-2xl: 2.5rem;
-        --templates-margin-3xl: 3rem;
-        --templates-margin-4xl: 3.5rem;
-        --templates-margin-5xl: 4rem;
-        --templates-margin-6xl: 4.5rem;
-        --templates-margin-7xl: 5rem;
-        --templates-margin-8xl: 7.5rem;
-        --templates-margin-9xl: 10rem;
-        --templates-viewport-min: 50rem;
-        --templates-viewport-default: 90rem;
-        --templates-viewport-max: 128.75rem;
-        --templates-width-max-xs: 6.25rem;
-        --templates-width-max-s: 12.5rem;
-        --templates-width-max-m: 18.75rem;
-        --templates-width-max-l: 25rem;
-        --templates-width-max-xl: 31.25rem;
-        --templates-width-max-2xl: 37.5rem;
-        --templates-width-max-3xl: 43.75rem;
-        --templates-width-max-4xl: 50rem;
-        --templates-width-max-5xl: 56.25rem;
-        --templates-width-max-6xl: 62.5rem;
-        --templates-width-max-7xl: 68.75rem;
-        --templates-width-max-8xl: 75rem;
-        --templates-width-min-xs: 6.25rem;
-        --templates-width-min-s: 12.5rem;
-        --templates-width-min-m: 18.75rem;
-        --templates-width-min-l: 25rem;
-        --templates-width-min-xl: 31.25rem;
-        --templates-width-min-2xl: 37.5rem;
-        --templates-width-min-3xl: 43.75rem;
-        --templates-width-min-4xl: 50rem;
-        --templates-width-min-5xl: 56.25rem;
-        --templates-width-min-6xl: 62.5rem;
-        --templates-width-min-7xl: 68.75rem;
-    }
-}
-
-.gov-header {
-    max-height: 8.5rem;
-}
-
-.gov-header,
-.gov-header__submenu {
-    box-shadow: 0 1px 1px hsla(0deg 0% 0% / 0.075), 0 2px 2px hsl(0deg 0% 0% / 0.075), 0 4px 4px hsl(0deg 0% 0% / 0.075), 0 8px 8px hsl(0deg 0% 0% / 0.075);
-}
-
-body {
-    overflow: hidden;
-    max-height: 100vh;
-    background-color: var(--background-page-white);
-    font-family: 'Roboto', sans-serif;
-    font-size: 0.9375rem;
-    font-weight: 400;
-    letter-spacing: 0.0125em;
-    -webkit-font-smoothing: antialiased;
-}
-
-.gov-main-container {
-    max-width: var(--gov-app-max-width);
-    margin: 0 auto;
-    flex-wrap: wrap;
-
-    &-content {
-        overflow: auto;
-        overflow-x: hidden;
-        height: calc(100vh - 12rem);
-    }
-}
-
-.gov-sidemenu {
-    max-width: 12rem;
-    overflow: auto;
-    height: calc(100vh - 8.5rem);
-    box-shadow: 1px 4px 1px hsla(0deg 0% 0% / 0.075), 2px 4px 2px hsl(0deg 0% 0% / 0.075), 4px 4px 4px hsl(0deg 0% 0% / 0.075),
-        8px 4px 8px hsl(0deg 0% 0% / 0.075);
-}
-
-.gov-breadcrums {
-    height: 1.5rem;
-}
-
-.gov-accordion-item__summary {
-    background-color: var(--color-primary-200);
-}
-
-.gov-clickable {
-    cursor: pointer;
-}
-
-.bg-primary {
-    background-color: var(--color-primary-600) !important;
-}
-
-.v-filter h2 {
-    font-size: var(--font-size-1xl);
-}
-
-.v-filter_action-buttons button {
-    background-color: var(--color-primary-50) !important;
-    border: 1px solid var(--border-primary);
-    color: var(--color-primary-600) !important;
-
-    &:hover {
-        background-color: var(--color-primary-200) !important;
-    }
-}
-
-.v-action-button-group button {
-    background-color: var(--color-primary-50) !important;
-    color: var(--color-primary-600) !important;
-
-    &:hover {
-        background-color: var(--color-primary-200) !important;
-    }
+$version: '0.0.1';
+
+@import './vendors/bootstrap';
+
+@import '@gov-design-system-ce/styles/lib/tokens.css';
+
+@import './header.scss';
+@import './scrollbar.scss';
+
+@import '@gov-design-system-ce/styles/lib/styles.css';
+@import '@gov-design-system-ce/styles/lib/layout.css';
+@import '@gov-design-system-ce/styles/lib/components.css';
+
+@import '@gov-design-system-ce/fonts/lib/roboto.css';
+
+:root {
+    --color-primary-600: var(--color-primary-700);
+    --gov-color-blue: var(--color-primary-700);
+    --color-evaluatin-pink: #e7877891;
+    --gov-app-max-width: 100%;
+    --layout-gap: var(--templates-margin-l);
+    --container-width: var(--templates-layout-page-limit-max);
+    --container-padding-horizontal: var(--templates-margin-l);
+    --container-padding-top: var(--templates-margin-l);
+    --container-padding-bottom: var(--templates-margin-8xl);
+}
+
+@media (max-width: 29.99em) {
+    :root {
+        --templates-layout-image-highlighted-height: 17.5rem;
+        --templates-layout-image-small-height: 17.5rem;
+        --templates-layout-page-limit-max: 40rem;
+        --templates-margin-none: 0rem;
+        --templates-margin-s: 0.375rem;
+        --templates-margin-m: 0.75rem;
+        --templates-margin-l: 1rem;
+        --templates-margin-xl: 1.75rem;
+        --templates-margin-2xl: 2.25rem;
+        --templates-margin-3xl: 2.625rem;
+        --templates-margin-4xl: 3rem;
+        --templates-margin-5xl: 3.625rem;
+        --templates-margin-6xl: 4rem;
+        --templates-margin-7xl: 4.5rem;
+        --templates-margin-8xl: 6.25rem;
+        --templates-margin-9xl: 9.25rem;
+        --templates-viewport-min: 18.75rem;
+        --templates-viewport-default: 22.5rem;
+        --templates-viewport-max: 50rem;
+        --templates-width-max-xs: 6.25rem;
+        --templates-width-max-s: 12.5rem;
+        --templates-width-max-m: 18.75rem;
+        --templates-width-max-l: 25rem;
+        --templates-width-max-xl: 31.25rem;
+        --templates-width-max-2xl: 37.5rem;
+        --templates-width-max-3xl: 43.75rem;
+        --templates-width-max-4xl: 50rem;
+        --templates-width-max-5xl: 50rem;
+        --templates-width-max-6xl: 50rem;
+        --templates-width-max-7xl: 50rem;
+        --templates-width-max-8xl: 50rem;
+        --templates-width-min-xs: 6.25rem;
+        --templates-width-min-s: 12.5rem;
+        --templates-width-min-m: 18.75rem;
+        --templates-width-min-l: 18.75rem;
+        --templates-width-min-2xl: 18.75rem;
+        --templates-width-min-3xl: 18.75rem;
+        --templates-width-min-4xl: 18.75rem;
+        --templates-width-min-5xl: 18.75rem;
+        --templates-width-min-6xl: 18.75rem;
+        --templates-width-min-7xl: 18.75rem;
+        --templates-width-min-8xl: 18.75rem;
+    }
+}
+
+@media (min-width: 30em) and (max-width: 63.99em) {
+    :root {
+        --templates-layout-image-small-height: 11.75rem;
+        --templates-layout-image-highlighted-height: 35.75rem;
+        --templates-layout-page-limit-max: 75rem;
+        --templates-margin-none: 0rem;
+        --templates-margin-s: 0.5rem;
+        --templates-margin-m: 1rem;
+        --templates-margin-l: 1.5rem;
+        --templates-margin-xl: 2rem;
+        --templates-margin-2xl: 2.5rem;
+        --templates-margin-3xl: 3rem;
+        --templates-margin-4xl: 3.5rem;
+        --templates-margin-5xl: 4rem;
+        --templates-margin-6xl: 4.5rem;
+        --templates-margin-7xl: 5rem;
+        --templates-margin-8xl: 7.5rem;
+        --templates-margin-9xl: 10rem;
+        --templates-viewport-min: 40rem;
+        --templates-viewport-default: 64rem;
+        --templates-viewport-max: 90rem;
+        --templates-width-max-xs: 6.25rem;
+        --templates-width-max-s: 12.5rem;
+        --templates-width-max-m: 18.75rem;
+        --templates-width-max-l: 25rem;
+        --templates-width-max-xl: 31.25rem;
+        --templates-width-max-2xl: 37.5rem;
+        --templates-width-max-3xl: 43.75rem;
+        --templates-width-max-4xl: 50rem;
+        --templates-width-max-5xl: 56.25rem;
+        --templates-width-max-6xl: 62.5rem;
+        --templates-width-max-7xl: 68.75rem;
+        --templates-width-max-8xl: 75rem;
+        --templates-width-min-xs: 6.25rem;
+        --templates-width-min-s: 12.5rem;
+        --templates-width-min-m: 18.75rem;
+        --templates-width-min-l: 25rem;
+        --templates-width-min-xl: 31.25rem;
+        --templates-width-min-2xl: 37.5rem;
+        --templates-width-min-3xl: 43.75rem;
+        --templates-width-min-4xl: 50rem;
+        --templates-width-min-5xl: 56.25rem;
+        --templates-width-min-6xl: 62.5rem;
+        --templates-width-min-7xl: 68.75rem;
+    }
+}
+
+@media (min-width: 64em) {
+    :root {
+        --templates-layout-image-small-height: 11.75rem;
+        --templates-layout-image-highlighted-height: 35.75rem;
+        --templates-layout-page-limit-max: 75rem;
+        --templates-margin-none: 0rem;
+        --templates-margin-s: 0.5rem;
+        --templates-margin-m: 1rem;
+        --templates-margin-l: 1.5rem;
+        --templates-margin-xl: 2rem;
+        --templates-margin-2xl: 2.5rem;
+        --templates-margin-3xl: 3rem;
+        --templates-margin-4xl: 3.5rem;
+        --templates-margin-5xl: 4rem;
+        --templates-margin-6xl: 4.5rem;
+        --templates-margin-7xl: 5rem;
+        --templates-margin-8xl: 7.5rem;
+        --templates-margin-9xl: 10rem;
+        --templates-viewport-min: 50rem;
+        --templates-viewport-default: 90rem;
+        --templates-viewport-max: 128.75rem;
+        --templates-width-max-xs: 6.25rem;
+        --templates-width-max-s: 12.5rem;
+        --templates-width-max-m: 18.75rem;
+        --templates-width-max-l: 25rem;
+        --templates-width-max-xl: 31.25rem;
+        --templates-width-max-2xl: 37.5rem;
+        --templates-width-max-3xl: 43.75rem;
+        --templates-width-max-4xl: 50rem;
+        --templates-width-max-5xl: 56.25rem;
+        --templates-width-max-6xl: 62.5rem;
+        --templates-width-max-7xl: 68.75rem;
+        --templates-width-max-8xl: 75rem;
+        --templates-width-min-xs: 6.25rem;
+        --templates-width-min-s: 12.5rem;
+        --templates-width-min-m: 18.75rem;
+        --templates-width-min-l: 25rem;
+        --templates-width-min-xl: 31.25rem;
+        --templates-width-min-2xl: 37.5rem;
+        --templates-width-min-3xl: 43.75rem;
+        --templates-width-min-4xl: 50rem;
+        --templates-width-min-5xl: 56.25rem;
+        --templates-width-min-6xl: 62.5rem;
+        --templates-width-min-7xl: 68.75rem;
+    }
+}
+
+.gov-header {
+    max-height: 8.5rem;
+}
+
+.gov-header,
+.gov-header__submenu {
+    box-shadow: 0 1px 1px hsla(0deg 0% 0% / 0.075), 0 2px 2px hsl(0deg 0% 0% / 0.075), 0 4px 4px hsl(0deg 0% 0% / 0.075), 0 8px 8px hsl(0deg 0% 0% / 0.075);
+}
+
+body {
+    overflow: hidden;
+    max-height: 100vh;
+    background-color: var(--background-page-white);
+    font-family: 'Roboto', sans-serif;
+    font-size: 0.9375rem;
+    font-weight: 400;
+    letter-spacing: 0.0125em;
+    -webkit-font-smoothing: antialiased;
+}
+
+.gov-main-container {
+    max-width: var(--gov-app-max-width);
+    margin: 0 auto;
+    flex-wrap: wrap;
+
+    &-content {
+        overflow: auto;
+        overflow-x: hidden;
+        height: calc(100vh - 12rem);
+    }
+}
+
+.gov-sidemenu {
+    max-width: 12rem;
+    overflow: auto;
+    height: calc(100vh - 8.5rem);
+    box-shadow: 1px 4px 1px hsla(0deg 0% 0% / 0.075), 2px 4px 2px hsl(0deg 0% 0% / 0.075), 4px 4px 4px hsl(0deg 0% 0% / 0.075),
+        8px 4px 8px hsl(0deg 0% 0% / 0.075);
+}
+
+.gov-breadcrums {
+    height: 1.5rem;
+}
+
+.gov-accordion-item__summary {
+    background-color: var(--color-primary-200);
+}
+
+.gov-clickable {
+    cursor: pointer;
+}
+
+.bg-primary {
+    background-color: var(--color-primary-600) !important;
+}
+
+.v-filter h2 {
+    font-size: var(--font-size-1xl);
+}
+
+.v-filter_action-buttons button {
+    background-color: var(--color-primary-50) !important;
+    border: 1px solid var(--border-primary);
+    color: var(--color-primary-600) !important;
+
+    &:hover {
+        background-color: var(--color-primary-200) !important;
+    }
+}
+
+.v-action-button-group button {
+    background-color: var(--color-primary-50) !important;
+    color: var(--color-primary-600) !important;
+
+    &:hover {
+        background-color: var(--color-primary-200) !important;
+    }
 }

package/{sass → assets/sass}/scrollbar.scss

@@ -1,22 +1,22 @@
-::-webkit-scrollbar-thumb {
-  background-color: var(--color-neutral-700);
-  border-radius: 1.25rem;
-  border: 0.375rem solid transparent;
-  background-clip: content-box;
-}
-
-::-webkit-scrollbar {
-  width: 1.125rem;
-}
-
-::-webkit-scrollbar-track {
-  background-color: transparent;
-}
-
-::-webkit-scrollbar-thumb:hover {
-  background-color: var(--color-primary-600);
-}
-
-.cdk-virtual-scroll-viewport {
-  scrollbar-color: var(--color-primary-600) var(--color-primary-100);
-}
+::-webkit-scrollbar-thumb {
+  background-color: var(--color-neutral-700);
+  border-radius: 1.25rem;
+  border: 0.375rem solid transparent;
+  background-clip: content-box;
+}
+
+::-webkit-scrollbar {
+  width: 1.125rem;
+}
+
+::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: var(--color-primary-600);
+}
+
+.cdk-virtual-scroll-viewport {
+  scrollbar-color: var(--color-primary-600) var(--color-primary-100);
+}