Skip to content

Commit 5d1d7c0

Browse files
author
Milind Deore
committed
Updated invite theme to match with Privitty theme
1 parent a5cf99c commit 5d1d7c0

4 files changed

Lines changed: 60 additions & 36 deletions

File tree

background.png

-97.7 KB
Loading

download.html

Lines changed: 25 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@
1010
<meta property="og:url" content="https://i.privittytech.com">
1111

1212
<link rel="icon" href="identity.png" sizes="any" type="image/svg+xml">
13+
<link rel="preconnect" href="https://fonts.googleapis.com">
14+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
15+
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
1316

1417
<title>Get Privitty Chat - Privitty Chat</title>
1518
<style>
@@ -20,9 +23,9 @@
2023
}
2124

2225
body {
23-
font-family: Arial, Avant Garde, Avantgarde, Century Gothic, CenturyGothic, AppleGothic, sans-serif;
24-
background-color: #f4f4f4;
25-
color: #333;
26+
font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
27+
background-color: #F8F5FF;
28+
color: #2d2a3a;
2629
display: flex;
2730
flex-direction: column;
2831
align-items: center;
@@ -31,8 +34,7 @@
3134

3235
nav {
3336
width: 100%;
34-
background-color: #159957;
35-
background-image: linear-gradient(120deg, #051551, #854DFF);
37+
background-color: #7F66C5;
3638
display: flex;
3739
justify-content: center;
3840
align-items: center;
@@ -102,7 +104,7 @@
102104

103105
.container a {
104106
text-decoration: none;
105-
color: #007BFF;
107+
color: #7F66C5;
106108
font-size: 16px;
107109
}
108110

@@ -111,7 +113,8 @@
111113
}
112114

113115
.download-platform {
114-
background-color: #ccd6fe;
116+
background-color: rgba(127, 102, 197, 0.12);
117+
border: 1px solid rgba(127, 102, 197, 0.2);
115118
border-radius: 10px;
116119
padding: 10px;
117120
display: none;
@@ -134,9 +137,9 @@
134137
justify-content: center;
135138
height: 48px;
136139
padding: 5px;
137-
background: #111;
140+
background: #7F66C5;
138141
color: white;
139-
border: 2px solid #444;
142+
border: 2px solid #6b52b0;
140143
box-sizing: border-box;
141144
border-radius: 10px;
142145
text-decoration: none;
@@ -150,20 +153,21 @@
150153
}
151154

152155
.download-platform-android {
153-
background-color: #ccd6fe;
156+
background-color: rgba(127, 102, 197, 0.12);
157+
border: 1px solid rgba(127, 102, 197, 0.2);
154158
border-radius: 10px;
155159
padding: 10px;
156160
display: none;
157161
}
158162

159163
#show-all-platforms a {
160-
color: #333;
164+
color: #2d2a3a;
161165
}
162166

163167
#show-all-platforms a::before {
164168
content: "▶ ";
165169
margin-right: 6px;
166-
color: #333;
170+
color: #7F66C5;
167171
}
168172

169173
#android-header {
@@ -181,7 +185,7 @@
181185
.coming-soon h1 {
182186
font-size: 2em;
183187
margin: 10px 0;
184-
color: #007BFF;
188+
color: #7F66C5;
185189
}
186190

