UNPKG

@nextcloud/vue

Version:
123 lines 4.68 kB
/** * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors * SPDX-License-Identifier: AGPL-3.0-or-later */ /** * SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors * SPDX-License-Identifier: AGPL-3.0-or-later */ /* * Ensure proper alignment of the vue material icons */ ._material-design-icon_wpltc_12 { display: flex; align-self: center; justify-self: center; align-items: center; justify-content: center; } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9, ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9 * { box-sizing: border-box; } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9 .resize-observer { position: absolute; top: 0; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ left: 0; z-index: -1; width: 100%; height: 100%; border: none; background-color: transparent; pointer-events: none; display: block; overflow: hidden; opacity: 0; } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9 .resize-observer object { display: block; position: absolute; top: 0; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1; } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper { z-index: 100000; top: 0; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ left: 0; display: block !important; } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper .v-popper__wrapper { /* * In theory, "filter: drop-shadow" would look better here with arrow shadow. * In fact, in results in a blurry popover in Chromium on scaling. * The hypothesis is that "filter" creates a new composition layer, * and with GPU acceleration requires the previous layers content to be rasterized. * In combination with translate3d from floating-vue, it makes Chromium to first render and rasterize the popover * and then apply scaling, which results in a blurry popover. */ box-shadow: 0 1px 10px var(--color-box-shadow); border-radius: var(--border-radius-element); } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper .v-popper__inner { padding: 0; color: var(--color-main-text); border-radius: var(--border-radius-element); overflow: hidden; background: var(--color-main-background); } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper .v-popper__arrow-container { position: absolute; z-index: 1; width: 0; height: 0; border-style: solid; border-color: transparent; border-width: 10px; } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-container { bottom: -9px; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-bottom-width: 0; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-top-color: var(--color-main-background); } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container { top: -9px; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-top-width: 0; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-bottom-color: var(--color-main-background); } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-container { /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ left: -9px; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-left-width: 0; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-right-color: var(--color-main-background); } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container { /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ right: -9px; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-right-width: 0; /* stylelint-disable-next-line csstools/use-logical */ /* upstream logic */ border-left-color: var(--color-main-background); } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper[aria-hidden=true] { visibility: hidden; transition: opacity var(--animation-quick), visibility var(--animation-quick); opacity: 0; } ._ncPopover_wpltc_20.v-popper--theme-nc-popover-9.v-popper__popper[aria-hidden=false] { visibility: visible; transition: opacity var(--animation-quick); opacity: 1; }