OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Manually fix remaining stylelint issues

pull/21833/head
J. Ryan Stinnett 2019-07-10 16:55:03 +01:00
parent 6c9bf25199
commit 38d6953bf6
24 changed files with 210 additions and 239 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
res/css/_common.scss
View File

@ -104,17 +104,17 @@ input[type=text], input[type=password], textarea {
color: $primary-fg-color;
}
input[type=text]:focus, input[type=password]:focus, textarea:focus {
outline: none;
box-shadow: none;
}
/* Required by Firefox */
textarea {
font-family: $font-family;
color: $primary-fg-color;
}
input[type=text]:focus, input[type=password]:focus, textarea:focus {
outline: none;
box-shadow: none;
}
// This is used to hide the standard outline added by browsers for
// accessible (focusable) components. Not intended for buttons, but
// should be used on things like focusable containers where the outline
@ -129,6 +129,13 @@ textarea {
// appear to be part of the input
.mx_Dialog, .mx_MatrixChat {
.mx_textinput > input[type=text],
.mx_textinput > input[type=search] {
border: none;
flex: 1;
color: $primary-fg-color;
}
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text],
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search],
.mx_textinput {
@ -147,13 +154,6 @@ textarea {
.mx_textinput {
display: flex;
align-items: center;
> input[type=text],
> input[type=search] {
border: none;
flex: 1;
color: $primary-fg-color;
}
}
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text]::placeholder,
@ -166,9 +166,7 @@ textarea {
/*** panels ***/
.dark-panel {
background-color: $dark-panel-bg-color;
}
.dark-panel {
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text],
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search],
.mx_textinput {
@ -271,14 +269,6 @@ textarea {
justify-content: center;
}
/* Spinner Dialog overide */
.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog {
width: auto;
border-radius: 8px;
padding: 0px;
box-shadow: none;
}
.mx_Dialog {
background-color: $primary-bg-color;
color: $light-fg-color;
@ -425,6 +415,14 @@ textarea {
opacity: 0.7;
}
/* Spinner Dialog overide */
.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog {
width: auto;
border-radius: 8px;
padding: 0px;
box-shadow: none;
}
// TODO: Review mx_GeneralButton usage to see if it can use a different class
// These classes were brought in from the old UserSettings and are included here to avoid
// breaking the app.

6
res/css/views/auth/_AuthBody.scss
View File

@ -58,12 +58,12 @@ limitations under the License.
color: $authpage-primary-color;
}
.mx_Field_labelAlwaysTopLeft label,
.mx_Field select + label, /* Always show a select's label on top to not collide with the value */,
.mx_Field input:focus + label,
.mx_Field input:not(:placeholder-shown) + label,
.mx_Field textarea:focus + label,
.mx_Field textarea:not(:placeholder-shown) + label,
.mx_Field select + label /* Always show a select's label on top to not collide with the value */,
.mx_Field_labelAlwaysTopLeft label {
.mx_Field textarea:not(:placeholder-shown) + label {
background-color: $authpage-body-bg-color;
}

28
res/css/views/context_menus/_RoomTileContextMenu.scss
View File

@ -18,6 +18,18 @@ limitations under the License.
padding: 6px;
}
.mx_RoomTileContextMenu_tag_icon {
padding-right: 8px;
padding-left: 4px;
display: inline-block;
}
.mx_RoomTileContextMenu_tag_icon_set {
padding-right: 8px;
padding-left: 4px;
display: none;
}
.mx_RoomTileContextMenu_tag_field, .mx_RoomTileContextMenu_leave {
padding-top: 8px;
padding-right: 20px;
@ -45,18 +57,6 @@ limitations under the License.
color: rgba(0, 0, 0, 0.2);
}
.mx_RoomTileContextMenu_tag_icon {
padding-right: 8px;
padding-left: 4px;
display: inline-block;
}
.mx_RoomTileContextMenu_tag_icon_set {
padding-right: 8px;
padding-left: 4px;
display: none;
}
.mx_RoomTileContextMenu_separator {
margin-top: 0;
margin-bottom: 0;
@ -72,10 +72,6 @@ limitations under the License.
color: $warning-color;
}
.mx_RoomTileContextMenu_tag_fieldSet .mx_RoomTileContextMenu_tag_icon {
/* Something to indicate that the icon is the set tag */
}
.mx_RoomTileContextMenu_notif_picker {
position: absolute;
top: 16px;

2
res/css/views/dialogs/_DevtoolsDialog.scss
View File

@ -135,6 +135,7 @@ limitations under the License.
}
}
/* stylelint-disable no-descending-specificity */
.mx_DevTools_tgl-flip {
+ .mx_DevTools_tgl-btn {
padding: 2px;
@ -189,3 +190,4 @@ limitations under the License.
}
}
}
/* stylelint-enable no-descending-specificity */