187191
.footer-links {
@@ -193,24 +197,28 @@
193197

194198
footer {
195199
margin-top: auto;
196-
background-color: #e3e3e3;
200+
background-color: #7F66C5;
197201
color: white;
198202
text-align: center;
199203
padding: 10px;
200204
width: 100%;
201205
}
202206

203207
footer p,
204-
li {
205-
color: #333;
208+
footer li {
209+
color: #F8F5FF;
206210
}
207211

208212
footer .footer-links li a {
209213
margin: 0 10px;
210-
color: #007BFF;
214+
color: #F8F5FF;
211215
text-decoration: none;
212216
}
213217

218+
footer .footer-links li a:hover {
219+
text-decoration: underline;
220+
}
221+
214222
@media only screen and (min-width: 640px) {
215223
.container {
216224
margin: 0 auto;

identity.png

50.2 KB
Loading

index.html

Lines changed: 35 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,9 @@
1717
<meta property="twitter:site" content="@privitty_chat">
1818

1919
<link rel="icon" href="identity.png" sizes="any" type="image/svg+xml">
20+
<link rel="preconnect" href="https://fonts.googleapis.com">
21+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
22+
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
2023

2124
<script src="./qr.min.js"></script>
2225
<script src="./i18n/i18next.min.js"></script>
@@ -28,23 +31,27 @@
2831
<style>
2932
:root {
3033
--pad: 8px;
31-
--dc-color-1: #051551;
32-
--dc-color-2: #854DFF;
33-
--dc-gradient: linear-gradient(120deg, var(--dc-color-1), var(--dc-color-2));
34+
--privitty-primary: #7F66C5;
35+
--privitty-primary-dark: #6b52b0;
36+
--privitty-foreground: #F8F5FF;
37+
--privitty-gradient: linear-gradient(135deg, var(--privitty-primary) 0%, var(--privitty-primary-dark) 100%);
3438
}
3539

3640
body {
3741
margin: 0;
3842

39-
font-family: Arial, Avant Garde, Avantgarde, Century Gothic, CenturyGothic, AppleGothic, sans-serif;
40-
font-size: 12pt;
43+
font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
44+
font-size: 14pt;
4145

42-
background: url('background.png');
46+
background: var(--privitty-foreground);
47+
background-image: url('background.png');
4348
background-size: 500px;
49+
background-color: var(--privitty-foreground);
50+
color: #2d2a3a;
4451
}
4552

4653
a {
47-
color: #1e6bb8;
54+
color: var(--privitty-primary);
4855
text-decoration: none;
4956
}
5057

@@ -55,10 +62,10 @@
5562

5663
header {
5764
padding: var(--pad);
58-
font-family: Arial, 'Helvetica Neue', Helvetica;
65+
font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
5966
font-size: 18pt;
60-
background: var(--dc-gradient);
61-
box-shadow: 0px 0px 3px #888;
67+
background: var(--privitty-primary);
68+
box-shadow: 0 2px 8px rgba(127, 102, 197, 0.25);
6269
}
6370

6471
header a {
@@ -85,9 +92,9 @@
8592

8693
#box {
8794
border-radius: 16px;
88-
background: white;
89-
padding: 15px;
90-
box-shadow: 0px 0px 10px #ccc;
95+
background: var(--privitty-foreground);
96+
padding: 24px;
97+
box-shadow: 0 4px 24px rgba(127, 102, 197, 0.12);
9198

9299
max-width: 420px;
93100
margin-left: auto;
@@ -113,14 +120,22 @@
113120
#dc-link,
114121
.download,
115122
.share-link {
116-
padding: 10px;
123+
padding: 12px 20px;
117124
border-radius: 30px;
118-
font-size: 10pt;
119-
font-weight: bold;
125+
font-size: 11pt;
126+
font-weight: 600;
120127
text-transform: uppercase;
128+
letter-spacing: 0.5px;
121129
text-decoration: none;
122130
color: white;
123-
background: var(--dc-gradient);
131+
background: var(--privitty-primary);
132+
transition: background 0.2s ease, transform 0.1s ease;
133+
}
134+
135+
#dc-link:hover,
136+
.download:hover,
137+
.share-link:hover {
138+
background: var(--privitty-primary-dark);
124139
}
125140

126141
/* circle numbers for ol https://jsfiddle.net/j2gK8/ */
@@ -167,8 +182,9 @@
167182
top: -10px;
168183
border-radius: 999px;
169184

170-
color: var(--dc-color-2);
171-
background: #f4f4f4;
185+
color: var(--privitty-primary);
186+
background: rgba(127, 102, 197, 0.08);
187+
border: 1px solid rgba(127, 102, 197, 0.2);
172188
font-size: 14pt;
173189
text-align: center;
174190
}

0 commit comments

Comments
 (0)