@nx/angular 22.6.0-beta.2 → 22.6.0-beta.3

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.
@@ -12,6 +12,341 @@ import { CommonModule } from '@angular/common';
12
12
  Delete this file and get started with your project!
13
13
  * * * * * * * * * * * * * * * * * * * * * * * * * * * *
14
14
  -->
15
+ <% if (style === 'sass') { %>
16
+ <style>
17
+ html
18
+ -webkit-text-size-adjust: 100%
19
+ font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
20
+ 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
21
+ 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
22
+ 'Noto Color Emoji'
23
+ line-height: 1.5
24
+ tab-size: 4
25
+ scroll-behavior: smooth
26
+ body
27
+ font-family: inherit
28
+ line-height: inherit
29
+ margin: 0
30
+ h1, h2, p, pre
31
+ margin: 0
32
+ *, ::before, ::after
33
+ box-sizing: border-box
34
+ border-width: 0
35
+ border-style: solid
36
+ border-color: currentColor
37
+ h1, h2
38
+ font-size: inherit
39
+ font-weight: inherit
40
+ a
41
+ color: inherit
42
+ text-decoration: inherit
43
+ pre
44
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
45
+ 'Liberation Mono', 'Courier New', monospace
46
+ svg
47
+ display: block
48
+ vertical-align: middle
49
+ svg
50
+ shape-rendering: auto
51
+ text-rendering: optimizeLegibility
52
+ pre
53
+ background-color: rgba(55, 65, 81, 1)
54
+ border-radius: 0.25rem
55
+ color: rgba(229, 231, 235, 1)
56
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
57
+ 'Liberation Mono', 'Courier New', monospace
58
+ overflow: auto
59
+ padding: 0.5rem 0.75rem
60
+ .shadow
61
+ box-shadow: 0 0 #0000, 0 0 #0000, 0 10px 15px -3px rgba(0, 0, 0, 0.1),
62
+ 0 4px 6px -2px rgba(0, 0, 0, 0.05)
63
+ .rounded
64
+ border-radius: 1.5rem
65
+ .wrapper
66
+ width: 100%
67
+ .container
68
+ margin-left: auto
69
+ margin-right: auto
70
+ max-width: 768px
71
+ padding-bottom: 3rem
72
+ padding-left: 1rem
73
+ padding-right: 1rem
74
+ color: rgba(55, 65, 81, 1)
75
+ width: 100%
76
+ #welcome
77
+ margin-top: 2.5rem
78
+ #welcome h1
79
+ font-size: 3rem
80
+ font-weight: 500
81
+ letter-spacing: -0.025em
82
+ line-height: 1
83
+ #welcome span
84
+ display: block
85
+ font-size: 1.875rem
86
+ font-weight: 300
87
+ line-height: 2.25rem
88
+ margin-bottom: 0.5rem
89
+ #hero
90
+ align-items: center
91
+ background-color: hsla(214, 62%, 21%, 1)
92
+ border: none
93
+ box-sizing: border-box
94
+ color: rgba(55, 65, 81, 1)
95
+ display: grid
96
+ grid-template-columns: 1fr
97
+ margin-top: 3.5rem
98
+ #hero .text-container
99
+ color: rgba(255, 255, 255, 1)
100
+ padding: 3rem 2rem
101
+ #hero .text-container h2
102
+ font-size: 1.5rem
103
+ line-height: 2rem
104
+ position: relative
105
+ #hero .text-container h2 svg
106
+ color: hsla(162, 47%, 50%, 1)
107
+ height: 2rem
108
+ left: -0.25rem
109
+ position: absolute
110
+ top: 0
111
+ width: 2rem
112
+ #hero .text-container h2 span
113
+ margin-left: 2.5rem
114
+ #hero .text-container a
115
+ background-color: rgba(255, 255, 255, 1)
116
+ border-radius: 0.75rem
117
+ color: rgba(55, 65, 81, 1)
118
+ display: inline-block
119
+ margin-top: 1.5rem
120
+ padding: 1rem 2rem
121
+ text-decoration: inherit
122
+ #hero .logo-container
123
+ display: none
124
+ justify-content: center
125
+ padding-left: 2rem
126
+ padding-right: 2rem
127
+ #hero .logo-container svg
128
+ color: rgba(255, 255, 255, 1)
129
+ width: 66.666667%
130
+ #middle-content
131
+ align-items: flex-start
132
+ display: grid
133
+ grid-template-columns: 1fr
134
+ margin-top: 3.5rem
135
+ #middle-content #middle-left-content
136
+ display: flex
137
+ flex-direction: column
138
+ gap: 2rem
139
+ #learning-materials
140
+ padding: 2.5rem 2rem
141
+ #learning-materials h2
142
+ font-weight: 500
143
+ font-size: 1.25rem
144
+ letter-spacing: -0.025em
145
+ line-height: 1.75rem
146
+ padding-left: 1rem
147
+ padding-right: 1rem
148
+ .list-item-link
149
+ align-items: center
150
+ border-radius: 0.75rem
151
+ display: flex
152
+ margin-top: 1rem
153
+ padding: 1rem
154
+ transition-property: background-color, border-color, color, fill, stroke,
155
+ opacity, box-shadow, transform, filter, backdrop-filter,
156
+ -webkit-backdrop-filter
157
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
158
+ transition-duration: 150ms
159
+ width: 100%
160
+ .list-item-link svg:first-child
161
+ margin-right: 1rem
162
+ height: 1.5rem
163
+ transition-property: background-color, border-color, color, fill, stroke,
164
+ opacity, box-shadow, transform, filter, backdrop-filter,
165
+ -webkit-backdrop-filter
166
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
167
+ transition-duration: 150ms
168
+ width: 1.5rem
169
+ .list-item-link > span
170
+ flex-grow: 1
171
+ font-weight: 400
172
+ transition-property: background-color, border-color, color, fill, stroke,
173
+ opacity, box-shadow, transform, filter, backdrop-filter,
174
+ -webkit-backdrop-filter
175
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
176
+ .list-item-link > span > span
177
+ color: rgba(107, 114, 128, 1)
178
+ display: block
179
+ flex-grow: 1
180
+ font-size: 0.75rem
181
+ font-weight: 300
182
+ line-height: 1rem
183
+ transition-property: background-color, border-color, color, fill, stroke,
184
+ opacity, box-shadow, transform, filter, backdrop-filter,
185
+ -webkit-backdrop-filter
186
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
187
+ .list-item-link svg:last-child
188
+ height: 1rem
189
+ transition-property: all
190
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
191
+ transition-duration: 150ms
192
+ width: 1rem
193
+ .list-item-link:hover
194
+ color: rgba(255, 255, 255, 1)
195
+ background-color: hsla(162, 55%, 33%, 1)
196
+ .list-item-link:hover > span > span
197
+ color: rgba(243, 244, 246, 1)
198
+ .list-item-link:hover svg:last-child
199
+ transform: translateX(0.25rem)
200
+ .button-pill
201
+ padding: 1.5rem 2rem
202
+ margin-bottom: 2rem
203
+ transition-duration: 300ms
204
+ transition-property: background-color, border-color, color, fill, stroke,
205
+ opacity, box-shadow, transform, filter, backdrop-filter,
206
+ -webkit-backdrop-filter
207
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
208
+ align-items: center
209
+ display: flex
210
+ .button-pill svg
211
+ transition-property: background-color, border-color, color, fill, stroke,
212
+ opacity, box-shadow, transform, filter, backdrop-filter,
213
+ -webkit-backdrop-filter
214
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
215
+ transition-duration: 150ms
216
+ flex-shrink: 0
217
+ width: 3rem
218
+ .button-pill > span
219
+ letter-spacing: -0.025em
220
+ font-weight: 400
221
+ font-size: 1.125rem
222
+ line-height: 1.75rem
223
+ padding-left: 1rem
224
+ padding-right: 1rem
225
+ .button-pill span span
226
+ display: block
227
+ font-size: 0.875rem
228
+ font-weight: 300
229
+ line-height: 1.25rem
230
+ .button-pill:hover svg, .button-pill:hover
231
+ color: rgba(255, 255, 255, 1) !important
232
+ .nx-console:hover
233
+ background-color: rgba(0, 122, 204, 1)
234
+ .nx-console svg
235
+ color: rgba(0, 122, 204, 1)
236
+ .nx-console-jetbrains
237
+ margin-top: 2rem
238
+ .nx-console-jetbrains:hover
239
+ background-color: rgba(255, 49, 140, 1)
240
+ .nx-console-jetbrains svg
241
+ color: rgba(255, 49, 140, 1)
242
+ #nx-repo:hover
243
+ background-color: rgba(24, 23, 23, 1)
244
+ #nx-repo svg
245
+ color: rgba(24, 23, 23, 1)
246
+ #nx-cloud
247
+ margin-bottom: 2rem
248
+ margin-top: 2rem
249
+ padding: 2.5rem 2rem
250
+ #nx-cloud > div
251
+ align-items: center
252
+ display: flex
253
+ #nx-cloud > div svg
254
+ border-radius: 0.375rem
255
+ flex-shrink: 0
256
+ width: 3rem
257
+ #nx-cloud > div h2
258
+ font-size: 1.125rem
259
+ font-weight: 400
260
+ letter-spacing: -0.025em
261
+ line-height: 1.75rem
262
+ padding-left: 1rem
263
+ padding-right: 1rem
264
+ #nx-cloud > div h2 span
265
+ display: block
266
+ font-size: 0.875rem
267
+ font-weight: 300
268
+ line-height: 1.25rem
269
+ #nx-cloud p
270
+ font-size: 1rem
271
+ line-height: 1.5rem
272
+ margin-top: 1rem
273
+ #nx-cloud pre
274
+ margin-top: 1rem
275
+ #nx-cloud a
276
+ color: rgba(107, 114, 128, 1)
277
+ display: block
278
+ font-size: 0.875rem
279
+ line-height: 1.25rem
280
+ margin-top: 1.5rem
281
+ text-align: right
282
+ #nx-cloud a:hover
283
+ text-decoration: underline
284
+ #commands
285
+ padding: 2.5rem 2rem
286
+ margin-top: 3.5rem
287
+ #commands h2
288
+ font-size: 1.25rem
289
+ font-weight: 400
290
+ letter-spacing: -0.025em
291
+ line-height: 1.75rem
292
+ padding-left: 1rem
293
+ padding-right: 1rem
294
+ #commands p
295
+ font-size: 1rem
296
+ font-weight: 300
297
+ line-height: 1.5rem
298
+ margin-top: 1rem
299
+ padding-left: 1rem
300
+ padding-right: 1rem
301
+ details
302
+ align-items: center
303
+ display: flex
304
+ margin-top: 1rem
305
+ padding-left: 1rem
306
+ padding-right: 1rem
307
+ width: 100%
308
+ details pre > span
309
+ color: rgba(181, 181, 181, 1)
310
+ summary
311
+ border-radius: 0.5rem
312
+ display: flex
313
+ font-weight: 400
314
+ padding: 0.5rem
315
+ cursor: pointer
316
+ transition-property: background-color, border-color, color, fill, stroke,
317
+ opacity, box-shadow, transform, filter, backdrop-filter,
318
+ -webkit-backdrop-filter
319
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
320
+ transition-duration: 150ms
321
+ summary:hover
322
+ background-color: rgba(243, 244, 246, 1)
323
+ summary svg
324
+ height: 1.5rem
325
+ margin-right: 1rem
326
+ width: 1.5rem
327
+ #love
328
+ color: rgba(107, 114, 128, 1)
329
+ font-size: 0.875rem
330
+ line-height: 1.25rem
331
+ margin-top: 3.5rem
332
+ opacity: 0.6
333
+ text-align: center
334
+ #love svg
335
+ color: rgba(252, 165, 165, 1)
336
+ width: 1.25rem
337
+ height: 1.25rem
338
+ display: inline
339
+ margin-top: -0.25rem
340
+ @media screen and (min-width: 768px)
341
+ #hero
342
+ grid-template-columns: repeat(2, minmax(0, 1fr))
343
+ #hero .logo-container
344
+ display: flex
345
+ #middle-content
346
+ grid-template-columns: repeat(2, minmax(0, 1fr))
347
+ gap: 4rem
348
+ </style>
349
+ <% } else { %>
15
350
  <style>
16
351
  html {
17
352
  -webkit-text-size-adjust: 100%;
@@ -426,6 +761,7 @@ import { CommonModule } from '@angular/common';
426
761
  }
427
762
  }
