|
1 | 1 | <template> |
2 | 2 | <div> |
3 | | - <v-app-bar elevation="0" color="#121212" height="100px"> |
| 3 | + <v-app-bar elevation="0" color="#121212" height="70" fixed> |
4 | 4 | <v-container> |
5 | 5 | <v-row> |
6 | 6 | <v-col class="w-full d-flex"> |
7 | 7 | <h2 |
8 | | - class="text--primary" |
| 8 | + class="text--primary text-h4" |
9 | 9 | :class="{ |
10 | | - 'text-h4': $vuetify.breakpoint.lgAndUp, |
11 | | - 'text-h5': $vuetify.breakpoint.mdAndDown, |
| 10 | + 'mt-5': $vuetify.breakpoint.mdAndDown, |
12 | 11 | }" |
13 | 12 | > |
14 | 13 | <v-avatar |
|
27 | 26 | <v-spacer></v-spacer> |
28 | 27 | <v-btn |
29 | 28 | exact-path |
30 | | - class="primary mt-5" |
| 29 | + class="primary mt-5 mb-5" |
31 | 30 | :large="$vuetify.breakpoint.lgAndUp" |
32 | 31 | :to="{ name: 'login' }" |
33 | 32 | > |
|
44 | 43 | cols="12" |
45 | 44 | md="4" |
46 | 45 | :class="{ |
47 | | - 'text-center': $vuetify.breakpoint.mdAndDown, |
| 46 | + 'text-center pt-16': $vuetify.breakpoint.mdAndDown, |
48 | 47 | 'py-16': $vuetify.breakpoint.lgAndUp, |
49 | 48 | }" |
50 | 49 | > |
51 | | - <h1 class="text-h2" :class="{ 'mt-16': $vuetify.breakpoint.lgAndUp }"> |
| 50 | + <h1 |
| 51 | + class="text-h2 font-weight-bold gradient-header" |
| 52 | + :class="{ |
| 53 | + 'mt-16': $vuetify.breakpoint.lgAndUp, |
| 54 | + 'mt-10': $vuetify.breakpoint.mdAndUp, |
| 55 | + }" |
| 56 | + > |
52 | 57 | Convert your android phone into an SMS gateway. |
53 | 58 | </h1> |
54 | 59 | <h2 class="text--secondary text-h5 mt-8 mb-8"> |
@@ -360,4 +365,11 @@ export default Vue.extend({ |
360 | 365 | .min-h-650 { |
361 | 366 | min-height: 650px; |
362 | 367 | } |
| 368 | +
|
| 369 | +.gradient-header { |
| 370 | + color: #1ad37f; |
| 371 | + background-image: -webkit-linear-gradient(0deg, #1ad37f 14%, #329ef4 55%); |
| 372 | + -webkit-background-clip: text; |
| 373 | + -webkit-text-fill-color: transparent; |
| 374 | +} |
363 | 375 | </style> |
0 commit comments