@ieeesa-npm/shared-styles 0.2.6 → 0.2.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/images/sprites/sprites.svg +9 -0
- package/package.json +1 -1
- package/styles/dark-theme.scss +189 -0
- package/styles/lighter-theme.scss +189 -0
- package/styles/mixins.scss +12 -4
- package/styles/theme.scss +1 -1
- package/styles/typography.scss +2 -13
- package/styles/variables.scss +33 -27
|
@@ -154,5 +154,14 @@
|
|
|
154
154
|
<path d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM7.35 18.5C8.66 17.56 10.26 17 12 17C13.74 17 15.34 17.56 16.65 18.5C15.34 19.44 13.74 20 12 20C10.26 20 8.66 19.44 7.35 18.5ZM18.14 17.12C16.45 15.8 14.32 15 12 15C9.68 15 7.55 15.8 5.86 17.12C4.7 15.73 4 13.95 4 12C4 7.58 7.58 4 12 4C16.42 4 20 7.58 20 12C20 13.95 19.3 15.73 18.14 17.12Z" fill="#777A7E" />
|
|
155
155
|
<path d="M12 6C10.07 6 8.5 7.57 8.5 9.5C8.5 11.43 10.07 13 12 13C13.93 13 15.5 11.43 15.5 9.5C15.5 7.57 13.93 6 12 6ZM12 11C11.17 11 10.5 10.33 10.5 9.5C10.5 8.67 11.17 8 12 8C12.83 8 13.5 8.67 13.5 9.5C13.5 10.33 12.83 11 12 11Z" fill="#777A7E" />
|
|
156
156
|
</symbol>
|
|
157
|
+
<symbol id="icon-create-meeting" width="19" height="20" viewBox="0 0 19 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
158
|
+
<path id="Vector" d="M14 20V17H11V15H14V12H16V15H19V17H16V20H14ZM2 18C1.45 18 0.979167 17.8042 0.5875 17.4125C0.195833 17.0208 0 16.55 0 16V4C0 3.45 0.195833 2.97917 0.5875 2.5875C0.979167 2.19583 1.45 2 2 2H3V0H5V2H11V0H13V2H14C14.55 2 15.0208 2.19583 15.4125 2.5875C15.8042 2.97917 16 3.45 16 4V10.1C15.6667 10.05 15.3333 10.025 15 10.025C14.6667 10.025 14.3333 10.05 14 10.1V8H2V16H9C9 16.3333 9.025 16.6667 9.075 17C9.125 17.3333 9.21667 17.6667 9.35 18H2ZM2 6H14V4H2V6Z" fill="#00629B"/>
|
|
159
|
+
</symbol>
|
|
160
|
+
<symbol id="icon-list-view" width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
161
|
+
<path d="M6.25 3.25H10.75V4.75H6.25V3.25ZM6.25 6.25H10.75V7.75H6.25V6.25ZM6.25 9.25H10.75V10.75H6.25V9.25ZM3.25 3.25H4.75V4.75H3.25V3.25ZM3.25 6.25H4.75V7.75H3.25V6.25ZM3.25 9.25H4.75V10.75H3.25V9.25ZM13.075 0.25H0.925C0.55 0.25 0.25 0.55 0.25 0.925V13.075C0.25 13.375 0.55 13.75 0.925 13.75H13.075C13.375 13.75 13.75 13.375 13.75 13.075V0.925C13.75 0.55 13.375 0.25 13.075 0.25ZM12.25 12.25H1.75V1.75H12.25V12.25Z" fill="#1C1B1F"/>
|
|
162
|
+
</symbol>
|
|
163
|
+
<symbol id="icon-calender-view" width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
164
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.25 2H11.5V0.5H10V2H4V0.5H2.5V2H1.75C0.9175 2 0.25 2.675 0.25 3.5V14C0.25 14.825 0.9175 15.5 1.75 15.5H12.25C13.075 15.5 13.75 14.825 13.75 14V3.5C13.75 2.675 13.075 2 12.25 2ZM12.25 14H1.75V5.75H12.25V14ZM2.875 8.75C2.875 7.715 3.715 6.875 4.75 6.875C5.785 6.875 6.625 7.715 6.625 8.75C6.625 9.785 5.785 10.625 4.75 10.625C3.715 10.625 2.875 9.785 2.875 8.75Z" fill="#1C1B1F"/>
|
|
165
|
+
</symbol>
|
|
157
166
|
</defs>
|
|
158
167
|
</svg>
|
package/package.json
CHANGED
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
@import "./variables.scss";
|
|
2
|
+
@import "./typography.scss";
|
|
3
|
+
@import "./mixins.scss";
|
|
4
|
+
|
|
5
|
+
// button variant classes
|
|
6
|
+
.mat-mdc-button.mat-mdc-button-base {
|
|
7
|
+
&.mat-primary-button,
|
|
8
|
+
&.mat-secondary-button,
|
|
9
|
+
&.mat-tertiary-button,
|
|
10
|
+
&.mat-text-button {
|
|
11
|
+
min-width: 103px;
|
|
12
|
+
width: auto;
|
|
13
|
+
min-height: 40px;
|
|
14
|
+
height: auto;
|
|
15
|
+
border-radius: 3px;
|
|
16
|
+
text-align: center;
|
|
17
|
+
padding: 0.625em 1.5em;
|
|
18
|
+
border: none;
|
|
19
|
+
@include set-font-style(
|
|
20
|
+
$ieeesa-font-calibri-bold,
|
|
21
|
+
$ieeesa-font-style-normal,
|
|
22
|
+
$ieeesa-font-wt-700,
|
|
23
|
+
$ieeesa-font-size-16,
|
|
24
|
+
$ieeesa-line-height-20,
|
|
25
|
+
$ieeesa-black,
|
|
26
|
+
$ieeesa-letter-space-point-1
|
|
27
|
+
);
|
|
28
|
+
}
|
|
29
|
+
& > .mat-icon {
|
|
30
|
+
margin-right: 11px;
|
|
31
|
+
}
|
|
32
|
+
&.mat-primary-button {
|
|
33
|
+
background-color: $ieeesa-primary-btn-active;
|
|
34
|
+
color: $ieeesa-white;
|
|
35
|
+
}
|
|
36
|
+
&.mat-primary-button:hover {
|
|
37
|
+
background-color: $ieeesa-primary-btn-hover;
|
|
38
|
+
}
|
|
39
|
+
&.mat-primary-button:active {
|
|
40
|
+
background-color: $ieeesa-primary-btn-active;
|
|
41
|
+
}
|
|
42
|
+
&.mat-primary-button:disabled {
|
|
43
|
+
background-color: $ieeesa-primary-btn-disabled;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&.mat-secondary-button {
|
|
47
|
+
color: $ieeesa-white;
|
|
48
|
+
background: $ieeesa-medium-grey;
|
|
49
|
+
box-shadow: $ieeesa-box-shadow-2;
|
|
50
|
+
}
|
|
51
|
+
&.mat-secondary-button:hover {
|
|
52
|
+
background: $ieeesa-secondary-btn-hover;
|
|
53
|
+
}
|
|
54
|
+
&.mat-secondary-button:active {
|
|
55
|
+
background: $ieeesa-secondary-btn-active;
|
|
56
|
+
}
|
|
57
|
+
&.mat-secondary-button:disabled {
|
|
58
|
+
background: $ieeesa-primary-btn-disabled;
|
|
59
|
+
color: $ieeesa-background-dark-color;
|
|
60
|
+
opacity: $ieeesa-opacity-point-38;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
&.mat-tertiary-button {
|
|
64
|
+
background-color: $ieeesa-white;
|
|
65
|
+
border: 1px solid $ieeesa-tertiary-btn-color;
|
|
66
|
+
color: $ieeesa-tertiary-btn-color;
|
|
67
|
+
}
|
|
68
|
+
&.mat-tertiary-button:hover {
|
|
69
|
+
background-color: $ieeesa-tertiary-btn-hover;
|
|
70
|
+
}
|
|
71
|
+
&.mat-tertiary-button:active {
|
|
72
|
+
background: $ieeesa-tertiary-btn-active;
|
|
73
|
+
}
|
|
74
|
+
&.mat-tertiary-button:disabled {
|
|
75
|
+
border: 1px solid $ieeesa-tertiary-btn-disabled;
|
|
76
|
+
color: $ieeesa-background-dark-color;
|
|
77
|
+
opacity: $ieeesa-opacity-point-38;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
&.mat-text-button {
|
|
81
|
+
color: $ieeesa-blue;
|
|
82
|
+
&:hover {
|
|
83
|
+
background: $ieeesa-tertiary-btn-hover;
|
|
84
|
+
}
|
|
85
|
+
&:active {
|
|
86
|
+
background: $ieeesa-tertiary-btn-hover;
|
|
87
|
+
}
|
|
88
|
+
&:disabled {
|
|
89
|
+
color: $ieeesa-title-color;
|
|
90
|
+
opacity: $ieeesa-opacity-point-38;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
.ieeesa-text-button {
|
|
95
|
+
color: $ieeesa-outline-variant;
|
|
96
|
+
background: none;
|
|
97
|
+
border: none;
|
|
98
|
+
}
|
|
99
|
+
.ieeesa-view-more-or-less-button {
|
|
100
|
+
border: none;
|
|
101
|
+
background: none;
|
|
102
|
+
text-decoration: underline;
|
|
103
|
+
color: $ieeesa-blue;
|
|
104
|
+
}
|
|
105
|
+
.flex-align-center {
|
|
106
|
+
display: flex;
|
|
107
|
+
align-items: center;
|
|
108
|
+
justify-content: center;
|
|
109
|
+
}
|
|
110
|
+
// mat-toggle-button theme
|
|
111
|
+
.mat-button-toggle-checked {
|
|
112
|
+
background-color: $ieeesa-secondary-btn-hover;
|
|
113
|
+
.mat-button-toggle-label-content::before {
|
|
114
|
+
font-family: "Font Awesome 5 Free";
|
|
115
|
+
font-weight: $ieeesa-font-wt-900;
|
|
116
|
+
content: "\f00c";
|
|
117
|
+
padding-right: 0.5625em;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
.mat-button-toggle-group {
|
|
121
|
+
.mat-button-toggle-label-content {
|
|
122
|
+
@include set-font-style(
|
|
123
|
+
$ieeesa-font-calibri-bold,
|
|
124
|
+
$ieeesa-font-style-normal,
|
|
125
|
+
$ieeesa-font-wt-700,
|
|
126
|
+
$ieeesa-font-size-16,
|
|
127
|
+
$ieeesa-line-height-20,
|
|
128
|
+
$ieeesa-background-dark-color,
|
|
129
|
+
$ieeesa-letter-space-point-1
|
|
130
|
+
);
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
// Bordered button with no background
|
|
134
|
+
.no-bg-color-btn {
|
|
135
|
+
color: $ieeesa-blue;
|
|
136
|
+
border-radius: 3px;
|
|
137
|
+
border: 1px solid $ieeesa-blue;
|
|
138
|
+
min-height: 40px;
|
|
139
|
+
height: auto;
|
|
140
|
+
}
|
|
141
|
+
@media (max-width: 768px) {
|
|
142
|
+
.mat-button-toggle-group {
|
|
143
|
+
.mat-button-toggle-label-content {
|
|
144
|
+
max-width: 8ch;
|
|
145
|
+
text-overflow: ellipsis;
|
|
146
|
+
white-space: nowrap;
|
|
147
|
+
overflow: hidden;
|
|
148
|
+
position: relative;
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
.cdk-overlay-pane {
|
|
153
|
+
.mat-mdc-tooltip .mdc-tooltip__surface {
|
|
154
|
+
color: #525252;
|
|
155
|
+
padding: 6px 12px;
|
|
156
|
+
font-family: $ieeesa-font-calibri-regular;
|
|
157
|
+
font-size: $ieeesa-font-size-16;
|
|
158
|
+
border: 1px solid $ieeesa-outline-variant;
|
|
159
|
+
background: $ieeesa-white;
|
|
160
|
+
box-shadow: $ieeesa-box-shadow-11;
|
|
161
|
+
max-width: unset !important;
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
.cdk-overlay-pane {
|
|
165
|
+
.mat-mdc-option .mdc-list-item__primary-text {
|
|
166
|
+
font-family: $ieeesa-font-calibri-regular !important;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
// Modal component styles
|
|
170
|
+
.cdk-overlay-pane {
|
|
171
|
+
&.ieeesa-modal-confirm-dialog,
|
|
172
|
+
&.ieeesa-modal-dialog,
|
|
173
|
+
&.ieeesa-alert-dialog {
|
|
174
|
+
width: 100%;
|
|
175
|
+
min-width: 312px;
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
.mat-mdc-form-field {
|
|
180
|
+
@include set-font-style(
|
|
181
|
+
$ieeesa-font-calibri-regular,
|
|
182
|
+
$ieeesa-font-style-normal,
|
|
183
|
+
$ieeesa-font-wt-400,
|
|
184
|
+
$ieeesa-font-size-18,
|
|
185
|
+
$ieeesa-line-height-24,
|
|
186
|
+
$ieeesa-on-surface-variant-color,
|
|
187
|
+
$ieeesa-letter-space-point-5
|
|
188
|
+
);
|
|
189
|
+
}
|
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
@import "./variables.scss";
|
|
2
|
+
@import "./typography.scss";
|
|
3
|
+
@import "./mixins.scss";
|
|
4
|
+
|
|
5
|
+
// button variant classes
|
|
6
|
+
.mat-mdc-button.mat-mdc-button-base {
|
|
7
|
+
&.mat-primary-button,
|
|
8
|
+
&.mat-secondary-button,
|
|
9
|
+
&.mat-tertiary-button,
|
|
10
|
+
&.mat-text-button {
|
|
11
|
+
min-width: 103px;
|
|
12
|
+
width: auto;
|
|
13
|
+
min-height: 40px;
|
|
14
|
+
height: auto;
|
|
15
|
+
border-radius: 3px;
|
|
16
|
+
text-align: center;
|
|
17
|
+
padding: 0.625em 1.5em;
|
|
18
|
+
border: none;
|
|
19
|
+
@include set-font-style(
|
|
20
|
+
$ieeesa-font-calibri-bold,
|
|
21
|
+
$ieeesa-font-style-normal,
|
|
22
|
+
$ieeesa-font-wt-700,
|
|
23
|
+
$ieeesa-font-size-16,
|
|
24
|
+
$ieeesa-line-height-20,
|
|
25
|
+
$ieeesa-black,
|
|
26
|
+
$ieeesa-letter-space-point-1
|
|
27
|
+
);
|
|
28
|
+
}
|
|
29
|
+
& > .mat-icon {
|
|
30
|
+
margin-right: 11px;
|
|
31
|
+
}
|
|
32
|
+
&.mat-primary-button {
|
|
33
|
+
background-color: $ieeesa-primary-btn-active;
|
|
34
|
+
color: $ieeesa-white;
|
|
35
|
+
}
|
|
36
|
+
&.mat-primary-button:hover {
|
|
37
|
+
background-color: $ieeesa-primary-btn-hover;
|
|
38
|
+
}
|
|
39
|
+
&.mat-primary-button:active {
|
|
40
|
+
background-color: $ieeesa-primary-btn-active;
|
|
41
|
+
}
|
|
42
|
+
&.mat-primary-button:disabled {
|
|
43
|
+
background-color: $ieeesa-primary-btn-disabled;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&.mat-secondary-button {
|
|
47
|
+
color: $ieeesa-white;
|
|
48
|
+
background: $ieeesa-medium-grey;
|
|
49
|
+
box-shadow: $ieeesa-box-shadow-2;
|
|
50
|
+
}
|
|
51
|
+
&.mat-secondary-button:hover {
|
|
52
|
+
background: $ieeesa-secondary-btn-hover;
|
|
53
|
+
}
|
|
54
|
+
&.mat-secondary-button:active {
|
|
55
|
+
background: $ieeesa-secondary-btn-active;
|
|
56
|
+
}
|
|
57
|
+
&.mat-secondary-button:disabled {
|
|
58
|
+
background: $ieeesa-primary-btn-disabled;
|
|
59
|
+
color: $ieeesa-background-dark-color;
|
|
60
|
+
opacity: $ieeesa-opacity-point-38;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
&.mat-tertiary-button {
|
|
64
|
+
background-color: $ieeesa-white;
|
|
65
|
+
border: 1px solid $ieeesa-tertiary-btn-color;
|
|
66
|
+
color: $ieeesa-tertiary-btn-color;
|
|
67
|
+
}
|
|
68
|
+
&.mat-tertiary-button:hover {
|
|
69
|
+
background-color: $ieeesa-tertiary-btn-hover;
|
|
70
|
+
}
|
|
71
|
+
&.mat-tertiary-button:active {
|
|
72
|
+
background: $ieeesa-tertiary-btn-active;
|
|
73
|
+
}
|
|
74
|
+
&.mat-tertiary-button:disabled {
|
|
75
|
+
border: 1px solid $ieeesa-tertiary-btn-disabled;
|
|
76
|
+
color: $ieeesa-background-dark-color;
|
|
77
|
+
opacity: $ieeesa-opacity-point-38;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
&.mat-text-button {
|
|
81
|
+
color: $ieeesa-blue;
|
|
82
|
+
&:hover {
|
|
83
|
+
background: $ieeesa-tertiary-btn-hover;
|
|
84
|
+
}
|
|
85
|
+
&:active {
|
|
86
|
+
background: $ieeesa-tertiary-btn-hover;
|
|
87
|
+
}
|
|
88
|
+
&:disabled {
|
|
89
|
+
color: $ieeesa-title-color;
|
|
90
|
+
opacity: $ieeesa-opacity-point-38;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
.ieeesa-text-button {
|
|
95
|
+
color: $ieeesa-outline-variant;
|
|
96
|
+
background: none;
|
|
97
|
+
border: none;
|
|
98
|
+
}
|
|
99
|
+
.ieeesa-view-more-or-less-button {
|
|
100
|
+
border: none;
|
|
101
|
+
background: none;
|
|
102
|
+
text-decoration: underline;
|
|
103
|
+
color: $ieeesa-blue;
|
|
104
|
+
}
|
|
105
|
+
.flex-align-center {
|
|
106
|
+
display: flex;
|
|
107
|
+
align-items: center;
|
|
108
|
+
justify-content: center;
|
|
109
|
+
}
|
|
110
|
+
// mat-toggle-button theme
|
|
111
|
+
.mat-button-toggle-checked {
|
|
112
|
+
background-color: $ieeesa-secondary-btn-hover;
|
|
113
|
+
.mat-button-toggle-label-content::before {
|
|
114
|
+
font-family: "Font Awesome 5 Free";
|
|
115
|
+
font-weight: $ieeesa-font-wt-900;
|
|
116
|
+
content: "\f00c";
|
|
117
|
+
padding-right: 0.5625em;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
.mat-button-toggle-group {
|
|
121
|
+
.mat-button-toggle-label-content {
|
|
122
|
+
@include set-font-style(
|
|
123
|
+
$ieeesa-font-calibri-bold,
|
|
124
|
+
$ieeesa-font-style-normal,
|
|
125
|
+
$ieeesa-font-wt-700,
|
|
126
|
+
$ieeesa-font-size-16,
|
|
127
|
+
$ieeesa-line-height-20,
|
|
128
|
+
$ieeesa-background-dark-color,
|
|
129
|
+
$ieeesa-letter-space-point-1
|
|
130
|
+
);
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
// Bordered button with no background
|
|
134
|
+
.no-bg-color-btn {
|
|
135
|
+
color: $ieeesa-blue;
|
|
136
|
+
border-radius: 3px;
|
|
137
|
+
border: 1px solid $ieeesa-blue;
|
|
138
|
+
min-height: 40px;
|
|
139
|
+
height: auto;
|
|
140
|
+
}
|
|
141
|
+
@media (max-width: 768px) {
|
|
142
|
+
.mat-button-toggle-group {
|
|
143
|
+
.mat-button-toggle-label-content {
|
|
144
|
+
max-width: 8ch;
|
|
145
|
+
text-overflow: ellipsis;
|
|
146
|
+
white-space: nowrap;
|
|
147
|
+
overflow: hidden;
|
|
148
|
+
position: relative;
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
.cdk-overlay-pane {
|
|
153
|
+
.mat-mdc-tooltip .mdc-tooltip__surface {
|
|
154
|
+
color: #525252;
|
|
155
|
+
padding: 6px 12px;
|
|
156
|
+
font-family: $ieeesa-font-calibri-regular;
|
|
157
|
+
font-size: $ieeesa-font-size-16;
|
|
158
|
+
border: 1px solid $ieeesa-outline-variant;
|
|
159
|
+
background: $ieeesa-white;
|
|
160
|
+
box-shadow: $ieeesa-box-shadow-11;
|
|
161
|
+
max-width: unset !important;
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
.cdk-overlay-pane {
|
|
165
|
+
.mat-mdc-option .mdc-list-item__primary-text {
|
|
166
|
+
font-family: $ieeesa-font-calibri-regular !important;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
// Modal component styles
|
|
170
|
+
.cdk-overlay-pane {
|
|
171
|
+
&.ieeesa-modal-confirm-dialog,
|
|
172
|
+
&.ieeesa-modal-dialog,
|
|
173
|
+
&.ieeesa-alert-dialog {
|
|
174
|
+
width: 100%;
|
|
175
|
+
min-width: 312px;
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
.mat-mdc-form-field {
|
|
180
|
+
@include set-font-style(
|
|
181
|
+
$ieeesa-font-calibri-regular,
|
|
182
|
+
$ieeesa-font-style-normal,
|
|
183
|
+
$ieeesa-font-wt-400,
|
|
184
|
+
$ieeesa-font-size-18,
|
|
185
|
+
$ieeesa-line-height-24,
|
|
186
|
+
$ieeesa-on-surface-variant-color,
|
|
187
|
+
$ieeesa-letter-space-point-5
|
|
188
|
+
);
|
|
189
|
+
}
|
package/styles/mixins.scss
CHANGED
|
@@ -64,10 +64,18 @@
|
|
|
64
64
|
}
|
|
65
65
|
}
|
|
66
66
|
|
|
67
|
-
@
|
|
67
|
+
@mixin set-tab-border-radius(
|
|
68
|
+
$border-top-left-radius,
|
|
69
|
+
$border-top-right-radius
|
|
70
|
+
) {
|
|
71
|
+
border-top-left-radius: $border-top-left-radius;
|
|
72
|
+
border-top-right-radius: $border-top-right-radius;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
@function translate($px) {
|
|
68
76
|
@return translateY($px);
|
|
69
77
|
}
|
|
70
78
|
|
|
71
|
-
@function rotate-icon($deg){
|
|
72
|
-
@return rotate($deg)
|
|
73
|
-
}
|
|
79
|
+
@function rotate-icon($deg) {
|
|
80
|
+
@return rotate($deg);
|
|
81
|
+
}
|
package/styles/theme.scss
CHANGED
package/styles/typography.scss
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
.ieeesa-subtitle {
|
|
5
5
|
text-align: left;
|
|
6
6
|
font-family: $ieeesa-font-calibri-regular;
|
|
7
|
-
font-size:
|
|
7
|
+
font-size: 1.56em;
|
|
8
8
|
letter-spacing: $ieeesa-letter-space-0;
|
|
9
9
|
color: $ieeesa-black;
|
|
10
10
|
opacity: 1;
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
.ieeesa-body {
|
|
13
13
|
text-align: left;
|
|
14
14
|
font-family: $ieeesa-font-calibri-regular;
|
|
15
|
-
font-size:
|
|
15
|
+
font-size: 1.25em;
|
|
16
16
|
letter-spacing: $ieeesa-letter-space-0;
|
|
17
17
|
color: $ieeesa-black;
|
|
18
18
|
opacity: 1;
|
|
@@ -149,17 +149,6 @@
|
|
|
149
149
|
$ieeesa-letter-space-point-15
|
|
150
150
|
);
|
|
151
151
|
}
|
|
152
|
-
.ieeesa-title-sm-14 {
|
|
153
|
-
@include set-font-style(
|
|
154
|
-
$ieeesa-font-calibri-regular,
|
|
155
|
-
$ieeesa-font-style-normal,
|
|
156
|
-
$ieeesa-font-wt-400,
|
|
157
|
-
$ieeesa-font-size-14,
|
|
158
|
-
$ieeesa-line-height-20,
|
|
159
|
-
$ieeesa-black,
|
|
160
|
-
$ieeesa-letter-space-point-1
|
|
161
|
-
);
|
|
162
|
-
}
|
|
163
152
|
.ieeesa-title-sm-16 {
|
|
164
153
|
@include set-font-style(
|
|
165
154
|
$ieeesa-font-calibri-regular,
|
package/styles/variables.scss
CHANGED
|
@@ -8,32 +8,32 @@ $ieeesa-font-style-normal: normal;
|
|
|
8
8
|
$ieeesa-font-variant-normal: normal;
|
|
9
9
|
$ieeesa-font-inter-bold: "Inter Bold";
|
|
10
10
|
// Font size
|
|
11
|
-
$ieeesa-font-size-6: 0.
|
|
12
|
-
$ieeesa-font-size-10: 0.
|
|
13
|
-
$ieeesa-font-size-12: 0.
|
|
14
|
-
$ieeesa-font-size-13: 0.
|
|
15
|
-
$ieeesa-font-size-14: 0.
|
|
16
|
-
$ieeesa-font-size-15: 0.
|
|
17
|
-
$ieeesa-font-size-16:
|
|
18
|
-
$ieeesa-font-size-18: 1.
|
|
19
|
-
$ieeesa-font-size-20: 1.
|
|
20
|
-
$ieeesa-font-size-22: 1.
|
|
21
|
-
$ieeesa-font-size-24: 1.
|
|
22
|
-
$ieeesa-font-size-25: 1.
|
|
23
|
-
$ieeesa-font-size-26: 1.
|
|
24
|
-
$ieeesa-font-size-28: 1.
|
|
25
|
-
$ieeesa-font-size-30: 1.
|
|
26
|
-
$ieeesa-font-size-31: 1.
|
|
27
|
-
$ieeesa-font-size-32:
|
|
28
|
-
$ieeesa-font-size-34: 2.
|
|
29
|
-
$ieeesa-font-size-38: 2.
|
|
30
|
-
$ieeesa-font-size-45: 2.
|
|
31
|
-
$ieeesa-font-size-47: 2.
|
|
32
|
-
$ieeesa-font-size-48:
|
|
33
|
-
$ieeesa-font-size-50: 3.
|
|
34
|
-
$ieeesa-font-size-57: 3.
|
|
35
|
-
$ieeesa-font-size-59: 3.
|
|
36
|
-
$ieeesa-font-size-76: 4.
|
|
11
|
+
$ieeesa-font-size-6: 0.375em;
|
|
12
|
+
$ieeesa-font-size-10: 0.625em;
|
|
13
|
+
$ieeesa-font-size-12: 0.75em;
|
|
14
|
+
$ieeesa-font-size-13: 0.8125em;
|
|
15
|
+
$ieeesa-font-size-14: 0.875em;
|
|
16
|
+
$ieeesa-font-size-15: 0.9375em;
|
|
17
|
+
$ieeesa-font-size-16: 1em;
|
|
18
|
+
$ieeesa-font-size-18: 1.125em;
|
|
19
|
+
$ieeesa-font-size-20: 1.25em;
|
|
20
|
+
$ieeesa-font-size-22: 1.375em;
|
|
21
|
+
$ieeesa-font-size-24: 1.5em;
|
|
22
|
+
$ieeesa-font-size-25: 1.5625em;
|
|
23
|
+
$ieeesa-font-size-26: 1.625em;
|
|
24
|
+
$ieeesa-font-size-28: 1.75em;
|
|
25
|
+
$ieeesa-font-size-30: 1.875em;
|
|
26
|
+
$ieeesa-font-size-31: 1.938em;
|
|
27
|
+
$ieeesa-font-size-32: 2em;
|
|
28
|
+
$ieeesa-font-size-34: 2.125em;
|
|
29
|
+
$ieeesa-font-size-38: 2.375em;
|
|
30
|
+
$ieeesa-font-size-45: 2.813em;
|
|
31
|
+
$ieeesa-font-size-47: 2.9375em;
|
|
32
|
+
$ieeesa-font-size-48: 3em;
|
|
33
|
+
$ieeesa-font-size-50: 3.125em;
|
|
34
|
+
$ieeesa-font-size-57: 3.5625em;
|
|
35
|
+
$ieeesa-font-size-59: 3.6875em;
|
|
36
|
+
$ieeesa-font-size-76: 4.75em;
|
|
37
37
|
// Font-weight
|
|
38
38
|
$ieeesa-font-wt-normal: normal;
|
|
39
39
|
$ieeesa-font-wt-bold: bold;
|
|
@@ -95,6 +95,8 @@ $ieeesa-data-table-row-background-color: #f7f9ff;
|
|
|
95
95
|
$ieeesa-data-table-head-color: #dce3e9;
|
|
96
96
|
$ieeesa-button-bg-gray: #383838;
|
|
97
97
|
$ieeesa-light-surface-variant: #daf1fe;
|
|
98
|
+
$ieeesa-border-blue: #b2b7be;
|
|
99
|
+
$ieeesa-background-light-blue: #eaf3f9;
|
|
98
100
|
// Box-shadow options
|
|
99
101
|
$ieeesa-box-shadow-1: 0px 1px 2px rgba(0, 0, 0, 0.3),
|
|
100
102
|
0px 1px 3px 1px rgba(0, 0, 0, 0.15);
|
|
@@ -141,7 +143,10 @@ $ieeesa-opacity-point-38: 0.38;
|
|
|
141
143
|
// IEEE SA Branding
|
|
142
144
|
$ieeesa-primary-brand-10: #002c37;
|
|
143
145
|
$ieeesa-primary-brand-30: #0188aa;
|
|
146
|
+
$ieeesa-dark-grey-20: #333436;
|
|
144
147
|
$ieeesa-dark-grey-30: #4a4d50;
|
|
148
|
+
$ieeesa-dark-grey-20: #333436;
|
|
149
|
+
$ieeesa-dark-grey-60: #878b8f;
|
|
145
150
|
$ieeesa-dark-grey-99: #f4f8fe;
|
|
146
151
|
$ieeesa-brand-grey-50: #777a7e;
|
|
147
152
|
$ieeesa-brand-grey-70: #9ba0a6;
|
|
@@ -168,4 +173,5 @@ $ieeesa-tile-background: linear-gradient(
|
|
|
168
173
|
$ieeesa-neutral-60: #939094;
|
|
169
174
|
$ieeesa-background-color-gray: #f2f2f2;
|
|
170
175
|
$ieeesa-mobile-min-width: 767px;
|
|
171
|
-
$ieeesa-
|
|
176
|
+
$ieeesa-background-color-light-blue: #b0d6ec;
|
|
177
|
+
$ieeesa-max-screen-width: 768px;
|