3
res/css/views/dialogs/_SetEmailDialog.scss
View File

@ -31,6 +31,3 @@ limitations under the License.
box-shadow: none;
border: 1px solid $accent-color;
}
.mx_SetEmailDialog_email_input_placeholder {
}

8
res/css/views/elements/_AccessibleButton.scss
View File

@ -14,14 +14,14 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AccessibleButton:focus {
outline: 0;
}
.mx_AccessibleButton {
cursor: pointer;
}
.mx_AccessibleButton:focus {
outline: 0;
}
.mx_AccessibleButton_disabled {
cursor: default;
}

1
res/css/views/elements/_AddressSelector.scss
View File

@ -21,7 +21,6 @@ limitations under the License.
max-height: 116px;
overflow-y: auto;
border-radius: 3px;
background-color: $primary-bg-color;
border: solid 1px $accent-color;
cursor: pointer;
}

14
res/css/views/elements/_Dropdown.scss
View File

@ -51,13 +51,6 @@ limitations under the License.
background: $primary-fg-color;
}
.mx_Dropdown_input > .mx_Dropdown_option {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
}
.mx_Dropdown_option {
height: 35px;
line-height: 35px;
@ -65,6 +58,13 @@ limitations under the License.
padding-right: 8px;
}
.mx_Dropdown_input > .mx_Dropdown_option {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
}
.mx_Dropdown_option div {
overflow: hidden;
text-overflow: ellipsis;

8
res/css/views/elements/_Field.scss
View File

@ -110,12 +110,12 @@ limitations under the License.
max-width: calc(100% - 20px); // 100% of parent minus margin and padding
}
.mx_Field_labelAlwaysTopLeft label,
.mx_Field select + label, /* Always show a select's label on top to not collide with the value */,
.mx_Field input:focus + label,
.mx_Field input:not(:placeholder-shown) + label,
.mx_Field textarea:focus + label,
.mx_Field textarea:not(:placeholder-shown) + label,
.mx_Field select + label /* Always show a select's label on top to not collide with the value */,
.mx_Field_labelAlwaysTopLeft label {
.mx_Field textarea:not(:placeholder-shown) + label {
transition:
font-size 0.25s ease-out 0s,
color 0.25s ease-out 0s,
@ -144,6 +144,7 @@ limitations under the License.
color: $greyed-fg-color;
}
/* stylelint-disable no-descending-specificity */
.mx_Field_valid {
&.mx_Field,
&.mx_Field:focus-within {
@ -167,6 +168,7 @@ limitations under the License.
color: $input-invalid-border-color;
}
}
/* stylelint-enable no-descending-specificity */
.mx_Field_tooltip {
margin-top: -12px;

21
res/css/views/elements/_ManageIntegsButton.scss
View File

@ -16,6 +16,7 @@ limitations under the License.
.mx_ManageIntegsButton_error {
position: relative;
float: right;
cursor: not-allowed;
}
@ -25,18 +26,6 @@ limitations under the License.
top: -5px;
}
.mx_ManageIntegsButton_error {
float: right;
}
.mx_ManageIntegsButton_error .mx_ManageIntegsButton_errorPopup {
display: none;
}
.mx_ManageIntegsButton_error:hover .mx_ManageIntegsButton_errorPopup {
display: inline;
}
.mx_ManageIntegsButton_errorPopup {
position: absolute;
top: 110%;
@ -51,3 +40,11 @@ limitations under the License.
text-align: center;
z-index: 1000;
}
.mx_ManageIntegsButton_error .mx_ManageIntegsButton_errorPopup {
display: none;
}
.mx_ManageIntegsButton_error:hover .mx_ManageIntegsButton_errorPopup {
display: inline;
}

12
res/css/views/elements/_RichText.scss
View File

@ -13,12 +13,6 @@
padding-left: 5px;
}
.mx_EventTile_body .mx_UserPill,
.mx_EventTile_body .mx_RoomPill,
.mx_EventTile_body .mx_GroupPill {
cursor: pointer;
}
/* More specific to override `.markdown-body a` text-decoration */
.mx_EventTile_content .markdown-body a.mx_Pill {
text-decoration: none;
@ -64,6 +58,12 @@
padding-right: 5px;
}
.mx_EventTile_body .mx_UserPill,
.mx_EventTile_body .mx_RoomPill,
.mx_EventTile_body .mx_GroupPill {
cursor: pointer;
}
.mx_UserPill .mx_BaseAvatar,
.mx_RoomPill .mx_BaseAvatar,
.mx_GroupPill .mx_BaseAvatar,

