← All changes | assets/css/app.css +156 -155 4.3.4 → 3.34.0-beta1 View file →

		@@ -491,9 +491,9 @@
491	491	button {
492	492	border-radius: 0;
493	493	}
494	494
495		-button:focus:not(:where([data-module=onboarding] *)) {
	495	+button:focus {
496	496	outline: 1px dotted;
497	497	outline: 5px auto -webkit-focus-ring-color;
498	498	}
499	499
		@@ -796,11 +796,12 @@
796	796	width: 1.75rem;
797	797	height: 1.75rem;
798	798	line-height: 1.75rem;
799	799	text-align: center;
800		- font-size: 1.75rem;
	800	+ font-size: calc(0.4 * 1.75rem);
801	801	border-radius: 50%;
802		- color: var(--app-logo-background-color);
	802	+ color: var(--app-logo-color);
	803	+ background-color: var(--app-logo-background-color);
803	804	}
804	805	.eps-app__logo:not(:last-child) {
805	806	margin-inline-end: 0.625rem;
806	807	}
		@@ -3569,156 +3570,8 @@
3569	3570	width: 100%;
3570	3571	justify-content: flex-end;
3571	3572	}
3572	3573
3573		-.e-kit-library__quota-bar {
3574		- display: flex;
3575		- align-items: center;
3576		-}
3577		-.e-kit-library__quota-bar__container {
3578		- display: flex;
3579		- flex-direction: column;
3580		- gap: 8px;
3581		- min-width: 230px;
3582		-}
3583		-.e-kit-library__quota-bar__header {
3584		- display: flex;
3585		- justify-content: space-between;
3586		- align-items: center;
3587		-}
3588		-.e-kit-library__quota-bar__label {
3589		- color: var(--body-color);
3590		- font-weight: 400;
3591		- white-space: nowrap;
3592		- font-size: 12px;
3593		-}
3594		-.e-kit-library__quota-bar__progress-container {
3595		- width: 100%;
3596		- height: 4px;
3597		- overflow: hidden;
3598		- position: relative;
3599		-}
3600		-.e-kit-library__quota-bar__progress-container--empty {
3601		- background-color: #F0ABFC;
3602		-}
3603		-.e-kit-library__quota-bar__progress-container--normal {
3604		- background-color: #F0ABFC;
3605		-}
3606		-.e-kit-library__quota-bar__progress-container--warning {
3607		- background-color: rgb(251.0236220472, 216.4291338583, 157.9763779528);
3608		-}
3609		-.e-kit-library__quota-bar__progress-container--alert {
3610		- background: #93003f;
3611		-}
3612		-.e-kit-library__quota-bar__progress-bar {
3613		- height: 100%;
3614		- transition: width 0.3s ease;
3615		-}
3616		-.e-kit-library__quota-bar__progress-bar--empty {
3617		- background: transparent;
3618		-}
3619		-.e-kit-library__quota-bar__progress-bar--normal {
3620		- background: #D004D4;
3621		-}
3622		-.e-kit-library__quota-bar__progress-bar--warning {
3623		- background: #F59E0B;
3624		-}
3625		-.e-kit-library__quota-bar__progress-bar--alert {
3626		- background: #93003f;
3627		-}
3628		-.e-kit-library__quota-bar__upgrade-message {
3629		- display: flex;
3630		- align-items: center;
3631		- gap: 4px;
3632		-}
3633		-.e-kit-library__quota-bar__upgrade-link {
3634		- color: #93003f;
3635		- text-decoration: underline;
3636		- cursor: pointer;
3637		- font-size: 12px;
3638		- font-weight: 400;
3639		-}
3640		-.e-kit-library__quota-bar__upgrade-link:hover {
3641		- opacity: 0.8;
3642		-}
3643		-.e-kit-library__quota-bar__count {
3644		- color: var(--body-color);
3645		- white-space: nowrap;
3646		- font-size: 12px;
3647		-}
3648		-
3649		-:root {
3650		- --text-secondary: #3F444B;
3651		-}
3652		-
3653		-.e-kit-library__quota-notification {
3654		- display: flex;
3655		- align-items: flex-start;
3656		- justify-content: space-between;
3657		- padding: 16px 20px;
3658		- margin: 0 44px 30px;
3659		- border-radius: 4px;
3660		-}
3661		-.e-kit-library__quota-notification--warning {
3662		- background-color: #FBF1E6;
3663		- color: #3f444b;
3664		-}
3665		-.e-kit-library__quota-notification--alert {
3666		- background-color: #FDECEC;
3667		- color: #3f444b;
3668		-}
3669		-.e-kit-library__quota-notification__content {
3670		- display: flex;
3671		- align-items: flex-start;
3672		- gap: 12px;
3673		- flex: 1;
3674		-}
3675		-.e-kit-library__quota-notification__icon {
3676		- font-size: 18px;
3677		- margin-top: 1px;
3678		- flex-shrink: 0;
3679		-}
3680		-.e-kit-library__quota-notification__icon.eicon-warning-full {
3681		- color: #F59E0B;
3682		-}
3683		-.e-kit-library__quota-notification__icon.eicon-alert {
3684		- color: #DC2626;
3685		-}
3686		-.e-kit-library__quota-notification__message {
3687		- flex: 1;
3688		- line-height: 1.5;
3689		- font-size: 13px;
3690		-}
3691		-.e-kit-library__quota-notification__message span {
3692		- color: var(--text-secondary);
3693		- font-size: 13px;
3694		-}
3695		-.e-kit-library__quota-notification__action-link {
3696		- color: inherit;
3697		- text-decoration: underline;
3698		- font-size: 13px;
3699		- font-weight: 400;
3700		-}
3701		-.e-kit-library__quota-notification__action-link:hover {
3702		- opacity: 0.8;
3703		-}
3704		-.e-kit-library__quota-notification__dismiss {
3705		- background: none;
3706		- border: none;
3707		- cursor: pointer;
3708		- padding: 0;
3709		- margin-inline-start: 12px;
3710		- color: inherit;
3711		- opacity: 0.7;
3712		- flex-shrink: 0;
3713		-}
3714		-.e-kit-library__quota-notification__dismiss:hover {
3715		- opacity: 1;
3716		-}
3717		-.e-kit-library__quota-notification__dismiss i {
3718		- font-size: 14px;
3719		-}
3720		-
3721	3574	.e-onboarding {
3722	3575	font-family: "DM Sans", "Roboto", sans-serif;
3723	3576	color-scheme: light;
3724	3577	}
		@@ -3833,14 +3686,14 @@
