coco.css in coveragebook_components-0.18.0

- old
+ new

@@ -4159,10 +4159,15 @@
 [data-coco][data-component="notice"] div[class="alert-container"]{
   padding-top: 1rem;
   padding-bottom: 1rem
 }
 
+[data-coco][data-component="popover"] {
+    display: none;
+    pointer-events: none;
+  }
+
 [data-coco][data-component="snackbar"]{
   width: 100%;
   overflow: hidden;
   border-radius: 0.75rem;
   --tw-bg-opacity: 1;
@@ -6960,6 +6965,59 @@
 }
 
 .tippy-box[data-theme~="coco-naked-dropdown"] {
   width: -moz-min-content;
   width: min-content;
+}
+
+/* Tippy popover theme */
+
+.tippy-box[data-theme^="coco-popover-"]{
+  border-radius: 0.5rem;
+  border-style: none;
+  padding: 1.5rem;
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 400;
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  width: -moz-fit-content;
+  width: fit-content
+}
+
+.tippy-box[data-theme^="coco-popover-"] .tippy-svg-arrow > svg:first-child{
+  display: none
+}
+
+.tippy-box[data-theme~="coco-popover-neutral"]{
+  border-width: 1px;
+  border-style: solid;
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgb(17 24 39 / var(--tw-text-opacity));
+  background-blend-mode: hard-light;
+  border-color: rgba(0, 12, 39, 0.1)
+}
+
+.tippy-box[data-theme~="coco-popover-neutral"] .tippy-svg-arrow > svg:first-child{
+  display: block;
+  fill: #D1D5DB
+}
+
+.tippy-box[data-theme~="coco-popover-neutral"] .tippy-svg-arrow > svg:last-child{
+  fill: #FFFFFF
+}
+
+.tippy-box[data-theme~="coco-popover-info"]{
+  --tw-bg-opacity: 1;
+  background-color: rgb(2 132 199 / var(--tw-bg-opacity));
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale
+}
+
+.tippy-box[data-theme~="coco-popover-info"] .tippy-svg-arrow > svg:last-child{
+  fill: #0284C7
 }