8
res/css/views/elements/_ToggleSwitch.scss
View File

@ -44,10 +44,10 @@ limitations under the License.
top: 0;
}
.mx_ToggleSwitch:not(.mx_ToggleSwitch_on) > .mx_ToggleSwitch_ball {
left: 2px;
}
.mx_ToggleSwitch_on > .mx_ToggleSwitch_ball {
left: 23px; // 48px switch - 20px ball - 5px padding = 23px
}
.mx_ToggleSwitch:not(.mx_ToggleSwitch_on) > .mx_ToggleSwitch_ball {
left: 2px;
}

3
res/css/views/messages/_CreateEvent.scss
View File

@ -37,6 +37,3 @@ limitations under the License.
.mx_CreateEvent_header {
font-weight: bold;
}
.mx_CreateEvent_link {
}

2
res/css/views/messages/_DateSeparator.scss
View File

@ -30,7 +30,7 @@ limitations under the License.
border-bottom: 1px solid $panel-divider-color;
}
.mx_DateSeparator > date {
.mx_DateSeparator > div {
margin: 0 25px;
flex: 0 0 auto;
}

2
res/css/views/rooms/_AppsDrawer.scss
View File

@ -42,7 +42,6 @@ $AppsDrawerBodyHeight: 273px;
.mx_AddWidget_button {
order: 2;
cursor: pointer;
padding-right: 12px;
padding: 0;
margin: 5px auto 5px auto;
color: $accent-color;
@ -270,7 +269,6 @@ $AppsDrawerBodyHeight: 273px;
.mx_AppIconTile_image {
padding: 10px;
width: 75%;
max-width: 100px;
max-height: 100px;
width: auto;

39
res/css/views/rooms/_Autocomplete.scss
View File

@ -15,11 +15,6 @@
border-bottom: 1px solid $primary-hairline-color;
}
.mx_Autocomplete_Completion_container_pill {
margin: 12px;
display: flex;
}
/* a "block" completion takes up a whole line */
.mx_Autocomplete_Completion_block {
height: 34px;
@ -50,6 +45,22 @@
margin: 0 3px;
}
/* styling for common completion elements */
.mx_Autocomplete_Completion_subtitle {
font-style: italic;
flex: 1;
}
.mx_Autocomplete_Completion_description {
color: gray;
}
.mx_Autocomplete_Completion_container_pill {
margin: 12px;
display: flex;
flex-flow: wrap;
}
.mx_Autocomplete_Completion_container_truncate {
.mx_Autocomplete_Completion_title,
.mx_Autocomplete_Completion_subtitle,
@ -62,13 +73,6 @@
}
}
/* container for pill-style completions */
.mx_Autocomplete_Completion_container_pill {
margin: 12px;
display: flex;
flex-flow: wrap;
}
.mx_Autocomplete_Completion.selected,
.mx_Autocomplete_Completion:hover {
background: $selected-color;
@ -81,14 +85,3 @@
font-weight: 400;
opacity: 0.4;
}
/* styling for common completion elements */
.mx_Autocomplete_Completion_subtitle {
font-style: italic;
flex: 1;
}
.mx_Autocomplete_Completion_description {
color: gray;
}

8
res/css/views/rooms/_EntityTile.scss
View File

@ -85,10 +85,6 @@ limitations under the License.
overflow: hidden;
}
.mx_EntityTile:not(.mx_EntityTile_noHover):hover .mx_EntityTile_name {
font-size: 13px;
}
.mx_EntityTile_ellipsis .mx_EntityTile_name {
font-style: italic;
color: $primary-fg-color;
@ -116,6 +112,10 @@ limitations under the License.
opacity: 0.25;
}
.mx_EntityTile:not(.mx_EntityTile_noHover):hover .mx_EntityTile_name {
font-size: 13px;
}
.mx_EntityTile_subtext {
font-size: 11px;
opacity: 0.5;

167
res/css/views/rooms/_EventTile.scss
View File

@ -126,6 +126,27 @@ limitations under the License.
line-height: 57px !important;
}
.mx_MessagePanel_alwaysShowTimestamps .mx_MessageTimestamp {
visibility: visible;
}
.mx_EventTile_selected > div > a > .mx_MessageTimestamp {
left: 3px;
width: auto;
}
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
.mx_EventTile_last > div > a > .mx_MessageTimestamp,
.mx_EventTile:hover > div > a > .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_actionBarFocused > div > a > .mx_MessageTimestamp {
visibility: visible;
}
.mx_EventTile:hover .mx_MessageActionBar,
.mx_EventTile.mx_EventTile_actionBarFocused .mx_MessageActionBar {
visibility: visible;
}
/* this is used for the tile for the event which is selected via the URL.
* TODO: ultimately we probably want some transition on here.
*/
@ -135,6 +156,15 @@ limitations under the License.
background-color: $event-selected-color;
}
.mx_EventTile_highlight,
.mx_EventTile_highlight .markdown-body {
color: $event-highlight-fg-color;
.mx_EventTile_line {
background-color: $event-highlight-bg-color;
}
}
.mx_EventTile:hover .mx_EventTile_line,
.mx_EventTile.mx_EventTile_actionBarFocused .mx_EventTile_line {
background-color: $event-selected-color;
@ -166,14 +196,6 @@ limitations under the License.
.mx_EventTile_sending .mx_RoomPill {
opacity: 0.5;
}
.mx_EventTile_sending.mx_EventTile_redacted .mx_UnknownBody {
opacity: 0.4;
}
div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
--lozenge-color: $event-notsent-color !important;
--lozenge-border-color: $event-notsent-color !important;
}
.mx_EventTile_notSent {
color: $event-notsent-color;
@ -184,28 +206,27 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
--lozenge-color: $event-redacted-fg-color;
--lozenge-border-color: $event-redacted-border-color;
display: block;
width: 100%;
height: 22px;
width: 250px;
border-radius: 11px;
background:
repeating-linear-gradient(
-45deg,
var(--lozenge-color),
var(--lozenge-color) 3px,
transparent 3px,
transparent 6px
);
repeating-linear-gradient(
-45deg,
var(--lozenge-color),
var(--lozenge-color) 3px,
transparent 3px,
transparent 6px
);
box-shadow: 0px 0px 3px var(--lozenge-border-color) inset;
}
.mx_EventTile_highlight,
.mx_EventTile_highlight .markdown-body {
color: $event-highlight-fg-color;
.mx_EventTile_sending.mx_EventTile_redacted .mx_UnknownBody {
opacity: 0.4;
}
.mx_EventTile_line {
background-color: $event-highlight-bg-color;
}
div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
--lozenge-color: $event-notsent-color;
--lozenge-border-color: $event-notsent-color;
}
.mx_EventTile_contextual {
@ -230,27 +251,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
text-decoration: none;
}
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
.mx_EventTile_last > div > a > .mx_MessageTimestamp,
.mx_EventTile:hover > div > a > .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_actionBarFocused > div > a > .mx_MessageTimestamp {
visibility: visible;
}
.mx_MessagePanel_alwaysShowTimestamps .mx_MessageTimestamp {
visibility: visible;
}
.mx_EventTile_selected > div > a > .mx_MessageTimestamp {
left: 3px;
width: auto;
}
.mx_EventTile:hover .mx_MessageActionBar,
.mx_EventTile.mx_EventTile_actionBarFocused .mx_MessageActionBar {
visibility: visible;
}
.mx_EventTile_readAvatars {
position: relative;
display: inline-block;
@ -296,11 +296,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
overflow-y: hidden;
}
/* End to end encryption stuff */
.mx_EventTile:hover .mx_EventTile_e2eIcon {
opacity: 1;
}
.mx_EventTile_e2eIcon {
display: block;
position: absolute;
@ -367,22 +362,31 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
padding-left: 5px;
}
.mx_EventTile_selected.mx_EventTile_info .mx_EventTile_line {
padding-left: 78px;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
padding-left: 60px;
}
.mx_EventTile_selected.mx_EventTile_info .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line {
border-left: $e2e-verified-color 5px solid;
}
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
border-left: $e2e-unverified-color 5px solid;
}
.mx_EventTile:hover.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line {
padding-left: 78px;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line {
border-left: $e2e-verified-color 5px solid;
}
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
border-left: $e2e-unverified-color 5px solid;
/* End to end encryption stuff */
.mx_EventTile:hover .mx_EventTile_e2eIcon {
opacity: 1;
}
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
@ -392,12 +396,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
width: auto;
}
/*
.mx_EventTile_verified .mx_EventTile_e2eIcon {
display: none;
}
*/
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line > .mx_EventTile_e2eIcon,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line > .mx_EventTile_e2eIcon {
@ -416,35 +414,40 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
/* Various markdown overrides */
.mx_EventTile_body pre {
border: 1px solid transparent;
}
.mx_EventTile_content .markdown-body {
font-family: inherit !important;
white-space: normal !important;
line-height: inherit !important;
color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks)
font-size: 14px;
}
/* have to use overlay rather than auto otherwise Linux and Windows
Chrome gets very confused about vertical spacing:
https://github.com/vector-im/vector-web/issues/754
*/
.mx_EventTile_content .markdown-body pre {
overflow-x: overlay;
overflow-y: visible;
max-height: 30vh;
}
.mx_EventTile_content .markdown-body code {
// deliberate constants as we're behind an invert filter
background-color: #f8f8f8;
}
.mx_EventTile_content .markdown-body {
pre, code {
font-family: $monospace-font-family !important;
// deliberate constants as we're behind an invert filter
color: #333;
}
pre {
// have to use overlay rather than auto otherwise Linux and Windows
// Chrome gets very confused about vertical spacing:
// https://github.com/vector-im/vector-web/issues/754
overflow-x: overlay;
overflow-y: visible;
max-height: 30vh;
}
code {
// deliberate constants as we're behind an invert filter
background-color: #f8f8f8;
}
}
.mx_EventTile:hover .mx_EventTile_body pre {
border: 1px solid #e5e5e5; // deliberate constant as we're behind an invert filter
}
.mx_EventTile_pre_container {
@ -465,14 +468,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
background-image: url($copy-button-url);
}
.mx_EventTile_body pre {
border: 1px solid transparent;
}
.mx_EventTile:hover .mx_EventTile_body pre {
border: 1px solid #e5e5e5; // deliberate constant as we're behind an invert filter
}
.mx_EventTile_body .mx_EventTile_pre_container:hover .mx_EventTile_copyButton {
visibility: visible;
}
@ -518,6 +513,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
/* end of overrides */
/* stylelint-disable no-descending-specificity */
.mx_MatrixChat_useCompactLayout {
.mx_EventTile {
padding-top: 4px;
@ -595,3 +591,4 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
}
}
}
/* stylelint-enable no-descending-specificity */