3833	3686	font-size: 14px;
3834	3687	}
3835	3688	}
3836	3689	.e-onboarding__header-logo .eps-app__logo {
3837		- color: #0C0D0E;
	3690	+ background-color: #0C0D0E;
	3691	+ color: #ffffff;
3838	3692	width: 1.3rem;
3839	3693	height: 1.3rem;
3840		- line-height: 1.4rem;
3841		- font-size: 1.3rem;
3842		- background: unset;
	3694	+ line-height: 1.3rem;
	3695	+ font-size: 0.48rem;
3843	3696	}
3844	3697	.e-onboarding__header-logo .eps-app__logo:not(:last-child) {
3845	3698	margin-inline-end: 7px;
3846	3699	}
		@@ -4491,8 +4344,156 @@
4491	4344	margin-block-end: 20px;
4492	4345	}
4493	4346	.e-onboarding__page-chooseFeatures .e-onboarding__page-content {
4494	4347	margin-block-end: 0;
	4348	+}
	4349	+
	4350	+.e-kit-library__quota-bar {
	4351	+ display: flex;
	4352	+ align-items: center;
	4353	+}
	4354	+.e-kit-library__quota-bar__container {
	4355	+ display: flex;
	4356	+ flex-direction: column;
	4357	+ gap: 8px;
	4358	+ min-width: 230px;
	4359	+}
	4360	+.e-kit-library__quota-bar__header {
	4361	+ display: flex;
	4362	+ justify-content: space-between;
	4363	+ align-items: center;
	4364	+}
	4365	+.e-kit-library__quota-bar__label {
	4366	+ color: var(--body-color);
	4367	+ font-weight: 400;
	4368	+ white-space: nowrap;
	4369	+ font-size: 12px;
	4370	+}
	4371	+.e-kit-library__quota-bar__progress-container {
	4372	+ width: 100%;
	4373	+ height: 4px;
	4374	+ overflow: hidden;
	4375	+ position: relative;
	4376	+}
	4377	+.e-kit-library__quota-bar__progress-container--empty {
	4378	+ background-color: #F0ABFC;
	4379	+}
	4380	+.e-kit-library__quota-bar__progress-container--normal {
	4381	+ background-color: #F0ABFC;
	4382	+}
	4383	+.e-kit-library__quota-bar__progress-container--warning {
	4384	+ background-color: rgb(251.0236220472, 216.4291338583, 157.9763779528);
	4385	+}
	4386	+.e-kit-library__quota-bar__progress-container--alert {
	4387	+ background: #93003f;
	4388	+}
	4389	+.e-kit-library__quota-bar__progress-bar {
	4390	+ height: 100%;
	4391	+ transition: width 0.3s ease;
	4392	+}
	4393	+.e-kit-library__quota-bar__progress-bar--empty {
	4394	+ background: transparent;
	4395	+}
	4396	+.e-kit-library__quota-bar__progress-bar--normal {
	4397	+ background: #D004D4;
	4398	+}
	4399	+.e-kit-library__quota-bar__progress-bar--warning {
	4400	+ background: #F59E0B;
	4401	+}
	4402	+.e-kit-library__quota-bar__progress-bar--alert {
	4403	+ background: #93003f;
	4404	+}
	4405	+.e-kit-library__quota-bar__upgrade-message {
	4406	+ display: flex;
	4407	+ align-items: center;
	4408	+ gap: 4px;
	4409	+}
	4410	+.e-kit-library__quota-bar__upgrade-link {
	4411	+ color: #93003f;
	4412	+ text-decoration: underline;
	4413	+ cursor: pointer;
	4414	+ font-size: 12px;
	4415	+ font-weight: 400;
	4416	+}
	4417	+.e-kit-library__quota-bar__upgrade-link:hover {
	4418	+ opacity: 0.8;
	4419	+}
	4420	+.e-kit-library__quota-bar__count {
	4421	+ color: var(--body-color);
	4422	+ white-space: nowrap;
	4423	+ font-size: 12px;
	4424	+}
	4425	+
	4426	+:root {
	4427	+ --text-secondary: #3F444B;
	4428	+}
	4429	+
	4430	+.e-kit-library__quota-notification {
	4431	+ display: flex;
	4432	+ align-items: flex-start;
	4433	+ justify-content: space-between;
	4434	+ padding: 16px 20px;
	4435	+ margin: 0 44px 30px;
	4436	+ border-radius: 4px;
	4437	+}
	4438	+.e-kit-library__quota-notification--warning {
	4439	+ background-color: #FBF1E6;
	4440	+ color: #3f444b;
	4441	+}
	4442	+.e-kit-library__quota-notification--alert {
	4443	+ background-color: #FDECEC;
	4444	+ color: #3f444b;
	4445	+}
	4446	+.e-kit-library__quota-notification__content {
	4447	+ display: flex;
	4448	+ align-items: flex-start;
	4449	+ gap: 12px;
	4450	+ flex: 1;
	4451	+}
	4452	+.e-kit-library__quota-notification__icon {
	4453	+ font-size: 18px;
	4454	+ margin-top: 1px;
	4455	+ flex-shrink: 0;
	4456	+}
	4457	+.e-kit-library__quota-notification__icon.eicon-warning-full {
	4458	+ color: #F59E0B;
	4459	+}
	4460	+.e-kit-library__quota-notification__icon.eicon-alert {
	4461	+ color: #DC2626;
	4462	+}
	4463	+.e-kit-library__quota-notification__message {
	4464	+ flex: 1;
	4465	+ line-height: 1.5;
	4466	+ font-size: 13px;
	4467	+}
	4468	+.e-kit-library__quota-notification__message span {
	4469	+ color: var(--text-secondary);
	4470	+ font-size: 13px;
	4471	+}
	4472	+.e-kit-library__quota-notification__action-link {
	4473	+ color: inherit;
	4474	+ text-decoration: underline;
	4475	+ font-size: 13px;
	4476	+ font-weight: 400;
	4477	+}
	4478	+.e-kit-library__quota-notification__action-link:hover {
	4479	+ opacity: 0.8;
	4480	+}
	4481	+.e-kit-library__quota-notification__dismiss {
	4482	+ background: none;
	4483	+ border: none;
	4484	+ cursor: pointer;
	4485	+ padding: 0;
	4486	+ margin-inline-start: 12px;
	4487	+ color: inherit;
	4488	+ opacity: 0.7;
	4489	+ flex-shrink: 0;
	4490	+}
	4491	+.e-kit-library__quota-notification__dismiss:hover {
	4492	+ opacity: 1;
	4493	+}
	4494	+.e-kit-library__quota-notification__dismiss i {
	4495	+ font-size: 14px;
4495	4496	}
4496	4497
4497	4498	.e-onboarding101-variant-b .e-app__footer,
4498	4499	.e-onboarding101-variant-b .e-onboarding__steps,