Skip to content

Commit 6fa94b0

Browse files
style(general) Replaced fixed values for font-size and line-height with rem (#15917)
* style(general) Replaced font-size fixed units with rem * style(general) Replaced font-size fixed units with rem in the tokens * style(general) Replaced line-height fixed units with rem
1 parent 3f3a074 commit 6fa94b0

30 files changed

+152
-152
lines changed

css/404.scss

+2-2
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,12 @@
44
text-align: center;
55

66
h2 {
7-
font-size: 48px;
7+
font-size: 3rem;
88
color : #f2f2f2;
99
}
1010

1111
&__message {
12-
font-size: 24px;
12+
font-size: 1.5rem;
1313
margin-top: 20px;
1414
}
1515
}

css/_base.scss

+2-2
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ body {
2828
margin: 0px;
2929
width: 100%;
3030
height: 100%;
31-
font-size: 12px;
31+
font-size: 0.75rem;
3232
font-weight: 400;
3333
overflow: hidden;
3434
color: #F1F1F1;
@@ -139,7 +139,7 @@ form {
139139
position: absolute;
140140
left: 25;
141141
bottom: 7;
142-
font-size: 11pt;
142+
font-size: 0.875rem;
143143
color: rgba(255,255,255,.50);
144144
text-decoration: none;
145145
z-index: $watermarkZ;

css/_chat.scss

+9-9
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@
1111
#chatconversation {
1212
box-sizing: border-box;
1313
flex: 1;
14-
font-size: 10pt;
14+
font-size: 0.75rem;
1515
height: calc(100% - 10px);
16-
line-height: 20px;
16+
line-height: 1.25rem;
1717
overflow: auto;
1818
padding: 16px;
1919
text-align: left;
@@ -72,7 +72,7 @@
7272
#nickname {
7373
text-align: center;
7474
color: #9d9d9d;
75-
font-size: 16px;
75+
font-size: 1rem;
7676
margin: auto 0;
7777
padding: 0 16px;
7878

@@ -86,7 +86,7 @@
8686
}
8787

8888
label {
89-
line-height: 24px;
89+
line-height: 1.5rem;
9090
}
9191
}
9292

@@ -98,7 +98,7 @@
9898
}
9999

100100
.chatmessage .usermessage {
101-
font-size: 16px;
101+
font-size: 1rem;
102102
}
103103
}
104104

@@ -124,7 +124,7 @@
124124
}
125125

126126
#smileys {
127-
font-size: 20pt;
127+
font-size: 1.625rem;
128128
margin: auto;
129129
cursor: pointer;
130130
}
@@ -168,7 +168,7 @@
168168
}
169169

170170
#smileysContainer .smiley {
171-
font-size: 20pt;
171+
font-size: 1.625rem;
172172
}
173173

174174
.smileyContainer {
@@ -219,8 +219,8 @@
219219
box-sizing: border-box;
220220
color: #fff;
221221
font-weight: 600;
222-
font-size: 24px;
223-
line-height: 32px;
222+
font-size: 1.5rem;
223+
line-height: 2rem;
224224

225225
.jitsi-icon {
226226
cursor: pointer;

css/_chrome-extension-banner.scss

+6-6
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@
3434
}
3535

3636
&__checkbox-label {
37-
font-size: 14px;
38-
line-height: 18px;
37+
font-size: 0.875rem;
38+
line-height: 1.125rem;
3939
display: flex;
4040
align-items: center;
4141
letter-spacing: -0.006em;
@@ -51,8 +51,8 @@
5151
}
5252

5353
&__text-container {
54-
font-size: 14px;
55-
line-height: 18px;
54+
font-size: 0.875rem;
55+
line-height: 1.125rem;
5656
display: flex;
5757
align-items: center;
5858
letter-spacing: -0.006em;
@@ -84,8 +84,8 @@
8484

8585
&__button-text {
8686
font-weight: 600;
87-
font-size: 14px;
88-
line-height: 40px;
87+
font-size: 0.875rem;
88+
line-height: 2.5rem;
8989
text-align: center;
9090
letter-spacing: -0.006em;
9191
color: #FFFFFF;

css/_inlay.scss

+3-3
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
margin: 17px 0;
1111
padding-bottom: 17px;
1212
color: #ffffff;
13-
font-size: 21px;
13+
font-size: 1.25rem;
1414
letter-spacing: 0.3px;
1515
border-bottom: 1px solid lighten(#FFFFFF, 10%);
1616
}
@@ -19,12 +19,12 @@
1919
color: #ffffff;
2020
display: block;
2121
margin-top: 22px;
22-
font-size: 16px;
22+
font-size: 1rem;
2323
}
2424

2525
&__icon {
2626
margin: 0 10px;
27-
font-size: 50px;
27+
font-size: 3.125rem;
2828
}
2929

3030
}

css/_meetings_list.scss

+10-10
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
.meetings-list {
2-
font-size: 14px;
2+
font-size: 0.875rem;
33
color: #253858;
4-
line-height: 20px;
4+
line-height: 1.25rem;
55
text-align: left;
66
text-overflow: ellipsis;
77
display: flex;
@@ -20,8 +20,8 @@
2020

2121
.description {
2222
color: #2f3237;
23-
font-size: 14px;
24-
line-height: 18px;
23+
font-size: 0.875rem;
24+
line-height: 1.125rem;
2525
margin-bottom: 16px;
2626
max-width: 436px;
2727
}
@@ -37,8 +37,8 @@
3737
color: #0163FF;
3838
cursor: pointer;
3939
display: flex;
40-
font-size: 14px;
41-
line-height: 18px;
40+
font-size: 0.875rem;
41+
line-height: 1.125rem;
4242
margin: 24px 0 32px 0;
4343
}
4444

@@ -101,17 +101,17 @@
101101
}
102102

