Skip to content

Commit

Permalink
[Issue-108] Update style for Welcome screen
Browse files Browse the repository at this point in the history
  • Loading branch information
lw committed Aug 2, 2024
1 parent b6e029a commit 78bd9fd
Show file tree
Hide file tree
Showing 19 changed files with 31 additions and 36 deletions.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-Bold.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-BoldItalic.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-ExtraBold.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-ExtraBoldItalic.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-ExtraLight.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-ExtraLightItalic.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-Italic.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-Light.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-LightItalic.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-Medium.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-MediumItalic.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-Regular.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-SemiBold.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/fonts/PlusJakartaSans/PlusJakartaSans-SemiBoldItalic.ttf
View file
Binary file not shown.
Binary file modified packages/webapp/public/images/startup-screen/token-1.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified packages/webapp/public/images/startup-screen/token-2.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified packages/webapp/public/images/startup-screen/token-3.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed packages/webapp/public/images/startup-screen/token-4.png
View file
Binary file not shown.
67 changes: 31 additions & 36 deletions packages/webapp/public/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,68 +40,59 @@
<!-- Font injection -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<style>
/* latin */
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/plusjakartasans/v8/LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko20yygg_vb.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
font-family: 'Plus Jakarta Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/plusjakartasans/v8/LDIoaomQNQcsA88c7O9yZ4KMCoOg4Ko20yygg_vb.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
</style>

<style>
.startup-screen {
overflow: hidden;
}

.startup-screen-title {
font-size: 36px;
line-height: 47px;
font-size: 40px;
line-height: 52px;
color: #000;
font-weight: 700;
max-width: 220px;
max-width: 240px;
position: relative;
z-index: 10;
margin-top: 44px;
margin-top: 40px;
margin-left: 28px;
margin-bottom: 16px;
}

.startup-screen-subtitle {
font-size: 20px;
margin-left: 28px;
line-height: 1.32;
color: #000;
font-weight: 600;
position: relative;
z-index: 10;
}

.startup-screen-mockup-1 {
position: absolute;
width: 252px;
width: 238px;
height: auto;
top: 37px;
top: 42px;
right: -77px;
z-index: 5;
}

.startup-screen-mockup-2 {
position: absolute;
width: 71px;
width: 123px;
height: auto;
top: 217px;
right: 162px;
top: 200px;
right: 156px;
z-index: 5;
}

.startup-screen-mockup-3 {
position: absolute;
width: 148px;
width: 84px;
height: auto;
top: 292px;
right: 4px;
top: 303px;
right: 10px;
z-index: 5;
}

Expand All @@ -115,16 +106,16 @@
right: -53px;
}

@media screen and (max-height: 739px) {
@media screen and (max-height: 700px) {
.startup-screen-mockup-4 {
bottom: auto;
top: 378px
top: 334px;
}
}
</style>

<!-- Import base CSS -->
<link href="/fonts/lexend.css" rel="stylesheet">
<link href="/fonts/PlusJakartaSans/index.css" rel="stylesheet">
<link href="/assets/reset.css?v=3" rel="stylesheet">

<script src="https://telegram.org/js/telegram-web-app.js?v=7.7"></script>
Expand Down Expand Up @@ -182,7 +173,11 @@
<div id="root"></div>
<div id="loading-placeholder" class="startup-screen" style="position:fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 2000">
<div class="startup-screen-title">
Welcome to Playnation Telegram’s app
Welcome to Playnation
</div>

<div class="startup-screen-subtitle">
Your airdrop is loading...
</div>

<img class="startup-screen-mockup-1" src="/images/startup-screen/token-1.png" alt="mockup-1">
Expand Down

0 comments on commit 78bd9fd

Please sign in to comment.