matrix/matrix-react-sdk
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-08-09 08:42:50 +03:00
Code Activity

Define SCSS variable for resource dir

Browse Source 
Adds a `$res` SCSS variable set to the path from the root SCSS file to the `res`
directory.

This is a different base path than previously used in CSS URLs (it goes up 3
directories instead of 2), because Webpack will now be resolving images relative
to the root SCSS file, so the path corresponds to a source tree location,
instead of a path in the build output tree.

Defining this variable has two main goals:

* URLs are a bit easier to read
* The path can be overridden, which is needed for external (riot-web) themes
This commit is contained in:
J. Ryan Stinnett
2018-12-31 17:22:40 -06:00
parent 7678b9c43b
commit b2387f4cff
23 changed files with 48 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
res/css/structures/_MyGroups.scss
View File

@@ -54,7 +54,7 @@ limitations under the License.
&:before {
background-color: $accent-fg-color;
mask: url('../../img/icons-create-room.svg');
mask: url('$(res)/img/icons-create-room.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: 80%;

4
res/css/structures/_RoomSubList.scss
View File

@@ -105,7 +105,7 @@ limitations under the License.
.mx_RoomSubList_addRoom {
background-color: $roomheader-addroom-color;
color: $roomsublist-background;
background-image: url('../../img/icons-room-add.svg');
background-image: url('$(res)/img/icons-room-add.svg');
background-repeat: no-repeat;
background-position: center;
border-radius: 10px; // 16/2 + 2 padding
@@ -120,7 +120,7 @@ limitations under the License.
.mx_RoomSubList_chevron {
pointer-events: none;
background-image: url('../../img/topleft-chevron.svg');
background-image: url('$(res)/img/topleft-chevron.svg');
background-repeat: no-repeat;
transition: transform 0.2s ease-in;
width: 10px;

4
res/css/structures/_RoomView.scss
View File

@@ -116,7 +116,7 @@ limitations under the License.
.mx_RoomView_messagePanelSearchSpinner {
flex: 1;
background-image: url('../../img/typing-indicator-2x.gif');
background-image: url('$(res)/img/typing-indicator-2x.gif');
background-position: center 367px;
background-size: 25px;
background-repeat: no-repeat;
@@ -125,7 +125,7 @@ limitations under the License.
.mx_RoomView_messagePanelSearchSpinner:before {
background-color: $greyed-fg-color;
mask: url('../../img/feather-icons/search-input.svg');
mask: url('$(res)/img/feather-icons/search-input.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: 50px;

2
res/css/structures/_SearchBox.scss
View File

@@ -16,7 +16,7 @@ limitations under the License.
.mx_SearchBox_closeButton {
cursor: pointer;
background-image: url('../../img/icons-close.svg');
background-image: url('$(res)/img/icons-close.svg');
background-repeat: no-repeat;
width: 16px;
height: 16px;

4
res/css/structures/_TagPanel.scss
View File

@@ -130,12 +130,12 @@ limitations under the License.
}
.mx_TagPanel_groupsButton > .mx_GroupsButton:before {
mask: url('../../img/feather-icons/users.svg');
mask: url('$(res)/img/feather-icons/users.svg');
mask-position: center 11px;
}
.mx_TagPanel_groupsButton > .mx_TagPanel_report:before {
mask: url('../../img/feather-icons/life-buoy.svg');
mask: url('$(res)/img/feather-icons/life-buoy.svg');
mask-position: center 9px;
}