@digigov/css 0.28.0 → 0.29.2

package/src/components/stepnav.css

@@ -0,0 +1,149 @@
+
+.govgr-step-nav {
+  @apply mb-8 md:mb-12;
+  .govgr-link {
+    @apply md:text-base text-sm;
+  }
+}
+.govgr-step-nav__controls {
+  @apply text-right;
+    padding: 3px 3px 3px 0;
+}
+.govgr-step-nav__steps {
+  @apply p-0 m-0;
+}
+.govgr-step-nav__step{
+  @apply relative list-none pl-11 md:pl-14;
+  &:last-child:after {
+      height: calc(100% - 2rem);
+    }
+    &:after {
+      @apply absolute z-/1 w-0 h-full bg-white left-0 top-8 border-2 border-gray200 border-r-0 border-t-0 border-b-0 md:border-l-3;
+      content: "";
+      margin-left: calc(0.75rem + 1px);
+    }
+    &:last-child:before {
+      @apply absolute z-1 left-0 h-0 bottom-0 ml-2 w-3 border border-gray200;
+      @apply md:border-t-2 md:ml-2 md:w-5;
+      content: "";
+    }
+}
+@media (min-width: 768px) {
+  .govgr-step-nav__step {
+    &::after {
+      margin-left: calc(1rem + 1px);
+    }
+  }
+}
+.govgr-step-nav__circle {
+  @apply absolute box-border z-1 bg-white rounded-full text-center
+  left-0 w-7 h-7;
+}
+.govgr-step-nav__circle-inner {
+  @apply float-right min-w-full;
+}
+.govgr-step-nav__circle-background {
+  text-shadow: 0 -0.1em 0 var(--color-white), 0.1em 0 0 var(--color-white), 0 0.1em 0 var(--color-white), -0.1em 0 0 var(--color-white);
+}
+.govgr-step-nav__circle--number {
+  @apply border-2 border-gray200;
+}
+
+.govgr-step-nav__circle--number {
+  @apply text-base font-bold;
+  @apply md:text-lg md:leading-7 md:border-3;
+}
+.govgr-step-nav__circle {
+  @apply  md:w-9 md:h-9;
+}
+.govgr-step-nav__circle--number__no-border{
+  @apply md:border-0 border-0;
+}
+.govgr-step-nav__accordion {
+  @apply  border-base150;
+
+  &:first-child {
+    @apply border-t-2;
+  }
+}
+.govgr-step-nav__accordion[open] {
+
+  .govgr-accordion__section-opened {
+    visibility: visible;
+    display: block;
+  }
+  .govgr-accordion__section-closed {
+    visibility: hidden;
+    display: none;
+  }
+  .govgr-nav-step__accordion__content {
+    @apply block;
+  }
+}
+.govgr-step-nav__accordion__summary {
+  @apply list-none w-fit mb-0 py-4 pr-8 cursor-pointer;
+  .govgr-hint {
+    @apply mb-0 mt-1;
+  }
+  &::-webkit-details-marker {
+    @apply hidden;
+  }
+  &:hover {
+    @apply text-link-hover;
+    .govgr-step-nav__accordion__opened, .govgr-step-nav__accordion__closed {
+      @apply underline;
+      text-decoration-thickness: 2px;
+    }
+  }
+  &:focus {
+    .govgr-step-nav__accordion__heading__title {
+      @apply  bg-focus  text-base-content;
+      box-shadow: 0 -2px var(--color-focus), 0 4px var(--color-base-content);
+    }
+    .govgr-step-nav__accordion__opened, .govgr-step-nav__accordion__closed {
+      @apply no-underline text-base-content;
+    }
+  }
+  &:focus-visible {
+    @apply outline-none;
+  }
+
+  &:focus-within {
+    @apply outline-none;
+  }
+}
+.govgr-step-nav__accordion__heading__title {
+  @apply flex flex-col;
+}
+.govgr-step-nav__accordion__heading__text {
+  @apply no-underline text-xl font-semibold mb-0;
+}
+.govgr-step-nav__accordion__closed, .govgr-step-nav__accordion__opened {
+  @apply text-link no-underline;
+} 
+.govgr-nav-step__accordion__content {
+  @apply hidden md:pt-2 mb-6 pt-1 mx-0;
+
+  >*:last-child {
+    @apply mb-0;
+  }
+}
+.govgr-step-nav__accordion__heading {
+  .govgr-step-nav__accordion__heading__text{
+    @apply md:text-2xl text-xl;
+  }
+  .govgr-step-nav__accordion__closed, .govgr-step-nav__accordion__opened {
+    @apply md:text-sm text-xs;
+  } 
+}
+.govgr-step-nav__accordion__heading-m {
+  .govgr-step-nav__accordion__heading__text {
+    @apply md:text-xl text-lg;
+  } 
+}
+.govgr-step-nav__accordion__heading-s {
+  .govgr-step-nav__accordion__heading__text {
+    @apply md:text-lg text-base;
+  }
+}
+

