@vimeo/iris/components/PopOver/PopOver.style.js

Vimeo Design System

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib_es6 = require('../../tslib.es6-3ec409b7.js');
var styled = require('styled-components');
var polished = require('polished');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);

var fadeIn = styled.keyframes(templateObject_1 || (templateObject_1 = tslib_es6.__makeTemplateObject(["\n  0% {\n    transform: translateY(-0.25rem) scale(0.98);\n    opacity: 0;\n\n  }\n\n  100% {\n    transform: translateY(0) scale(1);\n    opacity: 1;\n  }\n"], ["\n  0% {\n    transform: translateY(-0.25rem) scale(0.98);\n    opacity: 0;\n\n  }\n\n  100% {\n    transform: translateY(0) scale(1);\n    opacity: 1;\n  }\n"])));
var PopOverStyled = styled__default["default"].div(templateObject_4 || (templateObject_4 = tslib_es6.__makeTemplateObject(["\n  background: ", ";\n  min-width: 10rem;\n  min-height: 2rem;\n  max-width: 40rem;\n  border-radius: 0.25rem;\n  animation: ", " 150ms ease-in-out;\n\n  ", ";\n"], ["\n  background: ", ";\n  min-width: 10rem;\n  min-height: 2rem;\n  max-width: 40rem;\n  border-radius: 0.25rem;\n  animation: ", " 150ms ease-in-out;\n\n  ", ";\n"])), function (_a) {
    var theme = _a.theme;
    return theme.content.background;
}, fadeIn, function (p) {
    return p.theme.name === 'dark'
        ? styled.css(templateObject_2 || (templateObject_2 = tslib_es6.__makeTemplateObject(["\n          border: 1px solid ", ";\n        "], ["\n          border: 1px solid ", ";\n        "])), polished.rgba(255, 255, 255, 0.125)) : styled.css(templateObject_3 || (templateObject_3 = tslib_es6.__makeTemplateObject(["\n          box-shadow: 0 0 ", " 0 rgba(0, 0, 0, 0.15),\n            0 ", " ", " 0 rgba(0, 0, 0, 0.15);\n        "], ["\n          box-shadow: 0 0 ", " 0 rgba(0, 0, 0, 0.15),\n            0 ", " ", " 0 rgba(0, 0, 0, 0.15);\n        "])), polished.rem(1), polished.rem(4), polished.rem(8));
});
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

exports.PopOverStyled = PopOverStyled;