Color cleanup 8 (#7108)
* $accent-color -> $accent Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $accent-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * $notice-primary-color -> $alert Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $notice-primary-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $accent-50pct Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * $warning-color -> $alert Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $accent-darker Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $orange-warning-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $warning-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $info-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
Šimon Brandner
GitHub
parent
5ad3261cb2
commit
9abb2f5ff4
111 changed files with 271 additions and 306 deletions
|
|
@ -310,7 +310,7 @@ $MinWidth: 240px;
|
|||
|
||||
.mx_AppPermissionWarning_helpIcon::before {
|
||||
display: inline-block;
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 12px;
|
||||
width: 12px;
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ limitations under the License.
|
|||
|
||||
.mx_E2EIcon_warning::after {
|
||||
mask-image: url('$(res)/img/e2e/warning.svg');
|
||||
background-color: $notice-primary-color;
|
||||
background-color: $alert;
|
||||
}
|
||||
|
||||
.mx_E2EIcon_normal::after {
|
||||
|
|
@ -75,5 +75,5 @@ limitations under the License.
|
|||
|
||||
.mx_E2EIcon_verified::after {
|
||||
mask-image: url('$(res)/img/e2e/verified.svg');
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ limitations under the License.
|
|||
padding: 3px 6px;
|
||||
|
||||
&:focus {
|
||||
border-color: $accent-color-50pct;
|
||||
border-color: rgba($accent, 0.5); // Only ever used here
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ limitations under the License.
|
|||
background-color: $event-highlight-bg-color;
|
||||
}
|
||||
|
||||
color: $warning-color;
|
||||
color: $alert;
|
||||
}
|
||||
|
||||
/* For replies */
|
||||
|
|
|
|||
|
|
@ -121,14 +121,14 @@ $left-gutter: 64px;
|
|||
* TODO: ultimately we probably want some transition on here.
|
||||
*/
|
||||
&.mx_EventTile_selected > .mx_EventTile_line {
|
||||
border-left: $accent-color $selected-message-border-width solid;
|
||||
border-left: $accent $selected-message-border-width solid;
|
||||
padding-left: calc($left-gutter - $selected-message-border-width);
|
||||
background-color: $event-selected-color;
|
||||
}
|
||||
|
||||
&.mx_EventTile_highlight,
|
||||
&.mx_EventTile_highlight .markdown-body {
|
||||
color: $warning-color;
|
||||
color: $alert;
|
||||
|
||||
.mx_EventTile_line {
|
||||
background-color: $event-highlight-bg-color;
|
||||
|
|
@ -146,7 +146,7 @@ $left-gutter: 64px;
|
|||
}
|
||||
|
||||
.mx_EventTile_searchHighlight {
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
color: $accent-fg-color;
|
||||
border-radius: 5px;
|
||||
padding-left: 2px;
|
||||
|
|
@ -155,7 +155,7 @@ $left-gutter: 64px;
|
|||
}
|
||||
|
||||
.mx_EventTile_searchHighlight a {
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
color: $accent-fg-color;
|
||||
}
|
||||
|
||||
|
|
@ -435,7 +435,7 @@ $left-gutter: 64px;
|
|||
.mx_EventTile_e2eIcon_warning {
|
||||
&::after {
|
||||
mask-image: url('$(res)/img/e2e/warning.svg');
|
||||
background-color: $notice-primary-color;
|
||||
background-color: $alert;
|
||||
}
|
||||
opacity: 1;
|
||||
}
|
||||
|
|
@ -582,7 +582,7 @@ $left-gutter: 64px;
|
|||
}
|
||||
|
||||
.mx_EventTile_content .markdown-body a {
|
||||
color: $accent-color-alt;
|
||||
color: $accent-alt;
|
||||
}
|
||||
|
||||
.mx_EventTile_content .markdown-body blockquote {
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ limitations under the License.
|
|||
|
||||
.mx_JumpToBottomButton_highlight .mx_JumpToBottomButton_badge {
|
||||
color: $secondary-accent-color;
|
||||
background-color: $warning-color;
|
||||
background-color: $alert;
|
||||
}
|
||||
|
||||
.mx_JumpToBottomButton_scrollDown {
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
> .mx_AccessibleButton {
|
||||
color: $accent-color;
|
||||
color: $accent;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ limitations under the License.
|
|||
.mx_MemberList_invite {
|
||||
flex: 0 0 auto;
|
||||
position: relative;
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
border-radius: 4px;
|
||||
margin: 5px 9px 9px;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -170,18 +170,18 @@ limitations under the License.
|
|||
/* hack for FF as vertical alignment of custom placeholder text is broken */
|
||||
.mx_MessageComposer_input textarea::-moz-placeholder {
|
||||
line-height: 100%;
|
||||
color: $accent-color;
|
||||
color: $accent;
|
||||
opacity: 1.0;
|
||||
}
|
||||
.mx_MessageComposer_input textarea::-webkit-input-placeholder {
|
||||
color: $accent-color;
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
.mx_MessageComposer_button_highlight {
|
||||
background: rgba($accent-color, 0.25);
|
||||
background: rgba($accent, 0.25);
|
||||
// make the icon the accent color too
|
||||
&::before {
|
||||
background-color: $accent-color !important;
|
||||
background-color: $accent !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -234,16 +234,16 @@ limitations under the License.
|
|||
&:hover,
|
||||
&.mx_MessageComposer_closeButtonMenu {
|
||||
&::after {
|
||||
background: rgba($accent-color, 0.1);
|
||||
background: rgba($accent, 0.1);
|
||||
}
|
||||
|
||||
&::before {
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
&.mx_MessageComposer_hangup:not(.mx_AccessibleButton_disabled)::before {
|
||||
background-color: $warning-color;
|
||||
background-color: $alert;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -282,7 +282,7 @@ limitations under the License.
|
|||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 100%;
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ limitations under the License.
|
|||
|
||||
&.mx_NotificationBadge_highlighted {
|
||||
// TODO: Use a more specific variable
|
||||
background-color: $warning-color;
|
||||
background-color: $alert;
|
||||
}
|
||||
|
||||
// These are the 3 background types
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomHeader_textButton_danger {
|
||||
background-color: $warning-color;
|
||||
background-color: $alert;
|
||||
}
|
||||
|
||||
.mx_RoomHeader_cancelButton {
|
||||
|
|
@ -145,7 +145,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomHeader_name:hover div:not(.mx_RoomHeader_editable) {
|
||||
color: $accent-color;
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
.mx_RoomHeader_placeholder {
|
||||
|
|
@ -159,7 +159,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomHeader_editable:focus {
|
||||
border-bottom: 1px solid $accent-color !important;
|
||||
border-bottom: 1px solid $accent !important;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
|
@ -228,10 +228,10 @@ limitations under the License.
|
|||
}
|
||||
|
||||
&:hover {
|
||||
background: rgba($accent-color, 0.1);
|
||||
background: rgba($accent, 0.1);
|
||||
|
||||
&::before {
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -245,7 +245,7 @@ limitations under the License.
|
|||
mask-image: url('$(res)/img/element-icons/room/apps.svg');
|
||||
}
|
||||
.mx_RoomHeader_appsButton_highlight::before {
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
}
|
||||
|
||||
.mx_RoomHeader_searchButton::before {
|
||||
|
|
|
|||
|
|
@ -34,16 +34,16 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomUpgradeWarningBar_header {
|
||||
color: $warning-color;
|
||||
color: $alert;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.mx_RoomUpgradeWarningBar_body {
|
||||
color: $warning-color;
|
||||
color: $alert;
|
||||
}
|
||||
|
||||
.mx_RoomUpgradeWarningBar_upgradelink {
|
||||
color: $warning-color;
|
||||
color: $alert;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ limitations under the License.
|
|||
cursor: pointer;
|
||||
width: 37px;
|
||||
height: 37px;
|
||||
background-color: $accent-color;
|
||||
background-color: $accent;
|
||||
mask: url('$(res)/img/feather-customised/search-input.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
|
|
@ -48,7 +48,7 @@ limitations under the License.
|
|||
font-size: $font-15px;
|
||||
cursor: pointer;
|
||||
color: $primary-content;
|
||||
border-bottom: 2px solid $accent-color;
|
||||
border-bottom: 2px solid $accent;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
|
@ -58,7 +58,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_SearchBar_cancel {
|
||||
background-color: $warning-color;
|
||||
background-color: $alert;
|
||||
mask: url('$(res)/img/cancel.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@
|
|||
.mx_Stickers_addLink {
|
||||
display: inline;
|
||||
cursor: pointer;
|
||||
color: $accent-color;
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
.mx_Stickers_hideStickers {
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@ limitations under the License.
|
|||
height: 4px;
|
||||
border-radius: 16px;
|
||||
background-color: $secondary-accent-color;
|
||||
border: 6px solid $accent-color;
|
||||
border: 6px solid $accent;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue