summaryrefslogtreecommitdiffstats
path: root/docs/components/ui/Popover/Popover.css
diff options
context:
space:
mode:
Diffstat (limited to 'docs/components/ui/Popover/Popover.css')
-rw-r--r--docs/components/ui/Popover/Popover.css101
1 files changed, 0 insertions, 101 deletions
diff --git a/docs/components/ui/Popover/Popover.css b/docs/components/ui/Popover/Popover.css
deleted file mode 100644
index 724547f..0000000
--- a/docs/components/ui/Popover/Popover.css
+++ /dev/null
@@ -1,101 +0,0 @@
-@scope (#pop-demo) {
- :scope {
- position: relative;
- display: block;
- padding: 2rem 0.5rem 0;
- height: 300px;
- margin: 0 auto;
- text-align: center;
- }
-
- .ui-popbutton {
- border-radius: 0.25rem;
- border-width: 1px;
- background-color: rgb(0 0 0 / 0.1);
- padding-top: 0.25rem;
- padding-bottom: 0.25rem;
- padding-left: 1rem;
- padding-right: 1rem;
- font-weight: 600;
- color: white;
- box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
- 0 4px 6px -4px rgb(0 0 0 / 0.1);
- }
- .ui-popbutton:hover {
- background-color: rgb(0 0 0 / 0.2);
- }
-
- [popover] {
- background-color: Canvas;
- border-radius: 0.25rem;
- border: 1px solid #666;
- color: CanvasText;
- height: fit-content;
- margin: 0.75rem auto 0;
- padding: 1rem;
- width: 15rem;
- overflow: visible;
- transition: all 0.2s allow-discrete;
- /* Final state of the exit animation */
- opacity: 0;
- transform: translateY(-3rem);
- }
- [popover]:popover-open {
- opacity: 1;
- transform: translateY(0);
- }
- /* Needs to be after the previous [popover]:popover-open rule
- to take effect, as the specificity is the same */
- @starting-style {
- [popover]:popover-open {
- opacity: 0;
- transform: translateY(-3rem);
- }
- }
-
- /* Transition for the popover's backdrop */
- [popover]::backdrop {
- /* Final state of the exit animation */
- background-color: rgb(0 0 0 / 0%);
- transition: all 0.2s allow-discrete;
- }
- [popover]:popover-open::backdrop {
- background-color: rgb(0 0 0 / 15%);
- }
- @starting-style {
- [popover]:popover-open::backdrop {
- background-color: rgb(0 0 0 / 0%);
- }
- }
-
- [popover] h1 {
- font-weight: bold;
- margin-bottom: 0.75rem;
- }
- [popover] label {
- display: flex;
- align-items: center;
- justify-content: space-between;
- font-size: 0.75rem;
- line-height: 1rem;
- }
- [popover] input {
- margin-left: auto;
- width: 66.666667%;
- border-radius: 0.25rem;
- border-width: 1px;
- padding: 0.25rem;
- font-size: 0.75rem;
- line-height: 1rem;
- }
- [popover] svg.arrow {
- position: absolute;
- top: -4px;
- left: 50%;
- z-index: 10;
- display: block;
- transform: rotate(180deg);
- border-color: rgb(255 255 255);
- fill: white;
- }
-} \ No newline at end of file