428
763
  </style>
764
+ <% } %>
429
765
  <div class="wrapper">
430
766
  <div class="container">
431
767
  <!-- WELCOME -->
@@ -11,6 +11,341 @@ import { Component, ViewEncapsulation } from '@angular/core';
11
11
  Delete this file and get started with your project!
12
12
  * * * * * * * * * * * * * * * * * * * * * * * * * * * *
13
13
  -->
14
+ <% if (style === 'sass') { %>
15
+ <style>
16
+ html
17
+ -webkit-text-size-adjust: 100%
18
+ font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
19
+ 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
20
+ 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
21
+ 'Noto Color Emoji'
22
+ line-height: 1.5
23
+ tab-size: 4
24
+ scroll-behavior: smooth
25
+ body
26
+ font-family: inherit
27
+ line-height: inherit
28
+ margin: 0
29
+ h1, h2, p, pre
30
+ margin: 0
31
+ *, ::before, ::after
32
+ box-sizing: border-box
33
+ border-width: 0
34
+ border-style: solid
35
+ border-color: currentColor
36
+ h1, h2
37
+ font-size: inherit
38
+ font-weight: inherit
39
+ a
40
+ color: inherit
41
+ text-decoration: inherit
42
+ pre
43
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
44
+ 'Liberation Mono', 'Courier New', monospace
45
+ svg
46
+ display: block
47
+ vertical-align: middle
48
+ svg
49
+ shape-rendering: auto
50
+ text-rendering: optimizeLegibility
51
+ pre
52
+ background-color: rgba(55, 65, 81, 1)
53
+ border-radius: 0.25rem
54
+ color: rgba(229, 231, 235, 1)
55
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
56
+ 'Liberation Mono', 'Courier New', monospace
57
+ overflow: auto
58
+ padding: 0.5rem 0.75rem
59
+ .shadow
60
+ box-shadow: 0 0 #0000, 0 0 #0000, 0 10px 15px -3px rgba(0, 0, 0, 0.1),
61
+ 0 4px 6px -2px rgba(0, 0, 0, 0.05)
62
+ .rounded
63
+ border-radius: 1.5rem
64
+ .wrapper
65
+ width: 100%
66
+ .container
67
+ margin-left: auto
68
+ margin-right: auto
69
+ max-width: 768px
70
+ padding-bottom: 3rem
71
+ padding-left: 1rem
72
+ padding-right: 1rem
73
+ color: rgba(55, 65, 81, 1)
74
+ width: 100%
75
+ #welcome
76
+ margin-top: 2.5rem
77
+ #welcome h1
78
+ font-size: 3rem
79
+ font-weight: 500
80
+ letter-spacing: -0.025em
81
+ line-height: 1
82
+ #welcome span
83
+ display: block
84
+ font-size: 1.875rem
85
+ font-weight: 300
86
+ line-height: 2.25rem
87
+ margin-bottom: 0.5rem
88
+ #hero
89
+ align-items: center
90
+ background-color: hsla(214, 62%, 21%, 1)
91
+ border: none
92
+ box-sizing: border-box
93
+ color: rgba(55, 65, 81, 1)
94
+ display: grid
95
+ grid-template-columns: 1fr
96
+ margin-top: 3.5rem
97
+ #hero .text-container
98
+ color: rgba(255, 255, 255, 1)
99
+ padding: 3rem 2rem
100
+ #hero .text-container h2
101
+ font-size: 1.5rem
102
+ line-height: 2rem
103
+ position: relative
104
+ #hero .text-container h2 svg
105
+ color: hsla(162, 47%, 50%, 1)
106
+ height: 2rem
107
+ left: -0.25rem
108
+ position: absolute
109
+ top: 0
110
+ width: 2rem
111
+ #hero .text-container h2 span
112
+ margin-left: 2.5rem
113
+ #hero .text-container a
114
+ background-color: rgba(255, 255, 255, 1)
115
+ border-radius: 0.75rem
116
+ color: rgba(55, 65, 81, 1)
117
+ display: inline-block
118
+ margin-top: 1.5rem
119
+ padding: 1rem 2rem
120
+ text-decoration: inherit
121
+ #hero .logo-container
122
+ display: none
123
+ justify-content: center
124
+ padding-left: 2rem
125
+ padding-right: 2rem
126
+ #hero .logo-container svg
127
+ color: rgba(255, 255, 255, 1)
128
+ width: 66.666667%
129
+ #middle-content
130
+ align-items: flex-start
131
+ display: grid
132
+ grid-template-columns: 1fr
133
+ margin-top: 3.5rem
134
+ #middle-content #middle-left-content
135
+ display: flex
136
+ flex-direction: column
137
+ gap: 2rem
138
+ #learning-materials
139
+ padding: 2.5rem 2rem
140
+ #learning-materials h2
141
+ font-weight: 500
142
+ font-size: 1.25rem
143
+ letter-spacing: -0.025em
144
+ line-height: 1.75rem
145
+ padding-left: 1rem
146
+ padding-right: 1rem
147
+ .list-item-link
148
+ align-items: center
149
+ border-radius: 0.75rem
150
+ display: flex
151
+ margin-top: 1rem
152
+ padding: 1rem
153
+ transition-property: background-color, border-color, color, fill, stroke,
154
+ opacity, box-shadow, transform, filter, backdrop-filter,
155
+ -webkit-backdrop-filter
156
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
157
+ transition-duration: 150ms
158
+ width: 100%
159
+ .list-item-link svg:first-child
160
+ margin-right: 1rem
161
+ height: 1.5rem
162
+ transition-property: background-color, border-color, color, fill, stroke,
163
+ opacity, box-shadow, transform, filter, backdrop-filter,
164
+ -webkit-backdrop-filter
165
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
166
+ transition-duration: 150ms
167
+ width: 1.5rem
168
+ .list-item-link > span
169
+ flex-grow: 1
170
+ font-weight: 400
171
+ transition-property: background-color, border-color, color, fill, stroke,
172
+ opacity, box-shadow, transform, filter, backdrop-filter,
173
+ -webkit-backdrop-filter
174
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
175
+ .list-item-link > span > span
176
+ color: rgba(107, 114, 128, 1)
177
+ display: block
178
+ flex-grow: 1
179
+ font-size: 0.75rem
180
+ font-weight: 300
181
+ line-height: 1rem
182
+ transition-property: background-color, border-color, color, fill, stroke,
183
+ opacity, box-shadow, transform, filter, backdrop-filter,
184
+ -webkit-backdrop-filter
185
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
186
+ .list-item-link svg:last-child
187
+ height: 1rem
188
+ transition-property: all
189
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
190
+ transition-duration: 150ms
191
+ width: 1rem
192
+ .list-item-link:hover
193
+ color: rgba(255, 255, 255, 1)
194
+ background-color: hsla(162, 55%, 33%, 1)
195
+ .list-item-link:hover > span > span
196
+ color: rgba(243, 244, 246, 1)
197
+ .list-item-link:hover svg:last-child
198
+ transform: translateX(0.25rem)
199
+ .button-pill
200
+ padding: 1.5rem 2rem
201
+ margin-bottom: 2rem
202
+ transition-duration: 300ms
203
+ transition-property: background-color, border-color, color, fill, stroke,
204
+ opacity, box-shadow, transform, filter, backdrop-filter,
205
+ -webkit-backdrop-filter
206
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
207
+ align-items: center
208
+ display: flex
209
+ .button-pill svg
210
+ transition-property: background-color, border-color, color, fill, stroke,
211
+ opacity, box-shadow, transform, filter, backdrop-filter,
212
+ -webkit-backdrop-filter
213
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
214
+ transition-duration: 150ms
215
+ flex-shrink: 0
216
+ width: 3rem
217
+ .button-pill > span
218
+ letter-spacing: -0.025em
219
+ font-weight: 400
220
+ font-size: 1.125rem
221
+ line-height: 1.75rem
222
+ padding-left: 1rem
223
+ padding-right: 1rem
224
+ .button-pill span span
225
+ display: block
226
+ font-size: 0.875rem
227
+ font-weight: 300
228
+ line-height: 1.25rem
229
+ .button-pill:hover svg, .button-pill:hover
230
+ color: rgba(255, 255, 255, 1) !important
231
+ .nx-console:hover
232
+ background-color: rgba(0, 122, 204, 1)
233
+ .nx-console svg
234
+ color: rgba(0, 122, 204, 1)
235
+ .nx-console-jetbrains
236
+ margin-top: 2rem
237
+ .nx-console-jetbrains:hover
238
+ background-color: rgba(255, 49, 140, 1)
239
+ .nx-console-jetbrains svg
240
+ color: rgba(255, 49, 140, 1)
241
+ #nx-repo:hover
242
+ background-color: rgba(24, 23, 23, 1)
243
+ #nx-repo svg
244
+ color: rgba(24, 23, 23, 1)
245
+ #nx-cloud
246
+ margin-bottom: 2rem
247
+ margin-top: 2rem
248
+ padding: 2.5rem 2rem
249
+ #nx-cloud > div
250
+ align-items: center
251
+ display: flex
252
+ #nx-cloud > div svg
253
+ border-radius: 0.375rem
254
+ flex-shrink: 0
255
+ width: 3rem
256
+ #nx-cloud > div h2
257
+ font-size: 1.125rem
258
+ font-weight: 400
259
+ letter-spacing: -0.025em
260
+ line-height: 1.75rem
261
+ padding-left: 1rem
262
+ padding-right: 1rem
263
+ #nx-cloud > div h2 span
264
+ display: block
265
+ font-size: 0.875rem
266
+ font-weight: 300
267
+ line-height: 1.25rem
268
+ #nx-cloud p
269
+ font-size: 1rem
270
+ line-height: 1.5rem
271
+ margin-top: 1rem
272
+ #nx-cloud pre
273
+ margin-top: 1rem
274
+ #nx-cloud a
275
+ border-radius: 0.75rem
276
+ color: white
277
+ background-color: hsla(214, 62%, 21%, 1)
278
+ display: inline-block
279
+ margin-top: 1.5rem
280
+ padding: 0.5rem 1rem
281
+ text-align:left
282
+ text-decoration: inherit
283
+ #commands
284
+ padding: 2.5rem 2rem
285
+ margin-top: 3.5rem
286
+ #commands h2
287
+ font-size: 1.25rem
288
+ font-weight: 400
289
+ letter-spacing: -0.025em
290
+ line-height: 1.75rem
291
+ padding-left: 1rem
292
+ padding-right: 1rem
293
+ #commands p
294
+ font-size: 1rem
295
+ font-weight: 300
296
+ line-height: 1.5rem
297
+ margin-top: 1rem
298
+ padding-left: 1rem
299
+ padding-right: 1rem
300
+ details
301
+ align-items: center
302
+ display: flex
303
+ margin-top: 1rem
304
+ padding-left: 1rem
305
+ padding-right: 1rem
306
+ width: 100%
307
+ details pre > span
308
+ color: rgba(181, 181, 181, 1)
309
+ summary
310
+ border-radius: 0.5rem
311
+ display: flex
312
+ font-weight: 400
313
+ padding: 0.5rem
314
+ cursor: pointer
315
+ transition-property: background-color, border-color, color, fill, stroke,
316
+ opacity, box-shadow, transform, filter, backdrop-filter,
317
+ -webkit-backdrop-filter
318
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
319
+ transition-duration: 150ms
320
+ summary:hover
321
+ background-color: rgba(243, 244, 246, 1)
322
+ summary svg
323
+ height: 1.5rem
324
+ margin-right: 1rem
325
+ width: 1.5rem
326
+ #love
327
+ color: rgba(107, 114, 128, 1)
328
+ font-size: 0.875rem
329
+ line-height: 1.25rem
330
+ margin-top: 3.5rem
331
+ opacity: 0.6
332
+ text-align: center
333
+ #love svg
334
+ color: rgba(252, 165, 165, 1)
335
+ width: 1.25rem
336
+ height: 1.25rem
337
+ display: inline
338
+ margin-top: -0.25rem
339
+ @media screen and (min-width: 768px)
340
+ #hero
341
+ grid-template-columns: repeat(2, minmax(0, 1fr))
342
+ #hero .logo-container
343
+ display: flex
344
+ #middle-content
345
+ grid-template-columns: repeat(2, minmax(0, 1fr))
346
+ gap: 4rem
347
+ </style>
348
+ <% } else { %>
14
349
  <style>
15
350
  html {
16
351
  -webkit-text-size-adjust: 100%;
@@ -425,6 +760,7 @@ import { Component, ViewEncapsulation } from '@angular/core';
425
760
  }
426
761
  }
427
762
  </style>
763
+ <% } %>
428
764
  <div class="wrapper">
429
765
  <div class="container">
430
766
  <!-- WELCOME -->