103103
.title {
104-
font-size: 12px;
104+
font-size: 0.75rem;
105105
font-weight: 600;
106-
line-height: 16px;
106+
line-height: 1rem;
107107
margin-bottom: 4px;
108108
}
109109

110110
.subtitle {
111111
color: #5E6D7A;
112112
font-weight: normal;
113-
font-size: 12px;
114-
line-height: 16px;
113+
font-size: 0.75rem;
114+
line-height: 1rem;
115115
}
116116

117117

css/_navigate_section_list.scss

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
%navigate-section-list-text {
22
width: 100%;
3-
font-size: 14px;
4-
line-height: 20px;
3+
font-size: 0.875rem;
4+
line-height: 1.25rem;
55
color: $welcomePageTitleColor;
66
text-align: left;
77
font-family: 'open_sanslight', Helvetica, sans-serif;
@@ -52,7 +52,7 @@
5252
.navigate-section-tile-body {
5353
@extend %navigate-section-list-tile-text;
5454
font-weight: normal;
55-
line-height: 24px;
55+
line-height: 1.5rem;
5656
}
5757
.navigate-section-list-tile-info {
5858
flex: 1;
@@ -61,7 +61,7 @@
6161
.navigate-section-tile-title {
6262
@extend %navigate-section-list-tile-text;
6363
font-weight: bold;
64-
line-height: 24px;
64+
line-height: 1.5rem;
6565
}
6666
.navigate-section-section-header {
6767
@extend %navigate-section-list-text;

css/_policy.scss

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88

99
&__text {
1010
text-align: center;
11-
font-size: 14px;
12-
line-height: 21px;
11+
font-size: 0.875rem;
12+
line-height: 1.25rem;
1313
font-weight: 300;
1414
}
1515
}

css/_reactions-menu.scss

+6-6
Original file line numberDiff line numberDiff line change
@@ -55,15 +55,15 @@
5555
span.emoji {
5656
width: 40px;
5757
height: 40px;
58-
font-size: 22px;
58+
font-size: 1.375rem;
5959
display: flex;
6060
align-items: center;
6161
justify-content: center;
6262
transition: font-size ease .1s;
6363

6464
@for $i from 1 through 12 {
6565
&.increase-#{$i}{
66-
font-size: calc(20px + #{$i}px);
66+
font-size: calc(1.25rem + #{$i}px);
6767
}
6868
}
6969
}
@@ -96,8 +96,8 @@
9696
span.text {
9797
font-style: normal;
9898
font-weight: 600;
99-
font-size: 14px;
100-
line-height: 24px;
99+
font-size: 0.875rem;
100+
line-height: 1.5rem;
101101
margin-left: 8px;
102102
}
103103
}
@@ -132,8 +132,8 @@ $reactionCount: 20;
132132

133133
.reaction-emoji {
134134
position: absolute;
135-
font-size: 24px;
136-
line-height: 32px;
135+
font-size: 1.5rem;
136+
line-height: 2rem;
137137
width: 32px;
138138
height: 32px;
139139
top: 0;

css/_recording.scss

+6-6
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
.recording-title {
1313
display: inline-flex;
1414
align-items: center;
15-
font-size: 14px;
15+
font-size: 0.875rem;
1616
margin-left: 16px;
1717
max-width: 70%;
1818

@@ -35,8 +35,8 @@
3535
.local-recording-warning {
3636
margin-top: 8px;
3737
display: block;
38-
font-size: 14px;
39-
line-height: 20px;
38+
font-size: 0.875rem;
39+
line-height: 1.25rem;
4040
padding: 8px 16px;
4141

4242
&.text {
@@ -126,7 +126,7 @@
126126

127127
.recording-info-title {
128128
display: inline-flex;
129-
font-size: 14px;
129+
font-size: 0.875rem;
130130
width: 290px
131131
}
132132

@@ -150,7 +150,7 @@
150150
/**
151151
* Set font-size to be consistent with Atlaskit FieldText.
152152
*/
153-
font-size: 14px;
153+
font-size: 0.875rem;
154154

155155
.broadcast-dropdown {
156156
text-align: left;
@@ -194,6 +194,6 @@
194194

195195
.warning-text {
196196
color:#FFD740;
197-
font-size: 12px;
197+
font-size: 0.75rem;
198198
}
199199
}

css/_redirect_page.scss

+6-6
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,24 @@
22
width: 30%;
33
margin: 20% auto;
44
text-align: center;
5-
font-size: 24px;
5+
font-size: 1.5rem;
66

77
.thanks-msg {
88
border-bottom: 1px solid #FFFFFF;
99
padding-left: 30px;
1010
padding-right: 30px;
1111
p {
1212
margin: 30px auto;
13-
font-size: 24px;
14-
line-height: 24px;
13+
font-size: 1.5rem;
14+
line-height: 1.5rem;
1515
}
1616
}
1717
.hint-msg {
1818
p {
1919
margin: 26px auto;
2020
font-weight: 600;
21-
font-size: 16px;
22-
line-height: 18px;
21+
font-size: 1rem;
22+
line-height: 1.125rem;
2323
.hint-msg__holder{
2424
font-weight: 200;
2525
}
@@ -33,7 +33,7 @@
3333
}
3434
.forbidden-msg {
3535
p {
36-
font-size: 16px;
36+
font-size: 1rem;
3737
margin-top: 15px;
3838
}
3939
}

0 commit comments

Comments
 (0)