package/src/components/table.css

@@ -24,7 +24,7 @@
   } 
 }
 .govgr-table__body {
-  @apply static;
+  @apply relative;
 }
 .govgr-table__row {
   @apply bg-white;

package/src/components/task-list.css

@@ -0,0 +1,44 @@
+.govgr-task-list {
+  @apply mb-4 pl-6 pb-2;
+}
+.govgr-task-list__item {
+  @apply mb-8 md:mb-10;
+}
+.govgr-task-list__heading {
+  @apply md:text-3xl text-2xl font-bold mx-0 md:mb-4 mb-2;
+}
+.govgr-task-list__heading-m {
+  @apply md:text-2xl text-xl md:mb-4 mb-2;
+}
+.govgr-task-list__heading-s {
+  @apply md:text-lg text-base md:mb-3 mb-1;
+}
+.govgr-task-list__content {
+  @apply mb-4;
+  .govgr-body {
+    @apply mb-2 md:mb-3;
+  }
+  .govgr-summary-list__row:first-child  {
+    &>dt {
+      @apply border-t-2 border-base150;
+    }
+    &>dd {
+      @apply sm:border-t-2 sm:border-base150;
+    }
+  }
+  .govgr-summary-list__key {
+    @apply font-normal sm:mb-0 mb-2 pt-2;
+  }
+}
+.govgr-task-list__content__tag {
+  @apply px-2 py-1 mr-2 inline-block font-sans text-sm uppercase tracking-widest;
+}
+.govgr-tag__primary {
+  @apply bg-secondary600 text-white;
+}
+.govgr-tag__secondary {
+  @apply bg-secondary50 text-primary;
+}
+.govgr-tag__gray {
+  @apply bg-base100;
+}

package/src/components/timeline.css

@@ -0,0 +1,43 @@
+.govgr-timeline {
+  @apply mb-4 pl-6 pb-2 border-l-4 border-secondary;
+}
+.govgr-timeline--spaced {
+  .govgr-timeline__item {
+    @apply mb-10 md:mb-12;
+  }
+}
+.govgr-timeline__item {
+  @apply mb-8 md:mb-10;
+}
+.govgr-timeline__heading {
+  @apply md:text-3xl text-2xl font-bold mx-0 md:mb-4 mb-2 relative;
+  &::before {
+    content: "";
+    @apply block absolute top-4 -left-6
+    w-4 h-1 bg-secondary;
+  }
+}
+.govgr-timeline__heading-m {
+  @apply md:text-2xl text-xl md:mb-4 mb-2 ;
+  &::before {
+    @apply top-3 w-3;
+  }
+}
+.govgr-timeline__heading-s {
+  @apply md:text-lg text-base md:mb-3 mb-1 ;
+  &::before {
+    @apply top-2.5 w-3;
+  }
+}
+.govgr-timeline__content {
+  @apply mb-4;
+  .govgr-hint, .govgr-body {
+    @apply mb-2 md:mb-3;
+  }
+}
+.govgr-timeline__actions {
+  @apply flex flex-wrap items-center gap-4 mb-6;
+  .govgr-btn, .govgr-link {
+    @apply mb-0;
+  }
+}