3
res/css/views/rooms/_MemberInfo.scss
View File

@ -82,9 +82,6 @@ limitations under the License.
display: block;
}
.mx_MemberInfo_avatar .mx_BaseAvatar {
}
.mx_MemberInfo_avatar .mx_BaseAvatar.mx_BaseAvatar_image {
cursor: zoom-in;
}

12
res/css/views/rooms/_PinnedEventTile.scss
View File

@ -44,6 +44,12 @@ limitations under the License.
margin-right: 10px;
}
.mx_PinnedEventTile_actions {
float: right;
margin-right: 10px;
display: none;
}
.mx_PinnedEventTile:hover .mx_PinnedEventTile_timestamp {
display: inline-block;
}
@ -52,12 +58,6 @@ limitations under the License.
display: block;
}
.mx_PinnedEventTile_actions {
float: right;
margin-right: 10px;
display: none;
}
.mx_PinnedEventTile_unpinButton {
display: inline-block;
cursor: pointer;

17
res/css/views/rooms/_RoomBreadcrumbs.scss
View File

@ -78,6 +78,14 @@ limitations under the License.
display: none;
}
.mx_IndicatorScrollbar_leftOverflowIndicator {
background: linear-gradient(to left, $panel-gradient);
}
.mx_IndicatorScrollbar_rightOverflowIndicator {
background: linear-gradient(to right, $panel-gradient);
}
&.mx_IndicatorScrollbar_leftOverflow .mx_IndicatorScrollbar_leftOverflowIndicator,
&.mx_IndicatorScrollbar_rightOverflow .mx_IndicatorScrollbar_rightOverflowIndicator {
position: absolute;
@ -88,13 +96,4 @@ limitations under the License.
pointer-events: none;
z-index: 100;
}
.mx_IndicatorScrollbar_leftOverflowIndicator {
background: linear-gradient(to left, $panel-gradient);
}
.mx_IndicatorScrollbar_rightOverflowIndicator {
background: linear-gradient(to right, $panel-gradient);
}
}

