@@ -22,32 +22,16 @@ function dismiss() {
22
22
23
23
<template >
24
24
<div class =" banner" v-if =" open" >
25
- <p class =" vt-banner-text" >
26
- <span class =" vt-text-primary" >
27
- <span style =" color :#f97844 " >Mad</span >
28
- <span >Vue</span >
29
- </span >
30
- <span class =" vt-tagline" > · The Vue.js Event in Madrid</span >
31
- <span class =" vt-place" > · Spain</span >
32
- <span class =" vt-date" > · 29 May 2025</span >
33
- <a target =" _blank" class =" vt-primary-action"
34
- href =" https://madvue.es/?utm_source=vuejs&utm_content=top_banner" >
35
- Register
36
- </a >
37
- </p >
25
+ <a target =" _blank" ></a >
38
26
<button @click =" dismiss" >
39
27
<VTIconPlus class =" close" />
40
28
</button >
41
- <p class =" vt-banner-text vt-coupon" >
42
- <span class =" vt-text-primary" >Early bird</span > tickets available
43
- <span class =" vt-text-primary" >Get 30% off</span >
44
- </p >
45
29
</div >
46
30
</template >
47
31
48
32
<style >
49
33
html :not (.banner-dismissed ) {
50
- --vt-banner-height : 60 px ;
34
+ --vt-banner-height : 30 px ;
51
35
}
52
36
</style >
53
37
@@ -66,10 +50,12 @@ html:not(.banner-dismissed) {
66
50
font-weight : 600 ;
67
51
color : #fff ;
68
52
background-color : var (--vt-c-green );
69
- background : #0f172a ;
70
- display : flex ;
71
- justify-content : center ;
72
- align-items : center ;
53
+ background : linear-gradient (
54
+ 90deg ,
55
+ rgba (66 , 184 , 131 , 1 ) 0% ,
56
+ rgba (39 , 179 , 137 , 1 ) 19% ,
57
+ rgba (100 , 126 , 255 , 1 ) 100%
58
+ );
73
59
}
74
60
75
61
.banner-dismissed .banner {
@@ -84,7 +70,7 @@ button {
84
70
position : absolute ;
85
71
right : 0 ;
86
72
top : 0 ;
87
- padding : 20 px 10 px ;
73
+ padding : 5 px ;
88
74
}
89
75
90
76
.close {
@@ -93,64 +79,10 @@ button {
93
79
fill : #fff ;
94
80
transform : rotate (45deg );
95
81
}
96
-
97
- .vt-banner-text {
98
- color : #fff ;
99
- font-size : 16px ;
100
- }
101
-
102
- .vt-text-primary {
103
- color : #c4d141 ;
104
- }
105
-
106
- .vt-primary-action {
107
- background : #f97844 ;
108
- color : #fff ;
109
- padding : 6px 12px ;
110
- border-radius : 5px ;
111
- font-size : 14px ;
112
- text-decoration : none ;
113
- margin : 0 20px ;
114
- font-weight : bold ;
115
- }
116
-
117
- .vt-primary-action :hover {
118
- text-decoration : none ;
119
- background : #c4d141 ;
120
- }
121
-
122
- @media (max-width : 1280px ) {
123
- .banner .vt-banner-text {
124
- font-size : 14px ;
125
- }
126
-
127
- .vt-tagline {
82
+ /*
83
+ @media (max-width: 720px) {
84
+ a > span {
128
85
display: none;
129
86
}
130
- }
131
-
132
- @media (max-width : 780px ) {
133
- .vt-tagline {
134
- display : none ;
135
- }
136
-
137
- .vt-coupon {
138
- display : none ;
139
- }
140
-
141
- .vt-primary-action {
142
- margin : 0 10px ;
143
- padding : 5px 8px ;
144
- }
145
-
146
- .vt-time-now {
147
- display : none ;
148
- }
149
- }
150
-
151
- @media (max-width : 560px ) {
152
- .vt-place {
153
- display : none ;
154
- }
155
- }
156
- </style >
87
+ } */
88
+ </style >
0 commit comments