← All changes
|
assets/css/modules/announcements/announcements.css
+29
-50
4.3.3
→
3.13.0-beta1
View file →
| @@ -1,19 +1,20 @@ | ||
| 1 | 1 | #e-announcements-root { |
| 2 | 2 | position: fixed; |
| 3 | 3 | display: flex; |
| 4 | - inset: 0; | |
| 4 | + top: 0; | |
| 5 | + left: 0; | |
| 6 | + width: 100%; | |
| 7 | + height: 100%; | |
| 5 | 8 | align-items: center; |
| 6 | 9 | justify-content: center; |
| 7 | - color: var(--e-a-color-txt); | |
| 10 | + color: #3A3F45; | |
| 8 | 11 | font-family: Roboto, Arial, Helvetica, sans-serif; |
| 9 | 12 | z-index: 9998; |
| 10 | 13 | } |
| 11 | 14 | #e-announcements-root .announcements-container { |
| 12 | - width: 640px; | |
| 13 | - max-width: 100%; | |
| 14 | - background-color: var(--e-a-bg-default); | |
| 15 | - border-radius: var(--e-a-border-radius); | |
| 15 | + width: 637px; | |
| 16 | + background-color: #ffffff; | |
| 16 | 17 | z-index: 9998; |
| 17 | 18 | } |
| 18 | 19 | #e-announcements-root .announcements-container .announcements-heading-container { |
| 19 | 20 | display: flex; |
| @@ -18,13 +19,13 @@ | ||
| 18 | 19 | #e-announcements-root .announcements-container .announcements-heading-container { |
| 19 | 20 | display: flex; |
| 20 | 21 | align-items: center; |
| 21 | 22 | padding: 16px 32px; |
| 22 | - border-block-end: var(--e-a-border); | |
| 23 | + border-bottom: 1px solid #D5D8DC; | |
| 23 | 24 | } |
| 24 | 25 | #e-announcements-root .announcements-container .announcements-heading-container .eicon-elementor { |
| 25 | - color: var(--e-a-color-logo); | |
| 26 | - background-color: var(--e-a-bg-logo); | |
| 26 | + color: #ffffff; | |
| 27 | + background-color: #0C0D0E; | |
| 27 | 28 | border-radius: 50%; |
| 28 | 29 | padding: 8px; |
| 29 | 30 | } |
| 30 | 31 | #e-announcements-root .announcements-container .announcements-heading-container .heading-title { |
| @@ -29,10 +30,9 @@ | ||
| 29 | 30 | } |
| 30 | 31 | #e-announcements-root .announcements-container .announcements-heading-container .heading-title { |
| 31 | 32 | margin-inline-start: 12px; |
| 32 | 33 | text-transform: uppercase; |
| 33 | - font-weight: 700; | |
| 34 | - color: var(--e-a-color-txt-active); | |
| 34 | + font-size: 13px; | |
| 35 | 35 | } |
| 36 | 36 | #e-announcements-root .announcements-container .announcements-heading-container .close-button { |
| 37 | 37 | margin-inline-start: auto; |
| 38 | 38 | background: none; |
| @@ -42,11 +42,8 @@ | ||
| 42 | 42 | font: inherit; |
| 43 | 43 | cursor: pointer; |
| 44 | 44 | outline: inherit; |
| 45 | 45 | } |
| 46 | -#e-announcements-root .announcements-container .announcements-heading-container .close-button:hover { | |
| 47 | - color: var(--e-a-color-txt-hover); | |
| 48 | -} | |
| 49 | 46 | #e-announcements-root .announcements-container .announcement-body-container .announcement-body-media img { |
| 50 | 47 | width: 100%; |
| 51 | 48 | max-height: 360px; |
| 52 | 49 | object-fit: contain; |
| @@ -51,33 +48,22 @@ | ||
| 51 | 48 | max-height: 360px; |
| 52 | 49 | object-fit: contain; |
| 53 | 50 | } |
| 54 | 51 | #e-announcements-root .announcements-container .announcement-body-container .announcement-body-content { |
| 55 | - padding: 30px; | |
| 52 | + padding: 32px; | |
| 56 | 53 | } |
| 57 | 54 | #e-announcements-root .announcements-container .announcement-body-container .announcement-body-content .announcement-body-title { |
| 58 | 55 | font-size: 18px; |
| 59 | 56 | font-weight: 700; |
| 60 | - color: var(--e-a-color-txt-accent); | |
| 61 | - padding-block-end: 15px; | |
| 57 | + color: #0C0D0E; | |
| 58 | + padding: 20px 0 12px; | |
| 62 | 59 | } |
| 63 | 60 | #e-announcements-root .announcements-container .announcement-body-container .announcement-body-content .announcement-body-description { |
| 64 | 61 | font-size: 16px; |
| 65 | 62 | line-height: 24px; |
| 66 | 63 | font-weight: 400; |
| 67 | - color: var(--e-a-color-txt); | |
| 64 | + color: #515962; | |
| 68 | 65 | } |
| 69 | -#e-announcements-root .announcements-container .announcement-body-container .announcement-body-content p { | |
| 70 | - margin-block-end: 15px; | |
| 71 | -} | |
| 72 | -#e-announcements-root .announcements-container .announcement-body-container .announcement-body-content ul { | |
| 73 | - margin-inline-start: 20px; | |
| 74 | - margin-block-end: 15px; | |
| 75 | -} | |
| 76 | -#e-announcements-root .announcements-container .announcement-body-container .announcement-body-content li { | |
| 77 | - list-style: disc; | |
| 78 | - margin-block-end: 5px; | |
| 79 | -} | |
| 80 | 66 | #e-announcements-root .announcements-container .announcement-footer-container { |
| 81 | 67 | display: flex; |
| 82 | 68 | flex-direction: row-reverse; |
| 83 | 69 | padding: 12px 32px 32px; |
| @@ -83,34 +69,27 @@ | ||
| 83 | 69 | padding: 12px 32px 32px; |
| 84 | 70 | } |
| 85 | 71 | #e-announcements-root .announcements-container .announcement-footer-container .button-item { |
| 86 | 72 | margin-inline-start: 12px; |
| 87 | - padding: 8px 16px; | |
| 88 | - outline: none; | |
| 89 | - border: none; | |
| 90 | - border-radius: var(--e-a-border-radius); | |
| 91 | - transition: var(--e-a-transition-hover); | |
| 92 | - background: transparent; | |
| 93 | - color: var(--e-a-color-txt); | |
| 94 | - cursor: pointer; | |
| 73 | + padding: 12px; | |
| 74 | + color: #524CFF; | |
| 75 | + font-size: 18px; | |
| 76 | + font-weight: 500; | |
| 77 | + border-radius: 3px; | |
| 78 | + padding: 12px 16px; | |
| 79 | + text-decoration: none; | |
| 80 | + font-family: Roboto, Arial, Helvetica, sans-serif; | |
| 95 | 81 | } |
| 96 | -#e-announcements-root .announcements-container .announcement-footer-container .button-item:hover { | |
| 97 | - background: var(--e-a-bg-hover); | |
| 98 | - color: var(--e-a-color-txt-hover); | |
| 99 | -} | |
| 100 | -#e-announcements-root .announcements-container .announcement-footer-container .button-item:disabled { | |
| 101 | - background: transparent; | |
| 102 | - color: var(--e-a-color-txt-disabled); | |
| 103 | -} | |
| 104 | 82 | #e-announcements-root .announcements-container .announcement-footer-container .button-item.primary { |
| 105 | - background-color: var(--e-a-btn-bg-accent); | |
| 106 | - color: var(--e-a-btn-color-invert); | |
| 83 | + color: #ffffff; | |
| 84 | + background-color: #524CFF; | |
| 85 | + border: 1px solid #524CFF; | |
| 107 | 86 | } |
| 108 | 87 | #e-announcements-root .announcements-container .announcement-footer-container .button-item.primary:hover { |
| 109 | - background-color: var(--e-a-btn-bg-accent-hover); | |
| 88 | + background-color: #4C43E5; | |
| 110 | 89 | } |
| 111 | -#e-announcements-root .announcements-container .announcement-footer-container .button-item.primary:active { | |
| 112 | - background-color: var(--e-a-btn-bg-accent-active); | |
| 90 | +#e-announcements-root .announcements-container .announcement-footer-container .button-item.secondary { | |
| 91 | + border: 1px solid #524CFF; | |
| 113 | 92 | } |
| 114 | 93 | #e-announcements-root .announcements-screen-overlay { |
| 115 | 94 | position: fixed; |
| 116 | 95 | width: 100%; |