@fluid-topics/ft-popover 2.0.37 → 2.1.0

package/build/ftds-popover.styles.js

@@ -1,101 +0,0 @@
-import { css } from "lit";
-import { popover } from "@fluid-topics/design-system-variables";
-// language=css
-export const styles = css `
-    :host {
-        position: relative;
-        display: inline-block;
-    }
-
-    [part="root-container"] {
-        position: relative;
-    }
-
-    [part="popover-container"] {
-        position: absolute;
-        z-index: 100;
-        display: block;
-        margin: auto;
-    }
-
-    [part="closing-button-container"] {
-        position: absolute;
-        top: 8px;
-        right: 8px;
-    }
-
-    [part="overlay"] {
-        position: fixed;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        height: 100%;
-        width: 100%;
-        opacity: 0;
-    }
-
-    [part="wrapper"] {
-        visibility: hidden;
-        position: fixed;
-        display: flex;
-        flex-direction: column;
-
-        max-width: ${popover.maxWidth};
-        min-width: ${popover.minWidth};
-        max-height: ${popover.maxHeight}
-
-        padding-left: ${popover.defaultHorizontalPadding};
-        padding-right: ${popover.defaultHorizontalPadding};
-        padding-top: ${popover.defaultVerticalPadding};
-        padding-bottom: ${popover.defaultVerticalPadding};
-        gap: ${popover.gap};
-
-        background-color: ${popover.backgroundColor};
-        border-radius: ${popover.borderRadius};
-        box-shadow: ${popover.shadow};
-
-        &.positioned {
-            visibility: visible;
-        }
-
-        &.ftds-popover--dense {
-            padding-left: ${popover.denseHorizontalPadding};
-            padding-right: ${popover.denseHorizontalPadding};
-            padding-top: ${popover.denseVerticalPadding};
-            padding-bottom: ${popover.denseVerticalPadding};
-        }
-    }
-
-    [part="heading"] {
-        flex-shrink: 0;
-
-        display: flex;
-        align-items: center;
-        gap: ${popover.gap};
-
-        color: ${popover.titleColor};
-    }
-
-    [part="heading"] ftds-typography {
-        flex-grow: 1;
-        flex-shrink: 1;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: nowrap;
-    }
-
-    [part="content"] {
-        color: ${popover.bodyColor};
-    }
-
-    [part="popover-sections"] {
-        display: flex;
-        flex-direction: column;
-        gap: ${popover.multiSectionVerticalGap};
-    }
-
-    .hidden {
-        display: none;
-    }
-`;