← All changes | includes/widgets/Popup/style.css +109 -0 51.1.2 → 51.1.86 View file →

		@@ -1,0 +1,109 @@
	1	+body,
	2	+main {
	3	+ /* hidden first as a fallback; clip does the same job without turning body
	4	+ into a scroll container, which would break position: sticky above it. */
	5	+ overflow-x: hidden;
	6	+ overflow-x: clip;
	7	+}
	8	+
	9	+/*noinspection CssOverwrittenProperties*/
	10	+.king-addons-popup {
	11	+ position: fixed;
	12	+ overflow: auto;
	13	+ transition: all 500ms ease;
	14	+ max-width: 100%;
	15	+ max-height: 100vh;
	16	+ /* Safari fix */
	17	+ max-height: 100svh;
	18	+}
	19	+
	20	+/* Hide scrollbar */
	21	+.king-addons-popup::-webkit-scrollbar {
	22	+ display: none;
	23	+}
	24	+
	25	+.king-addons-popup-overlay {
	26	+ position: fixed;
	27	+ top: 0;
	28	+ left: 0;
	29	+ display: none;
	30	+ width: 100%;
	31	+ height: 100%;
	32	+ transition: opacity 500ms ease;
	33	+ opacity: 0;
	34	+}
	35	+
	36	+.king-addons-popup-close-button {
	37	+ line-height: 1;
	38	+ position: absolute;
	39	+ z-index: 999;
	40	+ top: 10px;
	41	+ right: 10px;
	42	+ bottom: 0;
	43	+ display: block;
	44	+ width: min-content;
	45	+ height: min-content;
	46	+ padding: 0;
	47	+ cursor: pointer;
	48	+}
	49	+
	50	+.king-addons-popup-animation-fade {
	51	+ opacity: 0;
	52	+}
	53	+
	54	+.king-addons-popup-animation-fade.king-addons-popup-active {
	55	+ opacity: 1;
	56	+}
	57	+
	58	+.king-addons-popup-position-top {
	59	+ top: -100%;
	60	+ left: 50%;
	61	+ transform: translateX(-50%);
	62	+ transition: top 500ms ease, transform 500ms ease;
	63	+}
	64	+
	65	+.king-addons-popup-position-right {
	66	+ top: 50%;
	67	+ right: -100%;
	68	+ transform: translateY(-50%);
	69	+ transition: right 500ms ease, transform 500ms ease;
	70	+}
	71	+
	72	+.king-addons-popup-position-bottom {
	73	+ bottom: -100%;
	74	+ left: 50%;
	75	+ transform: translateX(-50%);
	76	+ transition: bottom 500ms ease, transform 500ms ease;
	77	+}
	78	+
	79	+.king-addons-popup-position-left {
	80	+ top: 50%;
	81	+ left: -100%;
	82	+ transform: translateY(-50%);
	83	+ transition: left 500ms ease, transform 500ms ease;
	84	+}
	85	+
	86	+.king-addons-popup-position-top.king-addons-popup-animation-slide.king-addons-popup-active {
	87	+ top: 50%;
	88	+ transform: translate(-50%, -50%);
	89	+}
	90	+
	91	+.king-addons-popup-position-right.king-addons-popup-animation-slide.king-addons-popup-active {
	92	+ right: 50%;
	93	+ transform: translate(50%, -50%);
	94	+}
	95	+
	96	+.king-addons-popup-position-bottom.king-addons-popup-animation-slide.king-addons-popup-active {
	97	+ bottom: 50%;
	98	+ transform: translate(-50%, 50%);
	99	+}
	100	+
	101	+.king-addons-popup-position-left.king-addons-popup-animation-slide.king-addons-popup-active {
	102	+ left: 50%;
	103	+ transform: translate(-50%, -50%);
	104	+}
	105	+
	106	+.king-addons-popup-button {
	107	+ display: inline-block;
	108	+ transition: all .3s;
	109	+}