chore: add logo to coming soon screen

This commit is contained in:
Zotov Ivan Yuryevich
2026-06-27 12:45:32 +03:00
parent 33262c12b8
commit 593c11f306
2 changed files with 22 additions and 7 deletions

BIN
public/logo.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

View File

@@ -18,10 +18,13 @@ Astro.response.headers.set('X-Robots-Tag', 'noindex, nofollow')
</head> </head>
<body> <body>
<div class="screen"> <div class="screen">
<h1 class="logo"> <div class="brand">
<span class="logo__line">СОФТ</span> <h1 class="logo">
<span class="logo__line logo__line--indent">КЛИК</span> <span class="logo__line">СОФТ</span>
</h1> <span class="logo__line logo__line--indent">КЛИК</span>
</h1>
<img class="brand__logo" src="/logo.jpg" alt="СОФТКЛИК" />
</div>
<div class="media"> <div class="media">
<img class="astronaut" src="/astronaut.png" alt="Космонавт" /> <img class="astronaut" src="/astronaut.png" alt="Космонавт" />
@@ -70,13 +73,23 @@ Astro.response.headers.set('X-Robots-Tag', 'noindex, nofollow')
overflow: hidden; overflow: hidden;
} }
.logo { .brand {
grid-column: 1; grid-column: 1;
grid-row: 1; grid-row: 1;
align-self: start; align-self: start;
margin: 0; display: flex;
align-items: center;
/* top padding and size track viewport height so it fits at any height */ /* top padding and size track viewport height so it fits at any height */
padding: clamp(20px, 10vh, 100px) var(--pad) 0 var(--pad); padding: clamp(20px, 10vh, 100px) var(--pad) 0 var(--pad);
overflow: hidden;
}
.brand__logo {
flex: none;
width: clamp(96px, min(14vw, 24vh), 220px);
height: auto;
}
.logo {
margin: 0;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
line-height: 0.88; line-height: 0.88;
@@ -123,9 +136,11 @@ Astro.response.headers.set('X-Robots-Tag', 'noindex, nofollow')
grid-template-columns: 1fr; grid-template-columns: 1fr;
grid-template-rows: auto minmax(0, 1fr) auto; grid-template-rows: auto minmax(0, 1fr) auto;
} }
.logo { .brand {
grid-column: 1; grid-column: 1;
grid-row: 1; grid-row: 1;
}
.logo {
font-size: clamp(36px, min(16vw, 11vh), 72px); font-size: clamp(36px, min(16vw, 11vh), 72px);
} }
.media { .media {