imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #3200 from matrix-org/jryans/stylelint-all-files

Browse source 
Run stylelint on all SCSS files
This commit is contained in:
J. Ryan Stinnett 2019-07-11 09:38:18 +01:00 • committed by GitHub
commit 9b3848d083
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
63 changed files with 391 additions and 397 deletions
Download patch file Download diff file Expand all files Collapse all files

5
.stylelintrc.js
View file

@ -1,5 +1,8 @@
module.exports = { module.exports = {
"extends": "stylelint-config-standard", "extends": "stylelint-config-standard",
"plugins": [
"stylelint-scss",
],
"rules": { "rules": {
"indentation": 4, "indentation": 4,
"comment-empty-line-before": null, "comment-empty-line-before": null,
@ -11,5 +14,7 @@ module.exports = {
"number-no-trailing-zeros": null, "number-no-trailing-zeros": null,
"number-leading-zero": null, "number-leading-zero": null,
"selector-list-comma-newline-after": null, "selector-list-comma-newline-after": null,
"at-rule-no-unknown": null,
"scss/at-rule-no-unknown": true,
} }
} }

3
package.json
View file

@ -49,7 +49,7 @@
"lint": "eslint src/", "lint": "eslint src/",
"lintall": "eslint src/ test/", "lintall": "eslint src/ test/",
"lintwithexclusions": "eslint --max-warnings 0 --ignore-path .eslintignore.errorfiles src test", "lintwithexclusions": "eslint --max-warnings 0 --ignore-path .eslintignore.errorfiles src test",
"stylelint": "stylelint res/css/**/*.scss", "stylelint": "stylelint 'res/css/**/*.scss'",
"clean": "rimraf lib", "clean": "rimraf lib",
"prepare": "yarn clean && yarn build && git rev-parse HEAD > git-revision.txt", "prepare": "yarn clean && yarn build && git rev-parse HEAD > git-revision.txt",
"test": "karma start --single-run=true --browsers VectorChromeHeadless", "test": "karma start --single-run=true --browsers VectorChromeHeadless",
@ -153,6 +153,7 @@
"source-map-loader": "^0.2.3", "source-map-loader": "^0.2.3",
"stylelint": "^9.10.1", "stylelint": "^9.10.1",
"stylelint-config-standard": "^18.2.0", "stylelint-config-standard": "^18.2.0",
"stylelint-scss": "^3.9.0",
"walk": "^2.3.9", "walk": "^2.3.9",
"webpack": "^4.20.2", "webpack": "^4.20.2",
"webpack-cli": "^3.1.1" "webpack-cli": "^3.1.1"

56
res/css/_common.scss
View file

@ -104,17 +104,17 @@ input[type=text], input[type=password], textarea {
color: $primary-fg-color; color: $primary-fg-color;
} }
input[type=text]:focus, input[type=password]:focus, textarea:focus {
outline: none;
box-shadow: none;
}
/* Required by Firefox */ /* Required by Firefox */
textarea { textarea {
font-family: $font-family; font-family: $font-family;
color: $primary-fg-color; 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 // This is used to hide the standard outline added by browsers for
// accessible (focusable) components. Not intended for buttons, but // accessible (focusable) components. Not intended for buttons, but
// should be used on things like focusable containers where the outline // should be used on things like focusable containers where the outline
@ -129,6 +129,13 @@ textarea {
// appear to be part of the input // appear to be part of the input
.mx_Dialog, .mx_MatrixChat { .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=text],
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search],
.mx_textinput { .mx_textinput {
@ -147,13 +154,6 @@ textarea {
.mx_textinput { .mx_textinput {
display: flex; display: flex;
align-items: center; 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, :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text]::placeholder,
@ -166,9 +166,7 @@ textarea {
/*** panels ***/ /*** panels ***/
.dark-panel { .dark-panel {
background-color: $dark-panel-bg-color; 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=text],
:not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search],
.mx_textinput { .mx_textinput {
@ -209,25 +207,25 @@ textarea {
/* Expand thumbs on hoverover */ /* Expand thumbs on hoverover */
.gm-scrollbar { .gm-scrollbar {
border-radius: 5px ! important; border-radius: 5px !important;
} }
.gm-scrollbar.-vertical { .gm-scrollbar.-vertical {
width: 6px; width: 6px;
transition: width 120ms ease-out ! important; transition: width 120ms ease-out !important;
} }
.gm-scrollbar.-vertical:hover, .gm-scrollbar.-vertical:hover,
.gm-scrollbar.-vertical:active { .gm-scrollbar.-vertical:active {
width: 8px; width: 8px;
transition: width 120ms ease-out ! important; transition: width 120ms ease-out !important;
} }
.gm-scrollbar.-horizontal { .gm-scrollbar.-horizontal {
height: 6px; height: 6px;
transition: height 120ms ease-out ! important; transition: height 120ms ease-out !important;
} }
.gm-scrollbar.-horizontal:hover, .gm-scrollbar.-horizontal:hover,
.gm-scrollbar.-horizontal:active { .gm-scrollbar.-horizontal:active {
height: 8px; height: 8px;
transition: height 120ms ease-out ! important; transition: height 120ms ease-out !important;
} }
// These are magic constants which are excluded from tinting, to let themes // These are magic constants which are excluded from tinting, to let themes
@ -271,14 +269,6 @@ textarea {
justify-content: center; 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 { .mx_Dialog {
background-color: $primary-bg-color; background-color: $primary-bg-color;
color: $light-fg-color; color: $light-fg-color;
@ -390,7 +380,7 @@ textarea {
// flip colours for the secondary ones // flip colours for the secondary ones
font-weight: 600; font-weight: 600;
border: 1px solid $accent-color ! important; border: 1px solid $accent-color !important;
color: $accent-color; color: $accent-color;
background-color: $button-secondary-bg-color; background-color: $button-secondary-bg-color;
} }
@ -407,7 +397,7 @@ textarea {
filter: brightness($focus-brightness); filter: brightness($focus-brightness);
} }
.mx_Dialog button.mx_Dialog_primary, .mx_Dialog input[type="submit"].mx_Dialog_primary { .mx_Dialog button.mx_Dialog_primary, .mx_Dialog input[type="submit"].mx_Dialog_primary {
color: $accent-fg-color; color: $accent-fg-color;
background-color: $accent-color; background-color: $accent-color;
min-width: 156px; min-width: 156px;
@ -425,6 +415,14 @@ textarea {
opacity: 0.7; 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 // 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 // These classes were brought in from the old UserSettings and are included here to avoid
// breaking the app. // breaking the app.

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

@ -58,12 +58,12 @@ limitations under the License.
color: $authpage-primary-color; 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:focus + label,
.mx_Field input:not(:placeholder-shown) + label, .mx_Field input:not(:placeholder-shown) + label,
.mx_Field textarea:focus + label, .mx_Field textarea:focus + label,
.mx_Field textarea:not(:placeholder-shown) + 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 {
background-color: $authpage-body-bg-color; 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; 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 { .mx_RoomTileContextMenu_tag_field, .mx_RoomTileContextMenu_leave {
padding-top: 8px; padding-top: 8px;
padding-right: 20px; padding-right: 20px;
@ -45,18 +57,6 @@ limitations under the License.
color: rgba(0, 0, 0, 0.2); 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 { .mx_RoomTileContextMenu_separator {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
@ -72,10 +72,6 @@ limitations under the License.
color: $warning-color; 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 { .mx_RoomTileContextMenu_notif_picker {
position: absolute; position: absolute;
top: 16px; top: 16px;

2
res/css/views/context_menus/_TagTileContextMenu.scss
View file

@ -33,7 +33,7 @@ limitations under the License.
.mx_TagTileContextMenu_item_icon { .mx_TagTileContextMenu_item_icon {
padding-right: 8px; padding-right: 8px;
padding-left: 4px; padding-left: 4px;
display: inline-block display: inline-block;
} }
.mx_TagTileContextMenu_separator { .mx_TagTileContextMenu_separator {

1
res/css/views/context_menus/_TopLeftMenu.scss
View file

@ -89,5 +89,4 @@ limitations under the License.
background-color: $menu-selected-color; background-color: $menu-selected-color;
} }
} }
} }

5
res/css/views/dialogs/_AddressPickerDialog.scss
View file

@ -17,8 +17,7 @@ limitations under the License.
/* Using a textarea for this element, to circumvent autofill */ /* Using a textarea for this element, to circumvent autofill */
.mx_AddressPickerDialog_input, .mx_AddressPickerDialog_input,
.mx_AddressPickerDialog_input:focus .mx_AddressPickerDialog_input:focus {
{
height: 26px; height: 26px;
font-size: 14px; font-size: 14px;
font-family: $font-family; font-family: $font-family;
@ -36,7 +35,7 @@ limitations under the License.
} }
.mx_AddressPickerDialog .mx_Dialog_content { .mx_AddressPickerDialog .mx_Dialog_content {
min-height: 50px min-height: 50px;
} }
.mx_AddressPickerDialog_inputContainer { .mx_AddressPickerDialog_inputContainer {

53
res/css/views/dialogs/_DevtoolsDialog.scss
View file

@ -45,13 +45,11 @@ limitations under the License.
border-bottom: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;
} }
.mx_DevTools_inputRow .mx_DevTools_inputRow {
{
display: table-row; display: table-row;
} }
.mx_DevTools_inputLabelCell .mx_DevTools_inputLabelCell {
{
display: table-cell; display: table-cell;
font-weight: bold; font-weight: bold;
padding-right: 24px; padding-right: 24px;
@ -62,8 +60,7 @@ limitations under the License.
width: 240px; width: 240px;
} }
.mx_DevTools_inputCell input .mx_DevTools_inputCell input {
{
display: inline-block; display: inline-block;
border: 0; border: 0;
border-bottom: 1px solid $input-underline-color; border-bottom: 1px solid $input-underline-color;
@ -95,11 +92,11 @@ limitations under the License.
// add default box-sizing for this scope // add default box-sizing for this scope
&, &,
&:after, &::after,
&:before, &::before,
& *, & *,
& *:after, & *::after,
& *:before, & *::before,
& + .mx_DevTools_tgl-btn { & + .mx_DevTools_tgl-btn {
box-sizing: border-box; box-sizing: border-box;
&::selection { &::selection {
@ -115,8 +112,8 @@ limitations under the License.
position: relative; position: relative;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
&:after, &::after,
&:before { &::before {
position: relative; position: relative;
display: block; display: block;
content: ""; content: "";
@ -124,28 +121,31 @@ limitations under the License.
height: 100%; height: 100%;
} }
&:after { &::after {
left: 0; left: 0;
} }
&:before { &::before {
display: none; display: none;
} }
} }
&:checked + .mx_DevTools_tgl-btn:after { &:checked + .mx_DevTools_tgl-btn::after {
left: 50%; left: 50%;
} }
} }
/* Ordering this block by specificity would require breaking it up into several
chunks, which seems like it would be more confusing to read. */
/* stylelint-disable no-descending-specificity */
.mx_DevTools_tgl-flip { .mx_DevTools_tgl-flip {
+ .mx_DevTools_tgl-btn { + .mx_DevTools_tgl-btn {
padding: 2px; padding: 2px;
transition: all .2s ease; transition: all .2s ease;
font-family: sans-serif; font-family: sans-serif;
perspective: 100px; perspective: 100px;
&:after, &::after,
&:before { &::before {
display: inline-block; display: inline-block;
transition: all .4s ease; transition: all .4s ease;
width: 100%; width: 100%;
@ -160,35 +160,36 @@ limitations under the License.
border-radius: 4px; border-radius: 4px;
} }
&:after { &::after {
content: attr(data-tg-on); content: attr(data-tg-on);
background: #02C66F; background: #02c66f;
transform: rotateY(-180deg); transform: rotateY(-180deg);
} }
&:before { &::before {
background: #FF3A19; background: #ff3a19;
content: attr(data-tg-off); content: attr(data-tg-off);
} }
&:active:before { &:active::before {
transform: rotateY(-20deg); transform: rotateY(-20deg);
} }
} }
&:checked + .mx_DevTools_tgl-btn { &:checked + .mx_DevTools_tgl-btn {
&:before { &::before {
transform: rotateY(180deg); transform: rotateY(180deg);
} }
&:after { &::after {
transform: rotateY(0); transform: rotateY(0);
left: 0; left: 0;
background: #7FC6A6; background: #7fc6a6;
} }
&:active:after { &:active::after {
transform: rotateY(20deg); transform: rotateY(20deg);
} }
} }
} }
/* stylelint-enable no-descending-specificity */

2
res/css/views/dialogs/_GroupAddressPicker.scss
View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_GroupAddressPicker_checkboxContainer{ .mx_GroupAddressPicker_checkboxContainer {
margin-top: 10px; margin-top: 10px;
display: flex; display: flex;
} }

8
res/css/views/dialogs/_RoomSettingsDialog.scss
View file

@ -17,19 +17,19 @@ limitations under the License.
// ICONS // ICONS
// ========================================================== // ==========================================================
.mx_RoomSettingsDialog_settingsIcon:before { .mx_RoomSettingsDialog_settingsIcon::before {
mask-image: url('$(res)/img/feather-customised/settings.svg'); mask-image: url('$(res)/img/feather-customised/settings.svg');
} }
.mx_RoomSettingsDialog_securityIcon:before { .mx_RoomSettingsDialog_securityIcon::before {
mask-image: url('$(res)/img/feather-customised/lock.svg'); mask-image: url('$(res)/img/feather-customised/lock.svg');
} }
.mx_RoomSettingsDialog_rolesIcon:before { .mx_RoomSettingsDialog_rolesIcon::before {
mask-image: url('$(res)/img/feather-customised/users-sm.svg'); mask-image: url('$(res)/img/feather-customised/users-sm.svg');
} }
.mx_RoomSettingsDialog_warningIcon:before { .mx_RoomSettingsDialog_warningIcon::before {
mask-image: url('$(res)/img/feather-customised/warning-triangle.svg'); mask-image: url('$(res)/img/feather-customised/warning-triangle.svg');
} }

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

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

16
res/css/views/dialogs/_UserSettingsDialog.scss
View file

@ -17,34 +17,34 @@ limitations under the License.
// ICONS // ICONS
// ========================================================== // ==========================================================
.mx_UserSettingsDialog_settingsIcon:before { .mx_UserSettingsDialog_settingsIcon::before {
mask-image: url('$(res)/img/feather-customised/settings.svg'); mask-image: url('$(res)/img/feather-customised/settings.svg');
} }
.mx_UserSettingsDialog_voiceIcon:before { .mx_UserSettingsDialog_voiceIcon::before {
mask-image: url('$(res)/img/feather-customised/phone.svg'); mask-image: url('$(res)/img/feather-customised/phone.svg');
} }
.mx_UserSettingsDialog_bellIcon:before { .mx_UserSettingsDialog_bellIcon::before {
mask-image: url('$(res)/img/feather-customised/notifications.svg'); mask-image: url('$(res)/img/feather-customised/notifications.svg');
} }
.mx_UserSettingsDialog_preferencesIcon:before { .mx_UserSettingsDialog_preferencesIcon::before {
mask-image: url('$(res)/img/feather-customised/sliders.svg'); mask-image: url('$(res)/img/feather-customised/sliders.svg');
} }
.mx_UserSettingsDialog_securityIcon:before { .mx_UserSettingsDialog_securityIcon::before {
mask-image: url('$(res)/img/feather-customised/lock.svg'); mask-image: url('$(res)/img/feather-customised/lock.svg');
} }
.mx_UserSettingsDialog_helpIcon:before { .mx_UserSettingsDialog_helpIcon::before {
mask-image: url('$(res)/img/feather-customised/help-circle.svg'); mask-image: url('$(res)/img/feather-customised/help-circle.svg');
} }
.mx_UserSettingsDialog_labsIcon:before { .mx_UserSettingsDialog_labsIcon::before {
mask-image: url('$(res)/img/feather-customised/flag.svg'); mask-image: url('$(res)/img/feather-customised/flag.svg');
} }
.mx_UserSettingsDialog_flairIcon:before { .mx_UserSettingsDialog_flairIcon::before {
mask-image: url('$(res)/img/feather-customised/flair.svg'); mask-image: url('$(res)/img/feather-customised/flair.svg');
} }

4
res/css/views/dialogs/keybackup/_CreateKeyBackupDialog.scss
View file

@ -20,8 +20,8 @@ limitations under the License.
} }
.mx_CreateKeyBackupDialog_primaryContainer { .mx_CreateKeyBackupDialog_primaryContainer {
/*FIXME: plinth colour in new theme(s). background-color: $accent-color;*/ /* FIXME: plinth colour in new theme(s). background-color: $accent-color; */
padding: 20px padding: 20px;
} }
.mx_CreateKeyBackupDialog_primaryContainer::after { .mx_CreateKeyBackupDialog_primaryContainer::after {

2
res/css/views/dialogs/keybackup/_KeyBackupFailedDialog.scss
View file

@ -23,7 +23,7 @@ limitations under the License.
padding-left: 45px; padding-left: 45px;
padding-bottom: 10px; padding-bottom: 10px;
&:before { &::before {
mask: url("$(res)/img/e2e/lock-warning-filled.svg"); mask: url("$(res)/img/e2e/lock-warning-filled.svg");
mask-repeat: no-repeat; mask-repeat: no-repeat;
background-color: $primary-fg-color; background-color: $primary-fg-color;

6
res/css/views/dialogs/keybackup/_RestoreKeyBackupDialog.scss
View file

@ -13,10 +13,10 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_RestoreKeyBackupDialog_primaryContainer { .mx_RestoreKeyBackupDialog_primaryContainer {
/*FIXME: plinth colour in new theme(s). background-color: $accent-color;*/ /* FIXME: plinth colour in new theme(s). background-color: $accent-color; */
padding: 20px padding: 20px;
} }
.mx_RestoreKeyBackupDialog_passPhraseInput, .mx_RestoreKeyBackupDialog_passPhraseInput,

2
res/css/views/directory/_NetworkDropdown.scss
View file

@ -36,7 +36,7 @@ limitations under the License.
position: absolute; position: absolute;
right: 10px; right: 10px;
top: 16px; top: 16px;
width: 0 width: 0;
} }
.mx_NetworkDropdown_networkoption { .mx_NetworkDropdown_networkoption {

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. limitations under the License.
*/ */
.mx_AccessibleButton:focus {
outline: 0;
}
.mx_AccessibleButton { .mx_AccessibleButton {
cursor: pointer; cursor: pointer;
} }
.mx_AccessibleButton:focus {
outline: 0;
}
.mx_AccessibleButton_disabled { .mx_AccessibleButton_disabled {
cursor: default; cursor: default;
} }

5
res/css/views/elements/_AddressSelector.scss
View file

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

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

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

10
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 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:focus + label,
.mx_Field input:not(:placeholder-shown) + label, .mx_Field input:not(:placeholder-shown) + label,
.mx_Field textarea:focus + label, .mx_Field textarea:focus + label,
.mx_Field textarea:not(:placeholder-shown) + 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 {
transition: transition:
font-size 0.25s ease-out 0s, font-size 0.25s ease-out 0s,
color 0.25s ease-out 0s, color 0.25s ease-out 0s,
@ -144,6 +144,9 @@ limitations under the License.
color: $greyed-fg-color; color: $greyed-fg-color;
} }
/* Ordering this block by specificity would require breaking it up into several
chunks, which seems like it would be more confusing to read. */
/* stylelint-disable no-descending-specificity */
.mx_Field_valid { .mx_Field_valid {
&.mx_Field, &.mx_Field,
&.mx_Field:focus-within { &.mx_Field:focus-within {
@ -167,6 +170,7 @@ limitations under the License.
color: $input-invalid-border-color; color: $input-invalid-border-color;
} }
} }
/* stylelint-enable no-descending-specificity */
.mx_Field_tooltip { .mx_Field_tooltip {
margin-top: -12px; margin-top: -12px;

4
res/css/views/elements/_ImageView.scss
View file

@ -128,8 +128,8 @@ limitations under the License.
} }
.mx_ImageView_link { .mx_ImageView_link {
color: $lightbox-fg-color ! important; color: $lightbox-fg-color !important;
text-decoration: none ! important; text-decoration: none !important;
} }
.mx_ImageView_button { .mx_ImageView_button {

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

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

18
res/css/views/elements/_RichText.scss
View file

@ -13,12 +13,6 @@
padding-left: 5px; 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 */ /* More specific to override `.markdown-body a` text-decoration */
.mx_EventTile_content .markdown-body a.mx_Pill { .mx_EventTile_content .markdown-body a.mx_Pill {
text-decoration: none; text-decoration: none;
@ -33,7 +27,7 @@
} }
.mx_UserPill_selected { .mx_UserPill_selected {
background-color: $accent-color ! important; background-color: $accent-color !important;
} }
/* More specific to override `.markdown-body a` color */ /* More specific to override `.markdown-body a` color */
@ -64,6 +58,12 @@
padding-right: 5px; 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_UserPill .mx_BaseAvatar,
.mx_RoomPill .mx_BaseAvatar, .mx_RoomPill .mx_BaseAvatar,
.mx_GroupPill .mx_BaseAvatar, .mx_GroupPill .mx_BaseAvatar,
@ -79,7 +79,7 @@
.mx_Markdown_ITALIC { .mx_Markdown_ITALIC {
font-style: italic; font-style: italic;
/* /*
// interestingly, *not* using the explicit italic font // interestingly, *not* using the explicit italic font
// variant seems yield better results. // variant seems yield better results.
@ -87,7 +87,7 @@
// https://github.com/google/fonts/issues/1726 // https://github.com/google/fonts/issues/1726
transform: skewX(-14deg); transform: skewX(-14deg);
display: inline-block; display: inline-block;
*/ */
} }
.mx_Markdown_CODE { .mx_Markdown_CODE {

2
res/css/views/elements/_Spinner.scss
View file

@ -25,4 +25,4 @@ limitations under the License.
.mx_MatrixChat_middlePanel .mx_Spinner { .mx_MatrixChat_middlePanel .mx_Spinner {
height: auto; height: auto;
} }

2
res/css/views/elements/_TextWithTooltip.scss
View file

@ -16,4 +16,4 @@ limitations under the License.
.mx_TextWithTooltip_tooltip { .mx_TextWithTooltip_tooltip {
display: none; display: none;
} }

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

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

4
res/css/views/elements/_Tooltip.scss
View file

@ -36,8 +36,8 @@ limitations under the License.
border-bottom: 7px solid transparent; border-bottom: 7px solid transparent;
} }
.mx_Tooltip_chevron:after { .mx_Tooltip_chevron::after {
content:''; content: '';
width: 0; width: 0;
height: 0; height: 0;
border-top: 6px solid transparent; border-top: 6px solid transparent;

7
res/css/views/globals/_MatrixToolbar.scss
View file

@ -44,10 +44,9 @@ limitations under the License.
flex: 1; flex: 1;
} }
.mx_MatrixToolbar_link .mx_MatrixToolbar_link {
{ color: $accent-fg-color !important;
color: $accent-fg-color ! important; text-decoration: underline !important;
text-decoration: underline ! important;
cursor: pointer; cursor: pointer;
} }

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

@ -37,6 +37,3 @@ limitations under the License.
.mx_CreateEvent_header { .mx_CreateEvent_header {
font-weight: bold; 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; border-bottom: 1px solid $panel-divider-color;
} }
.mx_DateSeparator > date { .mx_DateSeparator > div {
margin: 0 25px; margin: 0 25px;
flex: 0 0 auto; flex: 0 0 auto;
} }

2
res/css/views/messages/_RoomAvatarEvent.scss
View file

@ -23,4 +23,4 @@ limitations under the License.
display: inline; display: inline;
position: relative; position: relative;
top: 5px; top: 5px;
} }

2
res/css/views/room_settings/_ColorSettings.scss
View file

@ -28,7 +28,7 @@ limitations under the License.
position: absolute; position: absolute;
left: 10px; left: 10px;
top: 4px; top: 4px;
cursor: default ! important; cursor: default !important;
} }
.mx_ColorSettings_roomColorPrimary { .mx_ColorSettings_roomColorPrimary {

18
res/css/views/rooms/_AppsDrawer.scss
View file

@ -42,7 +42,6 @@ $AppsDrawerBodyHeight: 273px;
.mx_AddWidget_button { .mx_AddWidget_button {
order: 2; order: 2;
cursor: pointer; cursor: pointer;
padding-right: 12px;
padding: 0; padding: 0;
margin: 5px auto 5px auto; margin: 5px auto 5px auto;
color: $accent-color; color: $accent-color;
@ -198,7 +197,7 @@ $AppsDrawerBodyHeight: 273px;
border-radius: 2px; border-radius: 2px;
} }
.mx_AppTileBody{ .mx_AppTileBody {
height: $AppsDrawerBodyHeight; height: $AppsDrawerBodyHeight;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
@ -234,7 +233,7 @@ $AppsDrawerBodyHeight: 273px;
background-color: $lightbox-bg-color; background-color: $lightbox-bg-color;
border: 1px solid rgba(0, 0, 0, 0); border: 1px solid rgba(0, 0, 0, 0);
width: 200px; width: 200px;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
transition: 0.3s; transition: 0.3s;
border-radius: 3px; border-radius: 3px;
margin: 5px; margin: 5px;
@ -248,7 +247,7 @@ $AppsDrawerBodyHeight: 273px;
.mx_AppIconTile:hover { .mx_AppIconTile:hover {
border: 1px solid $accent-color; border: 1px solid $accent-color;
box-shadow: 0 0 10px 5px rgba(200,200,200,0.5); box-shadow: 0 0 10px 5px rgba(200, 200, 200, 0.5);
} }
.mx_AppIconTile_content { .mx_AppIconTile_content {
@ -270,9 +269,8 @@ $AppsDrawerBodyHeight: 273px;
.mx_AppIconTile_image { .mx_AppIconTile_image {
padding: 10px; padding: 10px;
width: 75%; max-width: 100px;
max-width:100px; max-height: 100px;
max-height:100px;
width: auto; width: auto;
height: auto; height: auto;
} }
@ -361,11 +359,11 @@ form.mx_Custom_Widget_Form div {
} }
@keyframes mx_AppLoading_spinner_fadeIn_animation { @keyframes mx_AppLoading_spinner_fadeIn_animation {
from { opacity: 0 } from { opacity: 0; }
to { opacity: 1 } to { opacity: 1; }
} }
.mx_AppLoading iframe { .mx_AppLoading iframe {
display: none; display: none;
} }

45
res/css/views/rooms/_Autocomplete.scss
View file

@ -8,18 +8,13 @@
border-bottom: none; border-bottom: none;
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
max-height: 50vh; max-height: 50vh;
overflow: auto overflow: auto;
} }
.mx_Autocomplete_ProviderSection { .mx_Autocomplete_ProviderSection {
border-bottom: 1px solid $primary-hairline-color; border-bottom: 1px solid $primary-hairline-color;
} }
.mx_Autocomplete_Completion_container_pill {
margin: 12px;
display: flex;
}
/* a "block" completion takes up a whole line */ /* a "block" completion takes up a whole line */
.mx_Autocomplete_Completion_block { .mx_Autocomplete_Completion_block {
height: 34px; height: 34px;
@ -32,7 +27,7 @@
} }
.mx_Autocomplete_Completion_block * { .mx_Autocomplete_Completion_block * {
margin: 0 3px; margin: 0 3px;
} }
.mx_Autocomplete_Completion_pill { .mx_Autocomplete_Completion_pill {
@ -50,11 +45,27 @@
margin: 0 3px; 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_container_truncate {
.mx_Autocomplete_Completion_title, .mx_Autocomplete_Completion_title,
.mx_Autocomplete_Completion_subtitle, .mx_Autocomplete_Completion_subtitle,
.mx_Autocomplete_Completion_description { .mx_Autocomplete_Completion_description {
/* Ellipsis for long names/subtitles/descriptions*/ /* Ellipsis for long names/subtitles/descriptions */
max-width: 150px; max-width: 150px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
@ -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.selected,
.mx_Autocomplete_Completion:hover { .mx_Autocomplete_Completion:hover {
background: $selected-color; background: $selected-color;
@ -81,14 +85,3 @@
font-weight: 400; font-weight: 400;
opacity: 0.4; opacity: 0.4;
} }
/* styling for common completion elements */
.mx_Autocomplete_Completion_subtitle {
font-style: italic;
flex: 1;
}
.mx_Autocomplete_Completion_description {
color: gray;
}

17
res/css/views/rooms/_EntityTile.scss
View file

@ -85,10 +85,6 @@ limitations under the License.
overflow: hidden; overflow: hidden;
} }
.mx_EntityTile:not(.mx_EntityTile_noHover):hover .mx_EntityTile_name {
font-size: 13px;
}
.mx_EntityTile_ellipsis .mx_EntityTile_name { .mx_EntityTile_ellipsis .mx_EntityTile_name {
font-style: italic; font-style: italic;
color: $primary-fg-color; color: $primary-fg-color;
@ -102,23 +98,24 @@ limitations under the License.
.mx_EntityTile_unavailable .mx_EntityTile_avatar, .mx_EntityTile_unavailable .mx_EntityTile_avatar,
.mx_EntityTile_unavailable .mx_EntityTile_name, .mx_EntityTile_unavailable .mx_EntityTile_name,
.mx_EntityTile_offline_beenactive .mx_EntityTile_avatar, .mx_EntityTile_offline_beenactive .mx_EntityTile_avatar,
.mx_EntityTile_offline_beenactive .mx_EntityTile_name .mx_EntityTile_offline_beenactive .mx_EntityTile_name {
{
opacity: 0.5; opacity: 0.5;
} }
.mx_EntityTile_offline_neveractive .mx_EntityTile_avatar, .mx_EntityTile_offline_neveractive .mx_EntityTile_avatar,
.mx_EntityTile_offline_neveractive .mx_EntityTile_name .mx_EntityTile_offline_neveractive .mx_EntityTile_name {
{
opacity: 0.25; opacity: 0.25;
} }
.mx_EntityTile_unknown .mx_EntityTile_avatar, .mx_EntityTile_unknown .mx_EntityTile_avatar,
.mx_EntityTile_unknown .mx_EntityTile_name .mx_EntityTile_unknown .mx_EntityTile_name {
{
opacity: 0.25; opacity: 0.25;
} }
.mx_EntityTile:not(.mx_EntityTile_noHover):hover .mx_EntityTile_name {
font-size: 13px;
}
.mx_EntityTile_subtext { .mx_EntityTile_subtext {
font-size: 11px; font-size: 11px;
opacity: 0.5; opacity: 0.5;

210
res/css/views/rooms/_EventTile.scss
View file

@ -122,8 +122,29 @@ limitations under the License.
/* HACK to override line-height which is already marked important elsewhere */ /* HACK to override line-height which is already marked important elsewhere */
.mx_EventTile_bigEmoji.mx_EventTile_bigEmoji { .mx_EventTile_bigEmoji.mx_EventTile_bigEmoji {
font-size: 48px ! important; font-size: 48px !important;
line-height: 57px ! important; 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. /* this is used for the tile for the event which is selected via the URL.
@ -135,9 +156,17 @@ limitations under the License.
background-color: $event-selected-color; 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:hover .mx_EventTile_line,
.mx_EventTile.mx_EventTile_actionBarFocused .mx_EventTile_line .mx_EventTile.mx_EventTile_actionBarFocused .mx_EventTile_line {
{
background-color: $event-selected-color; background-color: $event-selected-color;
} }
@ -156,7 +185,7 @@ limitations under the License.
} }
.mx_EventTile_encrypting { .mx_EventTile_encrypting {
color: $event-encrypting-color ! important; color: $event-encrypting-color !important;
} }
.mx_EventTile_sending { .mx_EventTile_sending {
@ -167,14 +196,6 @@ limitations under the License.
.mx_EventTile_sending .mx_RoomPill { .mx_EventTile_sending .mx_RoomPill {
opacity: 0.5; 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 { .mx_EventTile_notSent {
color: $event-notsent-color; color: $event-notsent-color;
@ -185,28 +206,27 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
--lozenge-color: $event-redacted-fg-color; --lozenge-color: $event-redacted-fg-color;
--lozenge-border-color: $event-redacted-border-color; --lozenge-border-color: $event-redacted-border-color;
display: block; display: block;
width: 100%;
height: 22px; height: 22px;
width: 250px; width: 250px;
border-radius: 11px; border-radius: 11px;
background: repeating-linear-gradient( background:
-45deg, repeating-linear-gradient(
var(--lozenge-color), -45deg,
var(--lozenge-color) 3px, var(--lozenge-color),
transparent 3px, var(--lozenge-color) 3px,
transparent 6px transparent 3px,
); transparent 6px
);
box-shadow: 0px 0px 3px var(--lozenge-border-color) inset; box-shadow: 0px 0px 3px var(--lozenge-border-color) inset;
} }
.mx_EventTile_highlight, .mx_EventTile_sending.mx_EventTile_redacted .mx_UnknownBody {
.mx_EventTile_highlight .markdown-body opacity: 0.4;
{ }
color: $event-highlight-fg-color;
.mx_EventTile_line { div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
background-color: $event-highlight-bg-color; --lozenge-color: $event-notsent-color;
} --lozenge-border-color: $event-notsent-color;
} }
.mx_EventTile_contextual { .mx_EventTile_contextual {
@ -231,27 +251,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
text-decoration: none; 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 { .mx_EventTile_readAvatars {
position: relative; position: relative;
display: inline-block; display: inline-block;
@ -297,11 +296,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
overflow-y: hidden; overflow-y: hidden;
} }
/* End to end encryption stuff */
.mx_EventTile:hover .mx_EventTile_e2eIcon {
opacity: 1;
}
.mx_EventTile_e2eIcon { .mx_EventTile_e2eIcon {
display: block; display: block;
position: absolute; position: absolute;
@ -368,22 +362,31 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
padding-left: 5px; 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_verified .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line { .mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
padding-left: 60px; 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_verified.mx_EventTile_info .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line { .mx_EventTile:hover.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line {
padding-left: 78px; padding-left: 78px;
} }
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line { /* End to end encryption stuff */
border-left: $e2e-verified-color 5px solid; .mx_EventTile:hover .mx_EventTile_e2eIcon {
} opacity: 1;
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
border-left: $e2e-unverified-color 5px solid;
} }
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies) // Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
@ -393,12 +396,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
width: auto; 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) // 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_verified .mx_EventTile_line > .mx_EventTile_e2eIcon,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line > .mx_EventTile_e2eIcon { .mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line > .mx_EventTile_e2eIcon {
@ -417,35 +414,40 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
/* Various markdown overrides */ /* Various markdown overrides */
.mx_EventTile_body pre {
border: 1px solid transparent;
}
.mx_EventTile_content .markdown-body { .mx_EventTile_content .markdown-body {
font-family: inherit ! important; font-family: inherit !important;
white-space: normal ! important; white-space: normal !important;
line-height: inherit ! important; line-height: inherit !important;
color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks) color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks)
font-size: 14px; 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 { pre, code {
font-family: $monospace-font-family ! important; font-family: $monospace-font-family !important;
// deliberate constants as we're behind an invert filter // deliberate constants as we're behind an invert filter
color: #333; 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 { .mx_EventTile_pre_container {
@ -466,17 +468,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
background-image: url($copy-button-url); background-image: url($copy-button-url);
} }
.mx_EventTile_body pre { .mx_EventTile_body .mx_EventTile_pre_container:hover .mx_EventTile_copyButton {
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; visibility: visible;
} }
@ -485,19 +477,17 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
.mx_EventTile_content .markdown-body h3, .mx_EventTile_content .markdown-body h3,
.mx_EventTile_content .markdown-body h4, .mx_EventTile_content .markdown-body h4,
.mx_EventTile_content .markdown-body h5, .mx_EventTile_content .markdown-body h5,
.mx_EventTile_content .markdown-body h6 .mx_EventTile_content .markdown-body h6 {
{ font-family: inherit !important;
font-family: inherit ! important;
color: inherit; color: inherit;
} }
/* Make h1 and h2 the same size as h3. */ /* Make h1 and h2 the same size as h3. */
.mx_EventTile_content .markdown-body h1, .mx_EventTile_content .markdown-body h1,
.mx_EventTile_content .markdown-body h2 .mx_EventTile_content .markdown-body h2 {
{
font-size: 1.5em; font-size: 1.5em;
border-bottom: none ! important; // override GFM border-bottom: none !important; // override GFM
} }
.mx_EventTile_content .markdown-body a { .mx_EventTile_content .markdown-body a {
@ -506,7 +496,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
} }
.mx_EventTile_content .markdown-body .hljs { .mx_EventTile_content .markdown-body .hljs {
display: inline ! important; display: inline !important;
} }
/* /*
@ -523,6 +513,9 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
/* end of overrides */ /* end of overrides */
/* Ordering this block by specificity would require breaking it up into several
chunks, which seems like it would be more confusing to read. */
/* stylelint-disable no-descending-specificity */
.mx_MatrixChat_useCompactLayout { .mx_MatrixChat_useCompactLayout {
.mx_EventTile { .mx_EventTile {
padding-top: 4px; padding-top: 4px;
@ -595,8 +588,9 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
} }
.mx_EventTile_content .markdown-body { .mx_EventTile_content .markdown-body {
p, ul, ol, dl, blockquote, pre, table { p, ul, ol, dl, blockquote, pre, table {
margin-bottom: 4px; // 1/4 of the non-compact margin-bottom margin-bottom: 4px; // 1/4 of the non-compact margin-bottom
} }
} }
} }
/* stylelint-enable no-descending-specificity */

2
res/css/views/rooms/_JumpToBottomButton.scss
View file

@ -55,7 +55,7 @@ limitations under the License.
cursor: pointer; cursor: pointer;
} }
.mx_JumpToBottomButton_scrollDown:before { .mx_JumpToBottomButton_scrollDown::before {
content: ""; content: "";
position: absolute; position: absolute;
top: 0; top: 0;

5
res/css/views/rooms/_MemberInfo.scss
View file

@ -82,9 +82,6 @@ limitations under the License.
display: block; display: block;
} }
.mx_MemberInfo_avatar .mx_BaseAvatar {
}
.mx_MemberInfo_avatar .mx_BaseAvatar.mx_BaseAvatar_image { .mx_MemberInfo_avatar .mx_BaseAvatar.mx_BaseAvatar_image {
cursor: zoom-in; cursor: zoom-in;
} }
@ -126,7 +123,7 @@ limitations under the License.
} }
.mx_MemberInfo_createRoom_label { .mx_MemberInfo_createRoom_label {
width: initial ! important; width: initial !important;
cursor: pointer; cursor: pointer;
} }

3
res/css/views/rooms/_MemberList.scss
View file

@ -88,7 +88,7 @@ limitations under the License.
} }
.mx_MemberList_invite.mx_AccessibleButton_disabled { .mx_MemberList_invite.mx_AccessibleButton_disabled {
background-color: $greyed-fg-color;; background-color: $greyed-fg-color;
cursor: not-allowed; cursor: not-allowed;
} }
@ -97,5 +97,4 @@ limitations under the License.
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center left; background-position: center left;
padding-left: 25px; padding-left: 25px;
} }

11
res/css/views/rooms/_MessageComposer.scss
View file

@ -122,16 +122,15 @@ limitations under the License.
// FIXME: rather unpleasant hack to get rid of <p/> margins. // FIXME: rather unpleasant hack to get rid of <p/> margins.
// really we should be mixing in markdown-body from gfm.css instead // really we should be mixing in markdown-body from gfm.css instead
.mx_MessageComposer_editor > :first-child { .mx_MessageComposer_editor > :first-child {
margin-top: 0 ! important; margin-top: 0 !important;
} }
.mx_MessageComposer_editor > :last-child { .mx_MessageComposer_editor > :last-child {
margin-bottom: 0 ! important; margin-bottom: 0 !important;
} }
@keyframes visualbell @keyframes visualbell {
{ from { background-color: #faa; }
from { background-color: #faa } to { background-color: $primary-bg-color; }
to { background-color: $primary-bg-color }
} }
.mx_MessageComposer_input_error { .mx_MessageComposer_input_error {

14
res/css/views/rooms/_PinnedEventTile.scss
View file

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

2
res/css/views/rooms/_PresenceLabel.scss
View file

@ -17,4 +17,4 @@ limitations under the License.
.mx_PresenceLabel { .mx_PresenceLabel {
font-size: 11px; font-size: 11px;
opacity: 0.5; opacity: 0.5;
} }

2
res/css/views/rooms/_ReplyPreview.scss
View file

@ -24,7 +24,7 @@ limitations under the License.
border-bottom: none; border-bottom: none;
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
max-height: 50vh; max-height: 50vh;
overflow: auto overflow: auto;
} }
.mx_ReplyPreview_section { .mx_ReplyPreview_section {

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

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

9
res/css/views/rooms/_RoomHeader.scss
View file

@ -22,7 +22,6 @@ limitations under the License.
.mx_RoomHeader_wrapper { .mx_RoomHeader_wrapper {
margin: auto; margin: auto;
height: 52px; height: 52px;
align-items: center;
display: flex; display: flex;
align-items: center; align-items: center;
min-width: 0; min-width: 0;
@ -107,7 +106,7 @@ limitations under the License.
} }
.mx_RoomHeader_settingsHint { .mx_RoomHeader_settingsHint {
color: $settings-grey-fg-color ! important; color: $settings-grey-fg-color !important;
} }
.mx_RoomHeader_searchStatus { .mx_RoomHeader_searchStatus {
@ -134,17 +133,17 @@ limitations under the License.
} }
.mx_RoomHeader_placeholder { .mx_RoomHeader_placeholder {
color: $settings-grey-fg-color ! important; color: $settings-grey-fg-color !important;
} }
.mx_RoomHeader_editable { .mx_RoomHeader_editable {
border-bottom: 1px solid $strong-input-border-color ! important; border-bottom: 1px solid $strong-input-border-color !important;
min-width: 150px; min-width: 150px;
cursor: text; cursor: text;
} }
.mx_RoomHeader_editable:focus { .mx_RoomHeader_editable:focus {
border-bottom: 1px solid $accent-color ! important; border-bottom: 1px solid $accent-color !important;
outline: none; outline: none;
box-shadow: none; box-shadow: none;
} }

2
res/css/views/rooms/_RoomList.scss
View file

@ -32,7 +32,7 @@ limitations under the License.
} }
/* hide resize handles next to collapsed / empty sublists */ /* hide resize handles next to collapsed / empty sublists */
.mx_RoomList .mx_RoomSubList:not(.mx_RoomSubList_nonEmpty) + .mx_ResizeHandle { .mx_RoomList .mx_RoomSubList:not(.mx_RoomSubList_nonEmpty) + .mx_ResizeHandle {
display: none; display: none;
} }

8
res/css/views/rooms/_RoomPreviewBar.scss
View file

@ -80,7 +80,7 @@ limitations under the License.
flex-direction: row; flex-direction: row;
padding: 3px 8px; padding: 3px 8px;
&>* { & > * {
margin-left: 12px; margin-left: 12px;
} }
} }
@ -91,7 +91,7 @@ limitations under the License.
display: flex; display: flex;
flex-direction: column; flex-direction: column;
&>* { & > * {
margin: 4px; margin: 4px;
} }
} }
@ -109,7 +109,7 @@ limitations under the License.
.mx_RoomPreviewBar_message { .mx_RoomPreviewBar_message {
flex-direction: column; flex-direction: column;
&>* { & > * {
margin: 5px 0 20px 0; margin: 5px 0 20px 0;
} }
} }
@ -120,7 +120,7 @@ limitations under the License.
padding: 7px 50px;//extra wide padding: 7px 50px;//extra wide
} }
&>* { & > * {
margin-top: 12px; margin-top: 12px;
} }
} }

43
res/css/views/rooms/_RoomTile.scss
View file

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

4
res/css/views/rooms/_TopUnreadMessagesBar.scss
View file

@ -24,7 +24,7 @@ limitations under the License.
width: 38px; width: 38px;
} }
.mx_TopUnreadMessagesBar:after { .mx_TopUnreadMessagesBar::after {
content: "·"; content: "·";
position: absolute; position: absolute;
top: -8px; top: -8px;
@ -49,7 +49,7 @@ limitations under the License.
cursor: pointer; cursor: pointer;
} }
.mx_TopUnreadMessagesBar_scrollUp:before { .mx_TopUnreadMessagesBar_scrollUp::before {
content: ""; content: "";
position: absolute; position: absolute;
width: 38px; width: 38px;

2
res/css/views/settings/_DevicesPanel.scss
View file

@ -48,4 +48,4 @@ limitations under the License.
.mx_DevicesPanel_myDevice { .mx_DevicesPanel_myDevice {
font-weight: bold; font-weight: bold;
} }

2
res/css/views/settings/_IntegrationsManager.scss
View file

@ -41,4 +41,4 @@ limitations under the License.
.mx_IntegrationsManager_error h3 { .mx_IntegrationsManager_error h3 {
color: $warning-color; color: $warning-color;
} }

8
res/css/views/settings/_Notifications.scss
View file

@ -14,8 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_UserNotifSettings_tableRow .mx_UserNotifSettings_tableRow {
{
display: table-row; display: table-row;
} }
@ -26,8 +25,7 @@ limitations under the License.
width: 16px; width: 16px;
} }
.mx_UserNotifSettings_labelCell .mx_UserNotifSettings_labelCell {
{
padding-bottom: 8px; padding-bottom: 8px;
width: 400px; width: 400px;
display: table-cell; display: table-cell;
@ -93,4 +91,4 @@ limitations under the License.
color: white; color: white;
border: $warning-color; border: $warning-color;
background-color: $warning-color; background-color: $warning-color;
} }

4
res/css/views/settings/_ProfileSettings.scss
View file

@ -105,7 +105,7 @@ limitations under the License.
margin: auto; margin: auto;
} }
.mx_ProfileSettings_avatarOverlayImg:before { .mx_ProfileSettings_avatarOverlayImg::before {
background-color: $settings-profile-overlay-placeholder-fg-color; background-color: $settings-profile-overlay-placeholder-fg-color;
mask: url("$(res)/img/feather-customised/upload.svg"); mask: url("$(res)/img/feather-customised/upload.svg");
mask-repeat: no-repeat; mask-repeat: no-repeat;
@ -119,7 +119,7 @@ limitations under the License.
right: 0; right: 0;
} }
.mx_ProfileSettings_avatar:hover .mx_ProfileSettings_avatarOverlayImg:before { .mx_ProfileSettings_avatar:hover .mx_ProfileSettings_avatarOverlayImg::before {
background-color: $settings-profile-overlay-fg-color !important; background-color: $settings-profile-overlay-fg-color !important;
} }

2
res/css/views/settings/tabs/_SettingsTab.scss
View file

@ -75,4 +75,4 @@ limitations under the License.
.mx_SettingsTab a { .mx_SettingsTab a {
color: $accent-color-alt; color: $accent-color-alt;
} }

2
res/css/views/settings/tabs/room/_RolesRoomSettingsTab.scss
View file

@ -21,4 +21,4 @@ limitations under the License.
.mx_RolesRoomSettingsTab_unbanBtn { .mx_RolesRoomSettingsTab_unbanBtn {
margin-right: 10px; margin-right: 10px;
margin-bottom: 5px; margin-bottom: 5px;
} }

2
res/css/views/settings/tabs/room/_SecurityRoomSettingsTab.scss
View file

@ -31,4 +31,4 @@ limitations under the License.
.mx_SecurityRoomSettingsTab_encryptionSection { .mx_SecurityRoomSettingsTab_encryptionSection {
margin-bottom: 25px; margin-bottom: 25px;
} }

2
res/css/views/settings/tabs/user/_HelpUserSettingsTab.scss
View file

@ -21,4 +21,4 @@ limitations under the License.
.mx_HelpUserSettingsTab span.mx_AccessibleButton { .mx_HelpUserSettingsTab span.mx_AccessibleButton {
word-break: break-word; word-break: break-word;
} }

2
res/css/views/settings/tabs/user/_NotificationUserSettingsTab.scss
View file

@ -16,4 +16,4 @@ limitations under the License.
.mx_NotificationUserSettingsTab .mx_SettingsTab_heading { .mx_NotificationUserSettingsTab .mx_SettingsTab_heading {
margin-bottom: 10px; // Give some spacing between the title and the first elements margin-bottom: 10px; // Give some spacing between the title and the first elements
} }

2
res/css/views/settings/tabs/user/_SecurityUserSettingsTab.scss
View file

@ -54,4 +54,4 @@ limitations under the License.
.mx_SecurityUserSettingsTab_ignoredUser .mx_AccessibleButton { .mx_SecurityUserSettingsTab_ignoredUser .mx_AccessibleButton {
margin-right: 10px; margin-right: 10px;
} }

2
res/css/views/voip/_CallView.scss
View file

@ -22,4 +22,4 @@ limitations under the License.
padding: 6px; padding: 6px;
font-weight: bold; font-weight: bold;
font-size: 13px; font-size: 13px;
} }

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

@ -56,6 +56,6 @@ export default class DateSeparator extends React.Component {
} }
render() { 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>;
} }
} }

30
yarn.lock
View file

@ -2295,6 +2295,11 @@ crypto-browserify@^3.11.0:
randombytes "^2.0.0" randombytes "^2.0.0"
randomfill "^1.0.3" randomfill "^1.0.3"
cssesc@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
currently-unhandled@^0.4.1: currently-unhandled@^0.4.1:
version "0.4.1" version "0.4.1"
resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea" resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@ -5977,6 +5982,15 @@ postcss-selector-parser@^3.1.0:
indexes-of "^1.0.1" indexes-of "^1.0.1"
uniq "^1.0.1" uniq "^1.0.1"
postcss-selector-parser@^6.0.2:
version "6.0.2"
resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.2.tgz#934cf799d016c83411859e09dcecade01286ec5c"
integrity sha512-36P2QR59jDTOAiIkqEprfJDsoNrvwFei3eCqKd1Y0tUsBimsq39BLp7RD+JWny3WgB1zGhJX8XVePwm9k4wdBg==
dependencies:
cssesc "^3.0.0"
indexes-of "^1.0.1"
uniq "^1.0.1"
postcss-syntax@^0.36.2: postcss-syntax@^0.36.2:
version "0.36.2" version "0.36.2"
resolved "https://registry.yarnpkg.com/postcss-syntax/-/postcss-syntax-0.36.2.tgz#f08578c7d95834574e5593a82dfbfa8afae3b51c" resolved "https://registry.yarnpkg.com/postcss-syntax/-/postcss-syntax-0.36.2.tgz#f08578c7d95834574e5593a82dfbfa8afae3b51c"
@ -5987,6 +6001,11 @@ postcss-value-parser@^3.3.0, postcss-value-parser@^3.3.1:
resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz#9ff822547e2893213cf1c30efa51ac5fd1ba8281" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz#9ff822547e2893213cf1c30efa51ac5fd1ba8281"
integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ== integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==
postcss-value-parser@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.0.0.tgz#99a983d365f7b2ad8d0f9b8c3094926eab4b936d"
integrity sha512-ESPktioptiSUchCKgggAkzdmkgzKfmp0EU8jXH+5kbIUB+unr0Y4CY9SRMvibuvYUBjNh1ACLbxqYNpdTQOteQ==
postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.13, postcss@^7.0.14, postcss@^7.0.16, postcss@^7.0.2, postcss@^7.0.5, postcss@^7.0.7: postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.13, postcss@^7.0.14, postcss@^7.0.16, postcss@^7.0.2, postcss@^7.0.5, postcss@^7.0.7:
version "7.0.17" version "7.0.17"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.17.tgz#4da1bdff5322d4a0acaab4d87f3e782436bad31f" resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.17.tgz#4da1bdff5322d4a0acaab4d87f3e782436bad31f"
@ -7364,6 +7383,17 @@ stylelint-config-standard@^18.2.0:
dependencies: dependencies:
stylelint-config-recommended "^2.2.0" stylelint-config-recommended "^2.2.0"
stylelint-scss@^3.9.0:
version "3.9.0"
resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-3.9.0.tgz#45e5e42c28c180ec410ac95ab70fb0b49688cbb6"
integrity sha512-6uB2TPfIA/HybB7gERPFaBWHDBWhoLSjKoG0rQtsQ4LNOvWzJ205Q8JA2x9zZSXOJXatonlT9aGA1tyNBJrmcg==
dependencies:
lodash "^4.17.11"
postcss-media-query-parser "^0.2.3"
postcss-resolve-nested-selector "^0.1.1"
postcss-selector-parser "^6.0.2"
postcss-value-parser "^4.0.0"
stylelint@^9.10.1: stylelint@^9.10.1:
version "9.10.1" version "9.10.1"
resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-9.10.1.tgz#5f0ee3701461dff1d68284e1386efe8f0677a75d" resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-9.10.1.tgz#5f0ee3701461dff1d68284e1386efe8f0677a75d"