diff options
Diffstat (limited to 'src/styles/welcome.scss')
-rw-r--r-- | src/styles/welcome.scss | 36 |
1 files changed, 22 insertions, 14 deletions
diff --git a/src/styles/welcome.scss b/src/styles/welcome.scss index c1f85391e..7202fe148 100644 --- a/src/styles/welcome.scss +++ b/src/styles/welcome.scss | |||
@@ -1,24 +1,26 @@ | |||
1 | .auth .welcome { | 1 | .auth .welcome { |
2 | height: auto; | 2 | height: auto; |
3 | 3 | ||
4 | &__content { | 4 | &__content { |
5 | align-items: center; | 5 | align-items: center; |
6 | color: #FFF; | 6 | color: #fff; |
7 | display: flex; | 7 | display: flex; |
8 | justify-content: center; | 8 | justify-content: center; |
9 | height: auto; | 9 | height: auto; |
10 | } | 10 | } |
11 | 11 | ||
12 | &__logo { width: 100px; } | 12 | &__logo { |
13 | width: 100px; | ||
14 | } | ||
13 | 15 | ||
14 | &__text { | 16 | &__text { |
15 | border-left: 1px solid #FFF; | 17 | border-left: 1px solid #fff; |
16 | margin-left: 40px; | 18 | margin-left: 40px; |
17 | padding-left: 40px; | 19 | padding-left: 40px; |
18 | 20 | ||
19 | h1 { | 21 | h1 { |
20 | font-size: 60px; | 22 | font-size: 60px; |
21 | letter-spacing: -.4rem; | 23 | letter-spacing: -0.4rem; |
22 | margin-bottom: 5px; | 24 | margin-bottom: 5px; |
23 | } | 25 | } |
24 | 26 | ||
@@ -42,33 +44,35 @@ | |||
42 | text-align: center; | 44 | text-align: center; |
43 | height: auto; | 45 | height: auto; |
44 | 46 | ||
45 | .button:first-of-type { margin-right: 25px; } | 47 | .button:first-of-type { |
48 | margin-right: 25px; | ||
49 | } | ||
46 | } | 50 | } |
47 | 51 | ||
48 | .button { | 52 | .button { |
49 | border-color: #FFF; | 53 | border-color: #fff; |
50 | color: #FFF; | 54 | color: #fff; |
51 | cursor: pointer; | 55 | cursor: pointer; |
52 | 56 | ||
53 | &:hover { | 57 | &:hover { |
54 | background: #FFF; | 58 | background: #fff; |
55 | color: $theme-brand-primary; | 59 | color: $theme-brand-primary; |
56 | } | 60 | } |
57 | 61 | ||
58 | &__inverted { | 62 | &__inverted { |
59 | background: #FFF; | 63 | background: #fff; |
60 | color: $theme-brand-primary; | 64 | color: $theme-brand-primary; |
61 | } | 65 | } |
62 | 66 | ||
63 | &__inverted:hover { | 67 | &__inverted:hover { |
64 | background: none; | 68 | background: none; |
65 | color: #FFF; | 69 | color: #fff; |
66 | } | 70 | } |
67 | } | 71 | } |
68 | 72 | ||
69 | &__featured-services { | 73 | &__featured-services { |
70 | align-items: center; | 74 | align-items: center; |
71 | background: #FFF; | 75 | background: #fff; |
72 | border-radius: 6px; | 76 | border-radius: 6px; |
73 | display: flex; | 77 | display: flex; |
74 | flex-wrap: wrap; | 78 | flex-wrap: wrap; |
@@ -82,9 +86,13 @@ | |||
82 | &__featured-service { | 86 | &__featured-service { |
83 | margin: 0 10px 15px; | 87 | margin: 0 10px 15px; |
84 | height: 35px; | 88 | height: 35px; |
85 | transition: .5s filter, .5s opacity; | 89 | @media (prefers-reduced-motion: no-preference) { |
90 | transition: 0.5s filter, 0.5s opacity; | ||
91 | } | ||
86 | width: 35px; | 92 | width: 35px; |
87 | 93 | ||
88 | img { width: 35px; } | 94 | img { |
95 | width: 35px; | ||
96 | } | ||
89 | } | 97 | } |
90 | } | 98 | } |