1
res/css/views/rooms/_RoomHeader.scss
View File

@ -22,7 +22,6 @@ limitations under the License.
.mx_RoomHeader_wrapper {
margin: auto;
height: 52px;
align-items: center;
display: flex;
align-items: center;
min-width: 0;

40
res/css/views/rooms/_RoomTile.scss
View File

@ -25,6 +25,11 @@ limitations under the License.
position: relative;
}
.mx_RoomTile:focus {
filter: none !important;
background-color: $roomtile-focused-bg-color;
}
.mx_RoomTile_menuButton {
display: none;
flex: 0 0 16px;
@ -34,13 +39,6 @@ limitations under the License.
background-position: center;
}
// toggle menuButton and badge on hover/menu displayed
.mx_LeftPanel_container:not(.collapsed) .mx_RoomTile:hover, .mx_RoomTile_menuDisplayed {
.mx_RoomTile_menuButton {
display: block;
}
}
.mx_RoomTile_tooltip {
display: inline-block;
position: relative;
@ -48,7 +46,6 @@ limitations under the License.
left: -12px;
}
.mx_RoomTile_nameContainer {
display: flex;
align-items: center;
@ -109,6 +106,15 @@ limitations under the License.
text-overflow: ellipsis;
}
.mx_RoomTile_badge {
flex: 0 1 content;
border-radius: 0.8em;
padding: 0 0.4em;
color: $accent-fg-color;
font-weight: 600;
font-size: 12px;
}
.collapsed {
.mx_RoomTile {
margin: 0 2px;
@ -135,13 +141,12 @@ limitations under the License.
}
}
.mx_RoomTile_badge {
flex: 0 1 content;
border-radius: 0.8em;
padding: 0 0.4em;
color: $accent-fg-color;
font-weight: 600;
font-size: 12px;
// toggle menuButton and badge on hover/menu displayed
.mx_RoomTile_menuDisplayed,
.mx_LeftPanel_container:not(.collapsed) .mx_RoomTile:hover {
.mx_RoomTile_menuButton {
display: block;
}
}
.mx_RoomTile_unreadNotify .mx_RoomTile_badge,
@ -175,11 +180,6 @@ limitations under the License.
transform: scale(1.05, 1.05);
}
.mx_RoomTile:focus {
filter: none !important;
background-color: $roomtile-focused-bg-color;
}
.mx_RoomTile_arrow {
position: absolute;
right: 0px;

2
src/components/views/messages/DateSeparator.js
View File

@ -56,6 +56,6 @@ export default class DateSeparator extends React.Component {
}
render() {
return <h2 className="mx_DateSeparator"><hr /><date>{ this.getLabel() }</date><hr /></h2>;
return <h2 className="mx_DateSeparator"><hr /><div>{ this.getLabel() }</div><hr /></h2>;
}
}