design-comuni-plone-theme 10.4.0 → 10.4.2

package/src/theme/ItaliaTheme/Blocks/_simpleCardTemplate.scss

@@ -56,6 +56,7 @@
           @include rem-size(font-size, 24);
           @include rem-size(line-height, 26);
           font-weight: 700;
+
           &:hover,
           &:active {
             text-decoration: underline;
@@ -66,11 +67,11 @@
       .category-top {
         span.text {
           span.text.fw-bold {
+            color: $link-color;
             font-size: 0.875rem;
-            line-height: 1.313rem;
-            letter-spacing: 1px;
             font-weight: 600 !important;
-            color: $link-color;
+            letter-spacing: 1px;
+            line-height: 1.313rem;
           }
         }
       }
@@ -78,6 +79,7 @@
       p.card-text {
         font-size: 1rem;
         line-height: 1.5rem;
+
         div.document-date {
           @include rem-size(font-size, 14);
         }
@@ -128,6 +130,7 @@
         @include rem-size(line-height, 32);
         font-weight: 700;
         text-decoration: none;
+
         &:hover,
         &:active {
           text-decoration: underline;

package/src/theme/ItaliaTheme/Blocks/_sliderTemplate.scss

@@ -19,8 +19,8 @@
         justify-content: center;
         padding: 0.5rem;
         border: none;
-        background-color: #3f4142e0;
         border-radius: 16px;
+        background-color: #3f4142e0;
         color: $white;
         font-size: 0.7rem;
         font-weight: bold;

package/src/theme/ItaliaTheme/Blocks/_smallblockLinkstemplate.scss

@@ -6,22 +6,22 @@
   }
 
   .center-image-card {
+    position: relative;
     display: flex;
     overflow: hidden;
     height: 100px;
     align-items: center;
     justify-content: center;
-    border-right: none;
     border: 8px solid $white;
+    border-right: none;
     background: $white;
     box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.1);
-    position: relative;
 
     .img-link svg {
       position: absolute;
+      z-index: 2;
       top: 4px;
       right: 4px;
-      z-index: 2;
     }
 
     .volto-image.responsive img,

package/src/theme/ItaliaTheme/Blocks/_subblocks-edit.scss

@@ -5,8 +5,8 @@
     width: 1.8rem !important;
     height: 1.8rem !important;
     padding: 0.3rem;
-    background-color: #8bb3b5 !important;
     border-radius: 100%;
+    background-color: #8bb3b5 !important;
     line-height: 1rem;
     text-align: center;
 

package/src/theme/ItaliaTheme/Blocks/_tableOfContents.scss

@@ -4,39 +4,46 @@ $space-left: 1rem;
   // template for "Indice dei contenuti"
   .ui.bulleted.list {
     padding-left: 0;
+
     & .ui.bulleted.list {
-      padding-left: 0;
       display: flex;
       flex-direction: column;
       padding-top: 0.5rem;
+      padding-left: 0;
+
       [class^='item headline-'] {
         margin-left: $space-left;
       }
+
       .item:last-child {
         padding-bottom: 0;
       }
     }
+
     .item {
+      position: relative;
       display: flex;
       flex-direction: column;
       justify-content: center;
       padding-bottom: 0.6rem;
       font-size: 0.9rem;
       list-style: none;
-      position: relative;
 
       a {
         display: inline-block;
         margin-left: 1rem;
         text-decoration: none;
       }
+
       &.headline-2 {
+        width: 100%;
         margin-top: 0.5rem;
         font-size: 1rem;
         font-weight: 600;
-        width: 100%;
 
         &::before {
+          position: absolute;
+          top: 0.4rem;
           width: 0;
           height: 0;
           border-top: 0.4rem solid transparent;
@@ -44,13 +51,13 @@ $space-left: 1rem;
           border-left: 0.5rem solid $link-color;
           content: '' !important;
           list-style: none;
-          position: absolute;
-          top: 0.4rem;
         }
       }
 
       &:not(.headline-2)::before {
         position: relative;
+        position: absolute;
+        top: 0.4rem;
         display: inline-block;
         width: 0.55rem;
         min-width: 0.55rem;
@@ -61,23 +68,26 @@ $space-left: 1rem;
         content: '' !important;
         list-style: none;
         transform: rotate(45deg);
-        position: absolute;
-        top: 0.4rem;
       }
     }
   }
+
   ol {
     counter-reset: item;
     list-style-type: none;
   }
+
   ol > li {
     counter-increment: item;
   }
+
   ol > li::before {
     content: counters(item, '.') '. ';
   }
+
   & > ol.ordered.list {
     padding-left: 0;
+
     li {
       padding: 0.25rem 0;
     }

package/src/theme/ItaliaTheme/Blocks/_video.scss

@@ -17,8 +17,8 @@
       left: 50%;
       width: 4rem;
       height: 2.6rem;
-      background-color: rgba(0, 0, 0, 0.7);
       border-radius: 15px;
+      background-color: rgba(0, 0, 0, 0.7);
       color: $white;
       cursor: pointer;
       line-height: 2.6rem;

package/src/theme/ItaliaTheme/Blocks/_videoGallery.scss

@@ -9,6 +9,7 @@
     .full-width {
       height: 400px;
     }
+
     .slick-list {
       margin: 0;
     }
@@ -19,8 +20,8 @@
   }
 
   .add-block-wrapper {
-    text-align: center;
     margin-top: 1rem;
+    text-align: center;
   }
 
   .channel {
@@ -52,8 +53,8 @@
       img.placeholder {
         width: 100%;
         height: 190px;
-        object-fit: cover;
         cursor: auto;
+        object-fit: cover;
       }
 
       .icon-play {
@@ -64,8 +65,8 @@
         left: 50%;
         width: 3.6rem;
         height: 2.5rem;
-        background-color: rgba(0, 0, 0, 0.7);
         border-radius: 15px;
+        background-color: rgba(0, 0, 0, 0.7);
 
         color: $white;
         cursor: pointer;
@@ -114,13 +115,13 @@
       padding: 0 0.5rem;
 
       .ui.embed {
-        pointer-events: none;
         position: relative;
-        min-height: 190px;
         display: flex;
-        justify-content: center;
+        min-height: 190px;
         align-items: center;
+        justify-content: center;
         margin-bottom: 0;
+        pointer-events: none;
       }
     }
 

package/src/theme/ItaliaTheme/Components/_card.scss

@@ -9,10 +9,10 @@
 }
 
 .card.border-left-card {
-  border-left: 8px solid $primary-a0;
-  box-shadow: 0px 4px 4px 0px #00000026;
   display: flex;
   flex-wrap: nowrap;
+  border-left: 8px solid $primary-a0;
+  box-shadow: 0px 4px 4px 0px #00000026;
 
   &.card-small {
     @include rem-size(line-height, 24);
@@ -40,6 +40,7 @@
     .text.fw-bold {
       color: $link-color;
       font-weight: 600;
+
       a {
         @include rem-size(font-size, 24);
         @include rem-size(line-height, 32);
@@ -67,8 +68,10 @@
   &.card.card-teaser {
     display: flex;
   }
+
   .card-body {
     padding: 0em !important;
+
     .category-top {
       .category {
         text-decoration: none;
@@ -83,8 +86,8 @@
       &.venue-card-title.venue-card-title {
         @include rem-size(font-size, 24);
         @include rem-size(line-height, 32);
-        text-decoration: none;
         font-weight: 600;
+        text-decoration: none;
       }
 
       a:hover {
@@ -118,8 +121,8 @@
 
 .card.preview-image-card {
   .image-container {
-    margin: auto;
     flex-basis: 20%;
+    margin: auto;
 
     img {
       max-width: 64px;
@@ -143,6 +146,7 @@
       a:hover {
         text-decoration: underline;
       }
+
       svg {
         fill: $link-color;
       }
@@ -168,8 +172,8 @@
     }
 
     .card-body {
-      margin-left: 0em;
       flex-basis: 100%;
+      margin-left: 0em;
     }
   }
 }
@@ -183,21 +187,24 @@
 .custom-calendar-card {
   .card-calendar.extended {
     width: 100px;
+
     .card-date .date-label {
       @include rem-size(font-size, 16);
       font-weight: 600;
+
       + .date {
         @include rem-size(font-size, 20);
       }
     }
   }
+
   .card-calendar {
     .card-date {
       .date {
         font-family: $font-family-sans-serif;
         font-size: 1.3rem;
-        line-height: 1.4rem;
         font-weight: 700;
+        line-height: 1.4rem;
 
         &.day {
           @include rem-size(font-size, 28);
@@ -205,10 +212,10 @@
         }
 
         &.month {
+          font-weight: 600;
           text-transform: capitalize;
           @include rem-size(font-size, 16);
           @include rem-size(line-height, 21.1);
-          font-weight: 600;
         }
       }
     }

package/src/theme/ItaliaTheme/Components/_cardPersona.scss

@@ -1,7 +1,7 @@
 .card-persona.card-flex {
   .card-image-wrapper {
-    flex: 1;
     display: flex;
+    flex: 1;
     align-items: flex-start;
   }
 
@@ -35,8 +35,8 @@
         width: 50%;
 
         svg {
-          height: 1.78rem;
           width: auto;
+          height: 1.78rem;
         }
 
         span.text {

package/src/theme/ItaliaTheme/Components/_cmp-timeline.scss

@@ -25,14 +25,15 @@
 }
 
 .calendar-vertical {
-  color: $link-color;
   clear: both;
+  color: $link-color;
 
   &::after {
     display: block;
     clear: both;
     content: '';
   }
+
   .title-xxlarge-regular {
     font-size: 2.222222rem;
     @include media-breakpoint-down(md) {
@@ -41,6 +42,7 @@
     font-weight: 400;
     line-height: 1;
   }
+
   .title-medium-2 {
     font-size: 1.5rem;
     @include media-breakpoint-down(md) {
@@ -55,19 +57,19 @@
   display: flex;
 
   & .calendar-date-description {
-    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.17);
+    overflow: hidden;
     width: 100%;
     margin: 0 0 1.5rem 0.813rem;
-    overflow: hidden;
+    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.17);
 
     @include media-breakpoint-up(sm) {
       margin: 0 0 1.33rem 0.72rem;
     }
 
     & .calendar-date-description-content {
-      padding: 1.25rem 1rem 1.25rem 1.5rem;
       position: relative;
       z-index: 0;
+      padding: 1.25rem 1rem 1.25rem 1.5rem;
       border-left: 8px solid $primary-a0;
 
       @include media-breakpoint-up(sm) {
@@ -96,19 +98,19 @@
   }
 
   & .calendar-date-day {
-    width: 4.06rem;
-    flex-shrink: 0;
     position: relative;
     z-index: 0;
+    width: 4.06rem;
+    flex-shrink: 0;
     padding: 0.5rem 0;
     padding-right: 1rem;
 
     & p {
+      display: block;
+      margin: 0 0 5px 0;
       font-family: 'Roboto Mono', monospace !important;
       font-size: 2.5rem;
       line-height: 1;
-      margin: 0 0 5px 0;
-      display: block;
     }
 
     & small {
@@ -128,27 +130,27 @@
     }
 
     &:after {
-      content: '';
-      width: 0.625rem;
-      height: 0.625rem;
       position: absolute;
       z-index: 1;
       top: 1.875rem;
       right: 0.2px;
-      background-color: $link-color;
+      width: 0.625rem;
+      height: 0.625rem;
       border-radius: 5px;
+      background-color: $link-color;
+      content: '';
 
       @include media-breakpoint-down(md) {
+        top: 1.56rem;
         width: 0.56rem;
         height: 0.56rem;
-        top: 1.56rem;
       }
     }
 
     &__month {
-      font-weight: 600;
       display: flex;
       justify-content: center;
+      font-weight: 600;
     }
 
     &__year {

package/src/theme/ItaliaTheme/Components/_contactsCard.scss

@@ -1,17 +1,17 @@
 .card.contacts-card {
   .card-text {
-    font-size: 1rem;
-    @include rem-size(line-height, 28);
     display: flex;
     flex-wrap: wrap;
+    font-size: 1rem;
+    @include rem-size(line-height, 28);
 
     span {
       flex: 1 1 100%;
     }
 
     strong {
-      text-transform: capitalize;
       font-weight: 600;
+      text-transform: capitalize;
     }
   }
 }

package/src/theme/ItaliaTheme/Components/_customerSatisfaction.scss

@@ -4,13 +4,16 @@
     overflow: hidden;
     max-height: 0;
   }
+
   .feedback-form #vf-more-positive[aria-expanded='true'],
   .feedback-form #vf-more-negative[aria-expanded='true'] {
     max-height: 800px;
   }
+
   .feedback-form {
-    margin: 0;
     padding: 2rem 0;
+    margin: 0;
+
     .title-medium-2-semi-bold {
       font-size: 1.25rem;
       font-weight: 600;
@@ -22,15 +25,19 @@
         line-height: 1.2;
       }
     }
+
     .rating-container {
       padding-bottom: 0;
     }
+
     .form-check label {
       font-weight: 600;
     }
+
     .answers-form .form-check:last-of-type {
       margin-bottom: 0;
     }
+
     .card-wrapper[data-element='feedback'] {
       padding: 1.8rem !important;
     }
@@ -40,28 +47,32 @@
         padding: 0.78rem;
         margin-bottom: 2.111rem;
         font-size: 1rem;
+
         & > div {
           font-size: 0.7777777778rem;
         }
       }
     }
+
     .answers-header,
     .comments-header {
-      font-size: 1.125rem;
-      font-weight: 600;
-      line-height: 2;
-      padding: 0.875rem;
-      margin-bottom: 2.375rem;
       display: flex;
       align-items: center;
       justify-content: space-between;
+      padding: 0.875rem;
+      margin-bottom: 2.375rem;
       box-shadow: 0 0.9375rem 1.325rem -0.9rem rgba(0, 0, 0, 0.1);
+      font-size: 1.125rem;
+      font-weight: 600;
+      line-height: 2;
+
       > div {
+        margin-left: 0.5rem;
         font-size: 0.875rem;
         font-weight: 600;
         line-height: 1.5;
-        margin-left: 0.5rem;
       }
+
       h6 {
         margin-bottom: 0;
       }
@@ -71,47 +82,56 @@
       .form-group {
         margin-bottom: 0;
       }
+
       .invalid-feedback.form-text.text-muted {
         display: block;
         color: var(--bs-danger) !important;
       }
+
       small {
-        margin: 0;
         padding: 0.25rem 0.5rem;
+        margin: 0;
         font-size: 0.777rem;
+
         &.invalid-feedback {
           display: block;
         }
       }
+
       label.active {
         color: #596d88;
       }
+
       textarea {
         border: none;
-        border-bottom: 1px solid #5b6f82;
         border-radius: 0;
+        border-bottom: 1px solid #5b6f82;
       }
     }
+
     .card:after {
       content: none;
     }
 
     .form-step-actions[aria-hidden='true'] {
       padding: 0rem;
+
       .next-action,
       .prev-action {
         height: 0;
       }
     }
+
     .form-step-actions[aria-hidden='false'] {
       .next-action,
       .prev-action {
-        visibility: visible;
         padding: 12px 24px;
+        visibility: visible;
       }
+
       &.button-shadow {
-        box-shadow: 0 -0.6375rem 1.125rem -0.9rem rgba(0, 0, 0, 0.1);
         margin-top: 1.25rem;
+        box-shadow: 0 -0.6375rem 1.125rem -0.9rem rgba(0, 0, 0, 0.1);
         @media (min-width: #{map-get($grid-breakpoints, sm)}) {
           margin-top: 1.11rem;
         }