sorb/ThreadNet-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

Use variables for the rem values.

Browse Source 
It's become obvious that these random floating points everywhere
are unwieldy. Now they're all in one place with some fairly logical
variable names which will help out in design->implementation phase.
This commit is contained in:
Jorik Schellekens
2020-03-31 15:26:23 +01:00
parent da34e6241d
commit 6cf9166c4a
97 changed files with 280 additions and 227 deletions
Download Patch File Download Diff File Expand all files Collapse all files
res/css/views/dialogs/_AddressPickerDialog.scss
+2 -2
View File
@@ -28,7 +28,7 @@ limitations under the License.
.mx_AddressPickerDialog_input,
.mx_AddressPickerDialog_input:focus {
height: 26px;
font-size: 0.933rem;
font-size: $font-14px;
font-family: $font-family;
padding-left: 12px;
padding-right: 12px;
@@ -50,7 +50,7 @@ limitations under the License.
.mx_AddressPickerDialog_inputContainer {
border-radius: 3px;
border: solid 1px $input-border-color;
line-height: 2.400rem;
line-height: $font-36px;
padding-left: 4px;
padding-right: 4px;
padding-top: 1px;
res/css/views/dialogs/_ConfirmUserActionDialog.scss
+4 -4
View File
@@ -26,22 +26,22 @@ limitations under the License.
}
.mx_ConfirmUserActionDialog_name {
font-size: 1.2rem;
font-size: $font-18px;
}
.mx_ConfirmUserActionDialog_userId {
font-size: 0.867rem;
font-size: $font-13px;
}
.mx_ConfirmUserActionDialog_reasonField {
font-family: $font-family;
font-size: 0.933rem;
font-size: $font-14px;
color: $primary-fg-color;
background-color: $primary-bg-color;
border-radius: 3px;
border: solid 1px $input-border-color;
line-height: 2.400rem;
line-height: $font-36px;
padding-left: 16px;
padding-right: 16px;
padding-top: 1px;
res/css/views/dialogs/_CreateGroupDialog.scss
+2 -2
View File
@@ -25,7 +25,7 @@ limitations under the License.
}
.mx_CreateGroupDialog_input {
font-size: 1rem;
font-size: $font-15px;
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;
@@ -44,7 +44,7 @@ limitations under the License.
.mx_CreateGroupDialog_prefix,
.mx_CreateGroupDialog_suffix {
padding: 0px 5px;
line-height: 2.467rem;
line-height: $font-37px;
background-color: $input-darker-bg-color;
border: 1px solid $input-border-color;
text-align: center;
res/css/views/dialogs/_CreateRoomDialog.scss
+1 -1
View File
@@ -49,7 +49,7 @@ limitations under the License.
}
.mx_CreateRoomDialog_input {
font-size: 1rem;
font-size: $font-15px;
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;
res/css/views/dialogs/_DevtoolsDialog.scss
+2 -2
View File
@@ -68,11 +68,11 @@ limitations under the License.
width: 240px;
color: $input-fg-color;
font-family: $font-family;
font-size: 1.067rem;
font-size: $font-16px;
}
.mx_DevTools_textarea {
font-size: 0.8rem;
font-size: $font-12px;
max-width: 684px;
min-height: 250px;
padding: 10px;
res/css/views/dialogs/_InviteDialog.scss
+9 -9
View File
@@ -40,8 +40,8 @@ limitations under the License.
textarea,
textarea:focus {
height: 34px;
line-height: 2.267rem;
font-size: 0.933rem;
line-height: $font-34px;
font-size: $font-14px;
padding-left: 12px;
margin: 0 !important;
border: 0 !important;
@@ -65,7 +65,7 @@ limitations under the License.
min-width: 48px;
margin-left: 10px;
height: 25px;
line-height: 1.667rem;
line-height: $font-25px;
}
.mx_InviteDialog_buttonAndSpinner {
@@ -84,7 +84,7 @@ limitations under the License.
padding-bottom: 10px;
h3 {
font-size: 0.8rem;
font-size: $font-12px;
color: $muted-fg-color;
font-weight: bold;
text-transform: uppercase;
@@ -143,23 +143,23 @@ limitations under the License.
.mx_InviteDialog_roomTile_name {
font-weight: 600;
font-size: 0.933rem;
font-size: $font-14px;
color: $primary-fg-color;
margin-left: 7px;
}
.mx_InviteDialog_roomTile_userId {
font-size: 0.8rem;
font-size: $font-12px;
color: $muted-fg-color;
margin-left: 7px;
}
.mx_InviteDialog_roomTile_time {
text-align: right;
font-size: 0.8rem;
font-size: $font-12px;
color: $muted-fg-color;
float: right;
line-height: 2.400rem; // Height of the avatar to keep the time vertically aligned
line-height: $font-36px; // Height of the avatar to keep the time vertically aligned
}
.mx_InviteDialog_roomTile_highlight {
@@ -176,7 +176,7 @@ limitations under the License.
border-radius: 12px;
display: inline-block;
height: 24px;
line-height: 1.600rem;
line-height: $font-24px;
padding-left: 8px;
padding-right: 8px;
color: #ffffff; // this is fine without a var because it's for both themes
res/css/views/dialogs/_MessageEditHistoryDialog.scss
+2 -2
View File
@@ -35,7 +35,7 @@ limitations under the License.
.mx_MessageEditHistoryDialog_edits {
list-style-type: none;
font-size: 0.933rem;
font-size: $font-14px;
padding: 0;
color: $primary-fg-color;
@@ -60,7 +60,7 @@ limitations under the License.
}
.mx_MessageActionBar .mx_AccessibleButton {
font-size: 0.667rem;
font-size: $font-10px;
padding: 0 8px;
}
}
res/css/views/dialogs/_NewSessionReviewDialog.scss
+1 -1
View File
@@ -32,6 +32,6 @@ limitations under the License.
}
.mx_NewSessionReviewDialog_deviceID {
font-size: 0.8rem;
font-size: $font-12px;
color: $notice-secondary-color;
}
res/css/views/dialogs/_SetEmailDialog.scss
+1 -1
View File
@@ -20,7 +20,7 @@ limitations under the License.
padding: 9px;
color: $input-fg-color;
background-color: $primary-bg-color;
font-size: 1rem;
font-size: $font-15px;
width: 100%;
max-width: 280px;
margin-bottom: 10px;
res/css/views/dialogs/_SetMxIdDialog.scss
+1 -1
View File
@@ -29,7 +29,7 @@ limitations under the License.
padding: 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
font-size: 1rem;
font-size: $font-15px;
width: 100%;
max-width: 280px;
}
res/css/views/dialogs/_SetPasswordDialog.scss
+1 -1
View File
@@ -20,7 +20,7 @@ limitations under the License.
padding: 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
font-size: 1rem;
font-size: $font-15px;
max-width: 280px;
margin-bottom: 10px;
}
res/css/views/dialogs/_TermsDialog.scss
+1 -1
View File
@@ -31,7 +31,7 @@ limitations under the License.
}
.mx_TermsDialog_termsTable {
font-size: 0.8rem;
font-size: $font-12px;
width: 100%;
}
res/css/views/dialogs/_UnknownDeviceDialog.scss
+1 -1
View File
@@ -27,7 +27,7 @@ limitations under the License.
// userid
.mx_UnknownDeviceDialog p {
font-weight: bold;
font-size: 1.067rem;
font-size: $font-16px;
}
.mx_UnknownDeviceDialog .mx_DeviceVerifyButtons {