coco.css in coveragebook_components-0.19.6

- old
+ new

@@ -3822,24 +3822,18 @@
   padding-right: 1rem;
   padding-top: 0.5rem;
   padding-bottom: 0.5rem
 }
 
-/* 
-    .alert-icon {
-      @apply flex items-center p-2 rounded-full;
-
-      .coco-icon {
-        @apply w-5 h-5;
-      }
-    } */
-
 [data-coco][data-component="alert"] .alert-body{
-  padding-left: 1rem;
   padding-right: 0.5rem
 }
 
+[data-coco][data-component="alert"] .alert-stamp + .alert-body{
+  padding-left: 1rem
+}
+
 [data-coco][data-component="alert"] .alert-content{
   width: 100%;
   --tw-text-opacity: 1;
   color: rgb(17 24 39 / var(--tw-text-opacity))
 }
@@ -4002,11 +3996,11 @@
         min-height: 3rem;
         padding-top: 0.375rem;
         padding-bottom: 0.375rem;
       }
 
-[data-coco][data-component="alert"][data-condensed="true"] .alert-body{
+[data-coco][data-component="alert"][data-condensed="true"] .alert-stamp + .alert-body{
   padding-left: 0.75rem
 }
 
 [data-coco][data-component="alert"][data-condensed="true"] .alert-title{
   font-family: proxima-nova, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
@@ -4550,11 +4544,19 @@
   --tw-scale-y: .9;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   opacity: 0
 }
 
-[data-coco][data-component="system-banner"] {
+[data-coco][data-component="system-banner"] .alert-stamp{
+  margin-top: 0.25rem !important
+}
+
+@container (min-width: 550px){
+
+  [data-coco][data-component="system-banner"] .alert-stamp{
+    margin-top: 0px !important
   }
+}
 
 [data-coco][data-component="toast"]{
   width: 100%;
   overflow: hidden;
   border-radius: 0.75rem;