Просмотр исходного кода

:sparkles: questionnaire styles added #TODO radio buttons checked correct color

tags/0.0.3^2
K Rob 3 лет назад
Родитель
Сommit
b5a2ba2c7f
2 измененных файлов: 39 добавлений и 14 удалений
  1. 3
    4
      frontend/src/components/onboarding/QuestionResponse.vue
  2. 36
    10
      frontend/src/views/OnboardingView.vue

+ 3
- 4
frontend/src/components/onboarding/QuestionResponse.vue Просмотреть файл

1
 <template lang="pug">
1
 <template lang="pug">
2
-.question.pa12
3
-    header.w-flex.row.justify-space-between.pb6
4
-        label {{question.question}}
2
+w-card.question
3
+    p {{question.question}} 
5
     section.radio-buttons.w-flex.row.justify-space-between
4
     section.radio-buttons.w-flex.row.justify-space-between
6
-        h3(v-for="label in question.labels") {{label}}
5
+        p(v-for="label in question.labels") {{label}}
7
     w-radios.w-flex.row.justify-space-between(@update:model-value="onUpdate" :items="radioItems")
6
     w-radios.w-flex.row.justify-space-between(@update:model-value="onUpdate" :items="radioItems")
8
 </template>
7
 </template>
9
 
8
 

+ 36
- 10
frontend/src/views/OnboardingView.vue Просмотреть файл

62
 .view--onboarding
62
 .view--onboarding
63
     width: 100%
63
     width: 100%
64
     max-width: 428px
64
     max-width: 428px
65
-    height: 100vh
66
     background-color: #fff
65
     background-color: #fff
67
     color: #1F2024
66
     color: #1F2024
68
-    font-family: 'Century Gothic'
67
+    font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif
69
     margin: 0 auto
68
     margin: 0 auto
70
 
69
 
70
+    article
71
+        height: 100vh
72
+
71
     .w-button
73
     .w-button
72
             display: flex
74
             display: flex
73
             width: 315px
75
             width: 315px
90
 
92
 
91
     .w-card
93
     .w-card
92
         background-color: #1F2024
94
         background-color: #1F2024
93
-        font-family: 'Century Gothic' sans-serif
94
-        min-height: 100vh
95
-        height: 100%
96
         justify-content: center
95
         justify-content: center
97
         align-items: center
96
         align-items: center
98
         width: 100%
97
         width: 100%
98
+<<<<<<< HEAD
99
+
100
+        h3
101
+            text-transform: uppercase
102
+=======
103
+
99
 
104
 
100
         h3
105
         h3
101
             text-transform: uppercase
106
             text-transform: uppercase
107
+>>>>>>> 41496c8 (:sparkles: questionnaire styles added #TODO radio buttons checked correct color)
102
             text-align: center
108
             text-align: center
103
             font-size: 28px
109
             font-size: 28px
104
             font-weight: bold
110
             font-weight: bold
124
             margin: 11px auto
130
             margin: 11px auto
125
             font-weight: bold
131
             font-weight: bold
126
             font-size: 16px
132
             font-size: 16px
127
-        .w-select
128
-            padding: 11px
129
-            color: #1F2024
130
-        .search-type
131
-            color: #1F2024
133
+
134
+            .w-select
135
+                padding: 11px
136
+                color: #1F2024
137
+
138
+            .search-type
139
+                color: #1F2024
140
+                height: 50px
141
+
142
+        &.question
143
+            p
144
+                font-size: 18px
145
+                text-align: left
146
+                margin: 7px auto
147
+                font-weight: normal
148
+            section
149
+                p
150
+                    margin: 0
151
+                    font-weight: bold
152
+                    text-transform: capitalize
153
+            .w-radio__input
154
+                background-color: #D93D59
155
+    .w-card__content
156
+        .w-button
132
             height: 50px
157
             height: 50px
158
+            background-color: #5BA626
133
 </style>
159
 </style>

Загрузка…
Отмена
Сохранить