Merge pull request #606 from danskernesdigitalebibliotek/DDFFORM-662-…

…frontend

Add styles for recurring opening hours (editor)

src/stories/Library/opening-hours-editor/opening-hours-editor.scss

@@ -6,7 +6,7 @@
   display: grid;
   background: #f8f8f8;
   padding: 2.5rem;
-  min-width: 300px;
+  width: 350px;
   line-height: 1;
 }
 
@@ -26,9 +26,30 @@
   background-color: #fff;
 }
 
+.opening-hours-editor-form__checkbox {
+  margin-top: 0.75rem;
+  margin-bottom: 0.5rem;
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+
+  label {
+    margin: 0;
+  }
+}
+
+.opening-hours-editor-form__table {
+  tr > td:last-child {
+    white-space: nowrap;
+    text-align: right;
+  }
+}
+
 .opening-hours-editor-form__submit,
-.opening-hours-editor-form__remove {
+.opening-hours-editor-form__remove,
+.opening-hours-editor-form__cancel {
   cursor: pointer;
+  border: 0;
   margin-top: 1rem;
   color: #fff;
   padding: 0.75rem 1.5rem;
@@ -37,7 +58,6 @@
 }
 
 .opening-hours-editor-form__submit {
-  border: 0;
   background-color: #22c55e;
 
   &:hover {
@@ -46,17 +66,34 @@
 }
 
 .opening-hours-editor-form__remove {
-  border: 0;
   background-color: #ef4444;
 
   &:hover {
     background-color: #dc2626;
   }
 }
 
+.opening-hours-editor-form__cancel {
+  background-color: #d1d5db;
+
+  &:hover {
+    background-color: #a1a1aa;
+  }
+}
+
 .opening-hours-editor-event-content {
   padding: 5px 10px;
   cursor: pointer;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  background-color: rgba(255, 255, 255, 0.8);
+  color: black;
+}
+
+.opening-hours-editor-event-content__series-icon {
+  width: 30px;
+  height: 30px;
 }
 
 // Override Drupal's default margin for tables inside .fc to eliminate top and bottom spacing