PluginProbe
Elementor Website Builder – more than just a page builder / 3.30.0-beta1
Elementor Website Builder – more than just a page builder v3.30.0-beta1
4.3.4 4.3.3 4.3.2 4.3.1 4.3.0 4.3.0-beta3 4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 All 457 releases
← All changes | assets/css/app-rtl.css +532 -241 4.3.1 → 3.30.0-beta1 View file →
@@ -1,5 +1,8 @@
1 +/*! elementor - v3.30.0 - 10-06-2025 */
1 2 @import "//fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";
3 +@import "//fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap";
4 +@import "//fonts.googleapis.com/css2?family=Source%20Serif%20Pro&display=swap";
2 5 :root {
3 6 --color-box-shadow-color: rgba(0, 0, 0, 0.05);
4 7 }
5 8
@@ -489,9 +492,9 @@
489 492 button {
490 493 border-radius: 0;
491 494 }
492 495
493 -button:focus:not(:where([data-module=onboarding] *)) {
496 +button:focus {
494 497 outline: 1px dotted;
495 498 outline: 5px auto -webkit-focus-ring-color;
496 499 }
497 500
@@ -690,10 +693,10 @@
690 693 height: 0;
691 694 }
692 695 .video-wrapper iframe {
693 696 position: absolute;
694 - inset-block-start: 0;
695 - inset-inline-start: 0;
697 + top: 0;
698 + right: 0;
696 699 width: 100%;
697 700 height: 100%;
698 701 }
699 702
@@ -749,12 +752,12 @@
749 752 justify-content: center;
750 753 position: fixed;
751 754 height: 100%;
752 755 width: 100%;
753 - inset-block-end: 0;
754 - inset-inline-start: 0;
755 756 background-color: var(--app-lightbox-background-color);
756 757 z-index: 1040;
758 + bottom: 0;
759 + right: 0;
757 760 }
758 761 .eps-app__header {
759 762 flex-shrink: 0;
760 763 font-size: 0.9375rem;
@@ -794,11 +797,12 @@
794 797 width: 1.75rem;
795 798 height: 1.75rem;
796 799 line-height: 1.75rem;
797 800 text-align: center;
798 - font-size: 1.75rem;
801 + font-size: calc(0.4 * 1.75rem);
799 802 border-radius: 50%;
800 - color: var(--app-logo-background-color);
803 + color: var(--app-logo-color);
804 + background-color: var(--app-logo-background-color);
801 805 }
802 806 .eps-app__logo:not(:last-child) {
803 807 margin-inline-end: 0.625rem;
804 808 }
@@ -900,11 +904,11 @@
900 904 }
901 905
902 906 .elementor-loader-wrapper {
903 907 position: absolute;
904 - inset-block-start: 50%;
905 - inset-inline-start: 50%;
906 - transform: translate(calc(-50% * var(--direction-multiplier)), -50%);
908 + top: 50%;
909 + left: 50%;
910 + transform: translate(-50%, -50%);
907 911 width: 300px;
908 912 display: flex;
909 913 flex-direction: column;
910 914 align-items: center;
@@ -934,13 +938,13 @@
934 938 }
935 939 .elementor-loader-box:nth-of-type(1) {
936 940 width: 20%;
937 941 height: 100%;
938 - inset-block-start: 0;
939 - inset-inline-start: 0;
942 + right: 0;
943 + top: 0;
940 944 }
941 945 .elementor-loader-box:not(:nth-of-type(1)) {
942 - inset-inline-end: 0;
946 + left: 0;
943 947 height: 20%;
944 948 width: 60%;
945 949 }
946 950 .elementor-loader-box:nth-of-type(2) {
@@ -1050,9 +1054,9 @@
1050 1054 }
1051 1055 .e-app-import-export-wizard-step__notice {
1052 1056 display: block;
1053 1057 position: sticky;
1054 - inset-block-start: 100%; /* Will prevent text overlapping when window height is too short. */
1058 + top: 100%; /* Will prevent text overlapping when window height is too short. */
1055 1059 color: var(--e-app-import-export-wizard-step-block-end-text-color);
1056 1060 font-style: italic;
1057 1061 margin-block-end: 0;
1058 1062 }
@@ -1068,9 +1072,9 @@
1068 1072 --e-app-import-export-page-header-description-color: #69727D;
1069 1073 margin-block-end: 2.75rem;
1070 1074 }
1071 1075 .e-app-import-export-page-header__content-wrapper {
1072 - max-width: 655px;
1076 + max-width: 645px;
1073 1077 }
1074 1078 .e-app-import-export-page-header__heading {
1075 1079 color: var(--e-app-import-export-page-header-heading-color);
1076 1080 }
@@ -1167,8 +1171,11 @@
1167 1171 border: var(--card-border);
1168 1172 border-radius: 0.1875rem;
1169 1173 transition: 0.3s;
1170 1174 font-size: 0.75rem;
1175 + /*
1176 + todo: TBD: Optionally remove headline styling in favor of a global atom depending on variation needs
1177 + */
1171 1178 }
1172 1179 .eps-card__header {
1173 1180 padding: 0.625rem;
1174 1181 border-block-end: var(--card-header-footer-border);
@@ -1178,13 +1185,8 @@
1178 1185 }
1179 1186 .eps-card__header--padding {
1180 1187 padding: var(--eps-card-header-padding);
1181 1188 }
1182 -.eps-card {
1183 - /*
1184 - todo: TBD: Optionally remove headline styling in favor of a global atom depending on variation needs
1185 - */
1186 -}
1187 1189 .eps-card__headline {
1188 1190 color: var(--card-headline-color);
1189 1191 margin-block-end: 0;
1190 1192 font-weight: 500;
@@ -1212,14 +1214,14 @@
1212 1214 object-fit: contain;
1213 1215 -o-object-position: top;
1214 1216 object-position: top;
1215 1217 position: absolute;
1216 - inset-block-start: 0;
1217 - inset-inline-start: 0;
1218 + top: 0;
1219 + right: 0;
1218 1220 }
1219 1221 .eps-card__image-overlay {
1220 1222 position: absolute;
1221 - inset-block-start: 0;
1223 + top: 0;
1222 1224 background-color: var(--card-image-overlay-background-color);
1223 1225 z-index: 1;
1224 1226 width: 100%;
1225 1227 height: 100%;
@@ -1266,10 +1268,10 @@
1266 1268 .eps-menu-item::before {
1267 1269 content: "";
1268 1270 display: block;
1269 1271 position: absolute;
1270 - inset-block-start: 0;
1271 - inset-inline-start: 0;
1272 + top: 0;
1273 + right: 0;
1272 1274 height: 100%;
1273 1275 width: var(--menu-item-pointer-width);
1274 1276 background-color: #0C0D0E;
1275 1277 }
@@ -2135,9 +2137,9 @@
2135 2137 position: absolute;
2136 2138 z-index: 1050;
2137 2139 margin-block-start: 9px;
2138 2140 transform: translateX(-50%);
2139 - inset-inline-start: 0.25rem;
2141 + right: 0.25rem;
2140 2142 }
2141 2143 .eps-popover__background {
2142 2144 position: fixed;
2143 2145 inset: 0;
@@ -2152,10 +2154,10 @@
2152 2154 position: absolute;
2153 2155 width: 16px;
2154 2156 height: 9px;
2155 2157 margin: 0 0.1875rem 9px;
2156 - inset-block-start: -9px;
2157 - inset-inline-start: 50%;
2158 + top: -9px;
2159 + right: 50%;
2158 2160 transform: translateX(-50%);
2159 2161 border-color: transparent;
2160 2162 border-style: solid;
2161 2163 border-width: 0 calc(16px / 2) 9px calc(16px / 2);
@@ -2161,14 +2163,14 @@
2161 2163 border-width: 0 calc(16px / 2) 9px calc(16px / 2);
2162 2164 border-block-end-color: var(--popover-arrow-color);
2163 2165 }
2164 2166 .eps-popover--arrow-start::before {
2165 - inset-inline-start: 0.1875rem;
2167 + right: 0.1875rem;
2166 2168 transform: none;
2167 2169 }
2168 2170 .eps-popover--arrow-end::before {
2169 - inset-inline-start: auto;
2170 - inset-inline-end: 0.1875rem;
2171 + left: 0.1875rem;
2172 + right: auto;
2171 2173 transform: none;
2172 2174 }
2173 2175 .eps-popover--arrow-none::before {
2174 2176 display: none;
@@ -2291,8 +2293,12 @@
2291 2293 }
2292 2294 .eps-checkbox--rounded {
2293 2295 border-radius: 50%;
2294 2296 }
2297 +.eps-checkbox--indeterminate {
2298 + --checkbox-background-color: var(--checkbox-checked-background-color);
2299 + --checkbox-border-color: var(--checkbox-checked-background-color);
2300 +}
2295 2301 .eps-checkbox--indeterminate::after {
2296 2302 display: inline-block;
2297 2303 margin-block-end: 0;
2298 2304 content: " ";
@@ -2300,12 +2306,8 @@
2300 2306 height: 0;
2301 2307 transform: rotate(0deg);
2302 2308 border-block-start: 1px solid #ffffff;
2303 2309 }
2304 -.eps-checkbox--indeterminate {
2305 - --checkbox-background-color: var(--checkbox-checked-background-color);
2306 - --checkbox-border-color: var(--checkbox-checked-background-color);
2307 -}
2308 2310 .eps-checkbox--error::before, .eps-checkbox--error::after, .eps-checkbox--error:checked::before, .eps-checkbox--error:checked::after {
2309 2311 display: inline-block;
2310 2312 margin-block-end: 0;
2311 2313 content: " ";
@@ -2353,10 +2355,10 @@
2353 2355 width: 375px;
2354 2356 }
2355 2357 .eps-dialog__close-button {
2356 2358 position: absolute;
2357 - inset-block-start: -2.75rem;
2358 - inset-inline-end: -2.75rem;
2359 + top: -2.75rem;
2360 + left: -2.75rem;
2359 2361 margin-block-start: 0.625rem;
2360 2362 margin-inline-end: 0.625rem;
2361 2363 z-index: 1040;
2362 2364 font-size: 1.25rem;
@@ -2396,10 +2398,10 @@
2396 2398 }
2397 2399 .e-app__popover:before {
2398 2400 content: "";
2399 2401 position: absolute;
2400 - inset-block-start: -16px;
2401 - inset-inline-end: var(--popover-arrow-offset-end, 22px);
2402 + top: -16px;
2403 + left: var(--popover-arrow-offset-end, 22px);
2402 2404 border: 8px solid transparent;
2403 2405 border-block-end-color: #fff;
2404 2406 }
2405 2407
@@ -2657,13 +2659,28 @@
2657 2659 }
2658 2660 .e-app-export-kit-information__field--error {
2659 2661 border-color: var(--e-a-color-danger);
2660 2662 }
2663 +.e-app-export-kit-information__field--error::-moz-placeholder {
2664 + color: var(--e-a-color-danger);
2665 +}
2666 +.e-app-export-kit-information__field--error::placeholder {
2667 + color: var(--e-a-color-danger);
2668 +}
2669 +.e-app-export-kit-information__field--error::-webkit-input-placeholder {
2670 + color: var(--e-a-color-danger);
2671 +}
2672 +.e-app-export-kit-information__field--error::-moz-placeholder {
2673 + color: var(--e-a-color-danger);
2674 +}
2675 +.e-app-export-kit-information__field--error:-ms-input-placeholder {
2676 + color: var(--e-a-color-danger);
2677 +}
2661 2678 .e-app-export-kit-information__error-container {
2662 2679 height: 20px;
2663 2680 display: flex;
2664 2681 align-items: flex-start;
2665 - margin-block-start: 4px;
2682 + margin-top: 4px;
2666 2683 }
2667 2684 .e-app-export-kit-information__validation-error {
2668 2685 color: var(--e-a-color-danger);
2669 2686 }
@@ -2717,9 +2734,9 @@
2717 2734 outline: none;
2718 2735 }
2719 2736 .eps-collapse__icon {
2720 2737 transition: all 150ms;
2721 - scale: calc(1 * var(--direction-multiplier)) 1;
2738 + transform: rotate(180deg);
2722 2739 }
2723 2740 .eps-collapse__content {
2724 2741 margin-block-start: 0.625rem;
2725 2742 display: none;
@@ -2798,8 +2815,9 @@
2798 2815 .e-kit-library__filter-indication-button {
2799 2816 margin-inline-start: 1.5rem;
2800 2817 }
2801 2818
2819 +#eps-app-header-btn-apply,
2802 2820 #eps-app-header-btn-promotion,
2803 2821 #eps-app-header-btn-connect {
2804 2822 margin-inline-start: 0.625rem;
2805 2823 margin-inline-end: 0.625rem;
@@ -2804,17 +2822,8 @@
2804 2822 margin-inline-start: 0.625rem;
2805 2823 margin-inline-end: 0.625rem;
2806 2824 }
2807 2825
2808 -#eps-app-header-btn-apply {
2809 - margin-inline-start: 0.625rem;
2810 -}
2811 -
2812 -#eps-app-header-btn-download {
2813 - margin-inline-end: 1rem;
2814 - margin-inline-start: 1rem;
2815 -}
2816 -
2817 2826 .e-kit-library__apply-button {
2818 2827 display: flex;
2819 2828 align-items: center;
2820 2829 justify-content: center;
@@ -2863,30 +2872,22 @@
2863 2872 margin: 0 3px;
2864 2873 }
2865 2874 .e-kit-library__kit-item-subscription-plan-badge {
2866 2875 --e-a-color-brand: #467FF7;
2867 -}
2868 -.e-kit-library__kit-item-subscription-plan-badge.promoted {
2869 - --e-a-color-brand: #92003B;
2870 -}
2871 -.e-kit-library__kit-item-subscription-plan-badge {
2872 2876 position: absolute;
2873 - inset-block-start: 0;
2874 - inset-inline-end: 0;
2877 + top: 0;
2878 + left: 0;
2875 2879 margin: 0.3125rem;
2876 2880 background-color: var(--e-a-color-brand);
2877 2881 color: #ffffff;
2878 2882 text-transform: uppercase;
2879 2883 }
2884 +.e-kit-library__kit-item-subscription-plan-badge.promoted {
2885 + --e-a-color-brand: #92003B;
2886 +}
2880 2887 .e-kit-library__kit-item-header {
2881 2888 position: relative;
2882 2889 }
2883 -.e-kit-library__kit-item-lock-icon {
2884 - font-size: 14px;
2885 - margin-inline-end: 8px;
2886 - color: var(--card-headline-color);
2887 - cursor: pointer;
2888 -}
2889 2890 .e-kit-library__kit-item-actions-menu i {
2890 2891 font-size: 16px;
2891 2892 }
2892 2893 .e-kit-library__kit-item-actions-popover {
@@ -2895,11 +2896,11 @@
2895 2896 align-items: start;
2896 2897 min-width: 0;
2897 2898 padding: 12px 0;
2898 2899 position: absolute;
2899 - inset-block-start: 25px;
2900 - inset-inline-start: 100%;
2901 - transform: translateX(calc(-100% * var(--direction-multiplier)));
2900 + top: 25px;
2901 + left: 100%;
2902 + transform: translateX(-100%);
2902 2903 }
2903 2904 .e-kit-library__kit-item-actions-popover-item {
2904 2905 display: flex;
2905 2906 height: 30px;
@@ -2944,22 +2945,8 @@
2944 2945 }
2945 2946 .e-kit-library__kit-item-cloud-overlay-import-button > span {
2946 2947 font-size: 15px;
2947 2948 }
2948 -.e-kit-library__kit-item-cloud-overlay i.eicon-lock {
2949 - font-size: 48px;
2950 - color: rgba(255, 255, 255, 0.8);
2951 - cursor: pointer;
2952 -}
2953 -.e-kit-library__kit-item--locked {
2954 - opacity: 0.6;
2955 -}
2956 -.e-kit-library__kit-item--locked .eps-card__image {
2957 - opacity: 0.7;
2958 -}
2959 -.e-kit-library__kit-item--locked .eps-card__overlay {
2960 - background-color: rgba(0, 0, 0, 0.5);
2961 -}
2962 2949
2963 2950 :root {
2964 2951 --e-kit-library-header-back-border: 1px solid var(--e-a-border-color);
2965 2952 --e-kit-library-header-back-color: #69727D;
@@ -2984,9 +2971,9 @@
2984 2971 flex: 1;
2985 2972 height: 100%;
2986 2973 }
2987 2974 .e-kit-library__header-back .eps-icon {
2988 - scale: calc(1 * var(--direction-multiplier)) 1;
2975 + transform: rotate(180deg);
2989 2976 }
2990 2977
2991 2978 .e-kit-library__page-loader {
2992 2979 width: 100%;
@@ -3044,10 +3031,10 @@
3044 3031 font-size: 1.25rem;
3045 3032 padding: 0.625rem;
3046 3033 color: #69727D;
3047 3034 position: absolute;
3048 - inset-block-start: 0;
3049 - inset-inline-start: 0;
3035 + top: 0;
3036 + right: 0;
3050 3037 height: 100%;
3051 3038 display: flex;
3052 3039 align-items: center;
3053 3040 justify-content: center;
@@ -3059,10 +3046,10 @@
3059 3046 font-size: 0.875rem;
3060 3047 padding: 0.625rem;
3061 3048 color: #69727D;
3062 3049 position: absolute;
3063 - inset-block-start: 0;
3064 - inset-inline-end: 0;
3050 + top: 0;
3051 + left: 0;
3065 3052 height: 100%;
3066 3053 display: flex;
3067 3054 align-items: center;
3068 3055 justify-content: center;
@@ -3097,10 +3084,11 @@
3097 3084 .eps-sort-select__select-wrapper::after {
3098 3085 content: "\e8ad";
3099 3086 font-family: eicons;
3100 3087 position: absolute;
3101 - inset-inline-end: 0.625rem;
3102 - inset-block: 0;
3088 + left: 0.625rem;
3089 + top: 0;
3090 + bottom: 0;
3103 3091 color: #69727D;
3104 3092 display: flex;
3105 3093 align-items: center;
3106 3094 justify-content: center;
@@ -3197,14 +3185,13 @@
3197 3185 }
3198 3186 .e-kit-library__index-layout-heading {
3199 3187 padding: 1.875rem 2.75rem;
3200 3188 position: sticky;
3201 - inset-block-start: -1px;
3189 + top: -1px;
3202 3190 width: 100%;
3203 3191 z-index: 2;
3204 3192 background-color: var(--app-background-color);
3205 3193 gap: 1.5rem;
3206 - align-items: center;
3207 3194 }
3208 3195 .e-kit-library__index-layout-heading-search, .e-kit-library__index-layout-heading-sort {
3209 3196 min-width: 265px;
3210 3197 }
@@ -3210,13 +3197,8 @@
3210 3197 }
3211 3198 .e-kit-library__index-layout-heading-search {
3212 3199 flex: 1;
3213 3200 }
3214 -.e-kit-library__index-layout-heading-quota {
3215 - display: flex;
3216 - align-items: center;
3217 - justify-content: flex-end;
3218 -}
3219 3201 .e-kit-library__index-layout-main {
3220 3202 padding-block-start: 0;
3221 3203 padding-block-end: 1.5rem;
3222 3204 overflow-y: hidden;
@@ -3225,45 +3207,8 @@
3225 3207 display: flex;
3226 3208 flex-direction: column;
3227 3209 justify-content: space-between;
3228 3210 }
3229 -.e-kit-library__index-layout-main.e-kit-library__connect-container {
3230 - justify-content: center;
3231 - align-items: center;
3232 -}
3233 -.e-kit-library__connect-button {
3234 - background-color: var(--e-a-btn-bg-primary);
3235 - color: var(--e-a-btn-color);
3236 - border-radius: 4px;
3237 - padding: 8px;
3238 -}
3239 -.e-kit-library__connect-button:hover {
3240 - opacity: 0.8;
3241 -}
3242 -.e-kit-library__upgrade-button {
3243 - background-color: var(--e-a-color-accent);
3244 - color: var(--e-a-color-txt-invert);
3245 - border-radius: 4px;
3246 - padding: 8px;
3247 -}
3248 -.e-kit-library__upgrade-button:hover {
3249 - opacity: 0.8;
3250 -}
3251 -.e-kit-library .eicon-library-cloud-connect,
3252 -.e-kit-library .eicon-library-subscription-upgrade {
3253 - font-size: 65px;
3254 -}
3255 -.e-kit-library .connect-badge {
3256 - color: #C00BB9;
3257 - margin-inline-start: 10px;
3258 -}
3259 -.e-kit-library .upgrade-badge {
3260 - color: #93003f;
3261 - border: 1px solid #93003f;
3262 - border-radius: 10px;
3263 - padding: 2px 6px;
3264 - margin-inline-start: 10px;
3265 -}
3266 3211
3267 3212 .e-kit-library__tags-filter {
3268 3213 --e-kit-library-item-sidebar-header-title-color: #515962;
3269 3214 --e-kit-library-item-sidebar-description-color: #515962;
@@ -3345,10 +3290,10 @@
3345 3290 }
3346 3291
3347 3292 .e-kit-library__preview-loader {
3348 3293 position: absolute;
3349 - inset-block-start: 0;
3350 - inset-inline-start: 0;
3294 + top: 0;
3295 + right: 0;
3351 3296 z-index: 0;
3352 3297 }
3353 3298 .e-kit-library__preview-iframe {
3354 3299 border: none;
@@ -3376,10 +3321,10 @@
3376 3321 align-items: center;
3377 3322 justify-content: center;
3378 3323 font-size: 0.875rem;
3379 3324 position: absolute;
3380 - inset-block-start: 50%;
3381 - inset-inline-end: var(--e-app-collapse-toggle-icon-spacing);
3325 + top: 50%;
3326 + left: var(--e-app-collapse-toggle-icon-spacing);
3382 3327 transform: translateY(-50%);
3383 3328 }
3384 3329 .e-app-collapse-toggle__icon:before {
3385 3330 transition: all 0.2s linear;
@@ -3394,10 +3339,10 @@
3394 3339 display: block;
3395 3340 }
3396 3341
3397 3342 [dir=rtl] .e-app-collapse-toggle__icon {
3398 - inset-inline-start: var(--e-app-collapse-toggle-icon-spacing);
3399 - inset-inline-end: initial;
3343 + left: initial;
3344 + right: var(--e-app-collapse-toggle-icon-spacing);
3400 3345 }
3401 3346
3402 3347 .eps-theme-dark .e-app-collapse {
3403 3348 --e-app-collapse-icon-color: #BABFC5;
@@ -3524,10 +3469,10 @@
3524 3469 font-size: 1.85rem;
3525 3470 }
3526 3471 .e-app-import-export-loader--absolute-center {
3527 3472 position: absolute;
3528 - inset-block-start: 50%;
3529 - inset-inline-start: 50%;
3473 + top: 50%;
3474 + right: 50%;
3530 3475 transform: translateX(-50%) translateY(-50%);
3531 3476 }
3532 3477
3533 3478 .eps-theme-dark .e-app-import-export-loader {
@@ -3567,152 +3512,498 @@
3567 3512 width: 100%;
3568 3513 justify-content: flex-end;
3569 3514 }
3570 3515
3571 -.e-kit-library__quota-bar {
3516 +.e-onboarding {
3517 + font-family: "DM Sans", "Roboto", sans-serif;
3518 + color-scheme: light;
3519 +}
3520 +.e-onboarding .eps-app__main {
3521 + justify-content: center;
3522 + overflow-y: auto;
3523 +}
3524 +.e-onboarding__content {
3525 + max-width: 1135px;
3526 + padding: 2.75rem;
3527 + margin: initial;
3528 + overflow-y: initial;
3529 +}
3530 +.e-onboarding__checkbox-label {
3572 3531 display: flex;
3532 + line-height: 18px;
3533 + margin-block-end: 27px;
3534 +}
3535 +.e-onboarding__checkbox-input {
3536 + margin-inline-end: 14px;
3537 + width: 16px;
3538 + height: 16px;
3539 + border-color: #69727D;
3540 + border-radius: 2px;
3541 +}
3542 +.e-onboarding__checkbox-input:checked {
3543 + background-color: #525861;
3544 +}
3545 +.e-onboarding__checkbox-input:checked::after {
3546 + margin-block-end: 15%;
3547 + width: 6px;
3548 + height: 9px;
3549 + border-width: 0 2px 2px 0;
3550 +}
3551 +.e-onboarding__feature-list {
3552 + margin-block-end: 40px;
3553 +}
3554 +.e-onboarding__text-input {
3555 + font-size: 14px;
3556 + width: 325px;
3557 + padding: 12px 16px;
3558 + color: #69727D;
3559 + border: 1px solid #9EA5AD;
3560 +}
3561 +.e-onboarding__text-input:focus-visible {
3562 + outline: initial;
3563 + border: 1px solid #3A3F45;
3564 +}
3565 +.e-onboarding__text-input::-moz-placeholder {
3566 + color: #C2C7CC;
3567 +}
3568 +.e-onboarding__text-input::placeholder {
3569 + color: #C2C7CC;
3570 +}
3571 +.e-onboarding__footnote {
3572 + margin-block-start: 24px;
3573 + width: 325px;
3574 + text-align: center;
3575 +}
3576 +.e-onboarding__footnote a {
3577 + text-decoration: underline;
3578 + color: #3A3F45;
3579 +}
3580 +
3581 +#e-app ~ #__wp-uploader-id-2 .media-modal {
3582 + max-width: 1024px;
3583 + max-height: 768px;
3584 + margin: auto;
3585 +}
3586 +
3587 +.e-onboarding__page-content {
3588 + margin-block-end: 70px;
3589 +}
3590 +.e-onboarding__page-content-start {
3591 + max-width: 675px;
3592 + text-align: start;
3593 + flex-basis: 555px;
3594 + align-self: start;
3595 +}
3596 +.e-onboarding__page-content-end {
3597 + min-width: 440px;
3598 + max-width: 540px;
3599 +}
3600 +.e-onboarding__page-content-end img {
3601 + width: 100%;
3602 +}
3603 +.e-onboarding__page-content-section-title {
3604 + font-family: "DM Serif Display", serif;
3605 + font-size: 36px;
3606 + font-weight: 700;
3607 + color: #0C0D0E;
3608 +}
3609 +.e-onboarding__page-content-section-text {
3610 + font-size: 18px;
3611 + color: #3A3F45;
3612 +}
3613 +
3614 +.e-onboarding__header-logo .eps-app__logo {
3615 + background-color: #0C0D0E;
3616 + color: #ffffff;
3617 + width: 1.3rem;
3618 + height: 1.3rem;
3619 + line-height: 1.3rem;
3620 + font-size: 0.48rem;
3621 +}
3622 +.e-onboarding__header-logo .eps-app__logo:not(:last-child) {
3623 + margin-inline-end: 7px;
3624 +}
3625 +.e-onboarding__header-logo img {
3626 + width: 104px;
3627 +}
3628 +.e-onboarding__header .eps-app__header-btn {
3629 + display: flex;
3573 3630 align-items: center;
3631 + font-size: 13px;
3574 3632 }
3575 -.e-kit-library__quota-bar__container {
3633 +.e-onboarding__header .eps-app__header-btn .eps-icon:not(:last-child) {
3634 + margin-inline-end: 7px;
3635 +}
3636 +.e-onboarding__header .eps-button {
3637 + color: #0C0D0E;
3638 +}
3639 +.e-onboarding__header .eps-button__go-pro-btn {
3640 + background-color: #93003f;
3641 + color: #ffffff;
3642 + padding: 4px 8px;
3643 + border-radius: 4px;
3644 + font-weight: 700;
3645 + font-size: 12px;
3646 + transition: 0.5s;
3647 +}
3648 +.e-onboarding__header .eps-button__go-pro-btn:hover {
3649 + background: rgb(198, 0, 84.8571428571);
3650 +}
3651 +
3652 +.e-onboarding__go-pro {
3653 + width: 288px;
3654 + font-size: 12px;
3655 + background-color: #ffffff;
3656 +}
3657 +.e-onboarding__go-pro-title {
3658 + font-size: 18px;
3659 + font-weight: 700;
3660 + color: #93003f;
3661 +}
3662 +.e-onboarding__go-pro-cta {
3663 + display: inline-block;
3664 + color: #93003f;
3665 + padding: 9px;
3666 + border: 1px solid #93003f;
3667 +}
3668 +.e-onboarding__go-pro-cta.e-onboarding__button {
3669 + font-size: 14px;
3670 +}
3671 +.e-onboarding__go-pro-paragraph:not(:last-child) {
3672 + margin-block-end: 20px;
3673 +}
3674 +.e-onboarding__go-pro-already-have {
3675 + text-decoration: underline;
3676 +}
3677 +
3678 +.e-onboarding__progress-bar {
3576 3679 display: flex;
3577 - flex-direction: column;
3578 - gap: 8px;
3579 - min-width: 230px;
3680 + justify-content: center;
3681 + margin-block-end: 125px;
3580 3682 }
3581 -.e-kit-library__quota-bar__header {
3683 +.e-onboarding__progress-bar-item {
3582 3684 display: flex;
3583 - justify-content: space-between;
3584 3685 align-items: center;
3686 + color: #69727D;
3687 + font-size: 0.75rem;
3585 3688 }
3586 -.e-kit-library__quota-bar__label {
3587 - color: var(--body-color);
3588 - font-weight: 400;
3589 - white-space: nowrap;
3590 - font-size: 12px;
3689 +.e-onboarding__progress-bar-item-icon {
3690 + display: inline-block;
3691 + font-family: "DM Serif Display", serif;
3692 + text-align: center;
3693 + width: 1.1rem;
3694 + height: 1.1rem;
3695 + line-height: 1rem;
3696 + font-size: 0.75rem;
3697 + font-weight: bold;
3698 + border-radius: 50%;
3699 + border: 1px solid #69727D;
3700 + margin-inline-end: 8px;
3701 + flex-shrink: 0;
3591 3702 }
3592 -.e-kit-library__quota-bar__progress-container {
3593 - width: 100%;
3594 - height: 4px;
3595 - overflow: hidden;
3596 - position: relative;
3703 +.e-onboarding__progress-bar-item:not(:last-child) {
3704 + margin-inline-end: 22px;
3597 3705 }
3598 -.e-kit-library__quota-bar__progress-container--empty {
3599 - background-color: #F0ABFC;
3706 +.e-onboarding__progress-bar-item:not(:last-child):after {
3707 + font-family: "eicons";
3708 + margin-inline-start: 22px;
3709 + content: "\e89e";
3600 3710 }
3601 -.e-kit-library__quota-bar__progress-container--normal {
3602 - background-color: #F0ABFC;
3711 +.e-onboarding__progress-bar-item--active {
3712 + color: #D004D4;
3603 3713 }
3604 -.e-kit-library__quota-bar__progress-container--warning {
3605 - background-color: rgb(251.0236220472, 216.4291338583, 157.9763779528);
3714 +.e-onboarding__progress-bar-item--active .e-onboarding__progress-bar-item-icon, .e-onboarding__progress-bar-item--completed .e-onboarding__progress-bar-item-icon {
3715 + color: #ffffff;
3716 + border-color: #D004D4;
3717 + background-color: #D004D4;
3606 3718 }
3607 -.e-kit-library__quota-bar__progress-container--alert {
3608 - background: #93003f;
3719 +.e-onboarding__progress-bar-item--skipped, .e-onboarding__progress-bar-item--completed {
3720 + cursor: pointer;
3609 3721 }
3610 -.e-kit-library__quota-bar__progress-bar {
3611 - height: 100%;
3612 - transition: width 0.3s ease;
3722 +.e-onboarding__progress-bar-item--skipped .e-onboarding__progress-bar-item-icon {
3723 + color: #ffffff;
3724 + background-color: #69727D;
3613 3725 }
3614 -.e-kit-library__quota-bar__progress-bar--empty {
3615 - background: transparent;
3726 +
3727 +.e-onboarding__button {
3728 + font-size: 18px;
3729 + cursor: pointer;
3730 + transition: var(--e-a-transition-hover);
3616 3731 }
3617 -.e-kit-library__quota-bar__progress-bar--normal {
3618 - background: #D004D4;
3732 +.e-onboarding__button-action {
3733 + color: var(--e-a-btn-color);
3734 + background-color: var(--e-a-btn-bg-primary);
3735 + min-width: 325px;
3736 + padding: 15px 30px;
3737 + text-align: center;
3619 3738 }
3620 -.e-kit-library__quota-bar__progress-bar--warning {
3621 - background: #F59E0B;
3739 +.e-onboarding__button-action:hover {
3740 + background-color: var(--e-a-btn-bg-primary-hover);
3622 3741 }
3623 -.e-kit-library__quota-bar__progress-bar--alert {
3624 - background: #93003f;
3742 +.e-onboarding__button-skip {
3743 + padding: 8px 16px;
3744 + color: #515962;
3625 3745 }
3626 -.e-kit-library__quota-bar__upgrade-message {
3746 +.e-onboarding__button-skip:hover {
3747 + background-color: #F9FAFA;
3748 +}
3749 +.e-onboarding__button-skip--disabled {
3750 + pointer-events: none;
3751 + cursor: none;
3752 + color: #D5D8DC;
3753 +}
3754 +.e-onboarding__button--disabled {
3755 + pointer-events: none;
3756 + background-color: #D5D8DC;
3757 + color: #9EA5AD;
3758 +}
3759 +.e-onboarding__button--disabled:hover {
3760 + cursor: progress;
3761 +}
3762 +.e-onboarding__button--processing {
3763 + pointer-events: none;
3764 + filter: brightness(90%);
3765 +}
3766 +
3767 +.e-onboarding__card {
3768 + border: 1px solid #3A3F45;
3769 + border-radius: 8px;
3770 + padding: 40px 40px;
3771 + cursor: pointer;
3772 + flex-grow: 1;
3627 3773 display: flex;
3774 + flex-direction: column;
3628 3775 align-items: center;
3629 - gap: 4px;
3630 3776 }
3631 -.e-kit-library__quota-bar__upgrade-link {
3632 - color: #93003f;
3633 - text-decoration: underline;
3634 - cursor: pointer;
3777 +.e-onboarding__card-image, .e-onboarding__card-text {
3778 + width: 345px;
3779 +}
3780 +.e-onboarding__card-image {
3781 + margin-block-end: 44px;
3782 +}
3783 +.e-onboarding__card-text {
3784 + font-size: 20px;
3785 + font-weight: 700;
3786 + text-align: center;
3787 + color: #0C0D0E;
3788 +}
3789 +.e-onboarding__card:hover {
3790 + box-shadow: 4px 4px 0 0 #000000;
3791 +}
3792 +.e-onboarding__card:active {
3793 + box-shadow: initial;
3794 +}
3795 +
3796 +.e-onboarding__checklist {
3797 + padding-inline-start: 0;
3798 +}
3799 +.e-onboarding__checklist-item {
3800 + display: flex;
3801 + align-items: center;
3635 3802 font-size: 12px;
3636 - font-weight: 400;
3803 + margin-block-end: 12px;
3637 3804 }
3638 -.e-kit-library__quota-bar__upgrade-link:hover {
3639 - opacity: 0.8;
3805 +.e-onboarding__checklist-item .eicon-check-circle {
3806 + margin-inline-end: 9px;
3807 + font-size: 16px;
3808 + font-weight: 600;
3640 3809 }
3641 -.e-kit-library__quota-bar__count {
3642 - color: var(--body-color);
3643 - white-space: nowrap;
3644 - font-size: 12px;
3810 +
3811 +.e-onboarding__notice {
3812 + display: inline-block;
3813 + padding: 12px 14px;
3814 + margin-block-end: 16px;
3815 + color: #3A3F45;
3645 3816 }
3817 +.e-onboarding__notice--error {
3818 + background-color: #FDE8EC;
3819 +}
3820 +.e-onboarding__notice--error i {
3821 + font-size: 16px;
3822 + color: #B92136;
3823 +}
3824 +.e-onboarding__notice--success {
3825 + background-color: #ECF9F2;
3826 +}
3827 +.e-onboarding__notice--success i {
3828 + color: #117740;
3829 +}
3830 +.e-onboarding__notice i {
3831 + margin-inline-end: 14px;
3832 +}
3833 +.e-onboarding__notice-empty-spacer {
3834 + height: 61px;
3835 +}
3646 3836
3647 -:root {
3648 - --text-secondary: #3F444B;
3837 +.e-onboarding__page-account .e-onboarding__checkbox-label {
3838 + margin-block-start: 50px;
3649 3839 }
3650 3840
3651 -.e-kit-library__quota-notification {
3841 +.e-onboarding__action-button-text {
3842 + margin-inline-start: 10px;
3843 +}
3844 +
3845 +.e-onboarding__site-name-input {
3846 + margin-block-start: 80px;
3847 +}
3848 +
3849 +.e-onboarding__page-siteLogo .e-app-upload-file__button {
3850 + color: var(--e-a-color-primary-bold);
3851 + border-color: var(--e-a-color-primary-bold);
3852 +}
3853 +.e-onboarding__page-siteLogo .e-app-upload-file__button:hover {
3854 + background-color: #FAE8FF;
3855 +}
3856 +.e-onboarding__drop-zone {
3857 + margin-block-start: 3rem;
3858 +}
3859 +.e-onboarding .eps-display-3 {
3860 + font-size: 16px;
3861 + margin-block-end: 0.5rem;
3862 +}
3863 +.e-onboarding .e-app-upload-file__button {
3864 + max-width: 198px;
3865 + margin: 0 auto;
3866 +}
3867 +.e-onboarding .e-app-drop-zone__secondary-text {
3868 + font-size: 14px;
3869 +}
3870 +.e-onboarding__logo-container {
3871 + position: relative;
3872 + margin-block-start: 3rem;
3873 + min-height: 120px;
3874 + width: -moz-fit-content;
3875 + width: fit-content;
3652 3876 display: flex;
3653 - align-items: flex-start;
3654 - justify-content: space-between;
3655 - padding: 16px 20px;
3656 - margin: 0 44px 30px;
3657 - border-radius: 4px;
3877 + align-items: center;
3878 + justify-content: center;
3879 + min-width: 220px;
3880 + border: 1px solid #BABFC5;
3658 3881 }
3659 -.e-kit-library__quota-notification--warning {
3660 - background-color: #FBF1E6;
3661 - color: #3f444b;
3882 +.e-onboarding__logo-container img {
3883 + height: auto;
3884 + max-height: 100%;
3885 + width: auto;
3662 3886 }
3663 -.e-kit-library__quota-notification--alert {
3664 - background-color: #FDECEC;
3665 - color: #3f444b;
3887 +.e-onboarding__logo-remove {
3888 + position: absolute;
3889 + left: 0;
3890 + top: 5px;
3666 3891 }
3667 -.e-kit-library__quota-notification__content {
3668 - display: flex;
3669 - align-items: flex-start;
3670 - gap: 12px;
3671 - flex: 1;
3892 +.e-onboarding__logo-remove i {
3893 + font-size: 16px;
3894 + width: 15px;
3672 3895 }
3673 -.e-kit-library__quota-notification__icon {
3674 - font-size: 18px;
3675 - margin-top: 1px;
3676 - flex-shrink: 0;
3896 +.e-onboarding__logo-remove:hover {
3897 + cursor: pointer;
3677 3898 }
3678 -.e-kit-library__quota-notification__icon.eicon-warning-full {
3679 - color: #F59E0B;
3899 +.e-onboarding__is-uploading {
3900 + visibility: hidden;
3680 3901 }
3681 -.e-kit-library__quota-notification__icon.eicon-alert {
3682 - color: #DC2626;
3902 +
3903 +.e-onboarding__cards-grid.e-onboarding__page-content {
3904 + margin-block-start: 48px;
3905 + margin-block-end: 48px;
3683 3906 }
3684 -.e-kit-library__quota-notification__message {
3685 - flex: 1;
3686 - line-height: 1.5;
3687 - font-size: 13px;
3907 +.e-onboarding__cards-grid .e-onboarding__card {
3908 + max-width: 555px;
3688 3909 }
3689 -.e-kit-library__quota-notification__message span {
3690 - color: var(--text-secondary);
3691 - font-size: 13px;
3910 +.e-onboarding__cards-grid .e-onboarding__card:not(:last-child) {
3911 + margin-inline-end: 20px;
3692 3912 }
3693 -.e-kit-library__quota-notification__action-link {
3694 - color: inherit;
3913 +.e-onboarding__page-goodToGo .e-onboarding__page-content-section-title,
3914 +.e-onboarding__page-goodToGo .e-onboarding__page-content-section-text {
3915 + text-align: center;
3916 +}
3917 +.e-onboarding__page-goodToGo .e-onboarding__cards-grid {
3918 + justify-content: center;
3919 + flex-wrap: nowrap;
3920 +}
3921 +.e-onboarding__page-goodToGo .e-onboarding__card {
3922 + max-width: 388px;
3923 +}
3924 +.e-onboarding__good-to-go-footer {
3925 + justify-content: end;
3926 +}
3927 +
3928 +.e-onboarding__upload-pro {
3929 + flex-direction: row;
3930 + justify-content: center;
3931 + font-family: "DM Sans", "Roboto", sans-serif;
3932 + text-align: center;
3933 +}
3934 +.e-onboarding__upload-pro .eps-app__content {
3935 + overflow-y: hidden;
3936 + max-width: 1113px;
3937 + padding: 30px;
3938 +}
3939 +.e-onboarding__upload-pro-drop-zone {
3940 + margin-block-end: 24px;
3941 +}
3942 +.e-onboarding__upload-pro-drop-zone h1 {
3943 + font-family: "Source Serif Pro", "Roboto", sans-serif;
3944 +}
3945 +.e-onboarding__upload-pro-drop-zone .e-app-drag-drop {
3946 + padding: 48px;
3947 +}
3948 +.e-onboarding__upload-pro-drop-zone .eps-display-3,
3949 +.e-onboarding__upload-pro-drop-zone .e-app-drop-zone__text,
3950 +.e-onboarding__upload-pro-drop-zone .e-app-drop-zone__secondary-text {
3951 + margin-block-end: 12px;
3952 +}
3953 +.e-onboarding__upload-pro-drop-zone .e-app-upload-file__button {
3954 + background-color: #040080;
3955 + color: #46F2B6;
3956 + padding: 14px 40px;
3957 + border-color: #040080;
3958 +}
3959 +.e-onboarding__upload-pro-get-file {
3960 + font-size: 12px;
3961 + margin-block-start: 24px;
3962 +}
3963 +.e-onboarding__upload-pro-get-file a {
3695 3964 text-decoration: underline;
3696 - font-size: 13px;
3965 +}
3966 +.e-onboarding__upload-pro .e-onboarding__notice {
3967 + margin-block-end: 0;
3968 +}
3969 +
3970 +.e-onboarding__choose-features-section {
3971 + width: 100%;
3972 + display: flex;
3973 + flex-wrap: wrap;
3974 + gap: 10px 20px;
3975 + margin-block: 20px;
3976 +}
3977 +.e-onboarding__choose-features-section__label {
3978 + display: flex;
3979 + align-items: center;
3980 + font-size: 14px;
3697 3981 font-weight: 400;
3982 + line-height: 24px;
3983 + letter-spacing: -0.01em;
3984 + -webkit-user-select: none;
3985 + -moz-user-select: none;
3986 + user-select: none;
3987 + border: 1px solid #D5D8DC;
3988 + padding: 12px 16px;
3989 + width: 267px;
3698 3990 }
3699 -.e-kit-library__quota-notification__action-link:hover {
3700 - opacity: 0.8;
3991 +.e-onboarding__choose-features-section__checkbox {
3992 + justify-self: end;
3993 + margin-inline-end: 8px;
3994 + width: 16px;
3995 + height: 16px;
3701 3996 }
3702 -.e-kit-library__quota-notification__dismiss {
3703 - background: none;
3704 - border: none;
3705 - cursor: pointer;
3706 - padding: 0;
3707 - margin-inline-start: 12px;
3708 - color: inherit;
3709 - opacity: 0.7;
3710 - flex-shrink: 0;
3997 +.e-onboarding__choose-features-section__message {
3998 + font-size: 18px;
3999 + font-weight: 400;
4000 + line-height: 27px;
4001 + letter-spacing: -0.01em;
4002 + padding-inline-end: 120px;
4003 + min-height: 55px;
4004 + margin-block-end: 20px;
3711 4005 }
3712 -.e-kit-library__quota-notification__dismiss:hover {
3713 - opacity: 1;
3714 -}
3715 -.e-kit-library__quota-notification__dismiss i {
3716 - font-size: 14px;
4006 +.e-onboarding__page-chooseFeatures .e-onboarding__page-content {
4007 + margin-bottom: 0;
3717 4008 }
3718 4009 /*# sourceMappingURL=app-rtl.css.map */