1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-23 06:51:12 +02:00

website: ui tweaks

This commit is contained in:
Kushagra Gour
2019-03-14 23:28:34 +05:30
parent 07be86c313
commit d83a245f14
4 changed files with 37 additions and 9 deletions

14
packages/website/404.html Normal file
View File

@@ -0,0 +1,14 @@
---
title: 404
layout: default
permalink: /404.html
excludeFromSitemap: true
---
<div class="ta-c">
<figure>
<img src="/images/404.png" style="width:65vh" />
<figcaption>Image by https://icons8.com</figcaption>
</figure>
<p>Uh oh, the page you wanted to see isn't here. How about <a href="/">going to the homepage</a>?</p>
</div>

View File

@@ -22,7 +22,7 @@
} }
body { body {
font-family: Arial; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
background: white; background: white;
min-height: 100vh; min-height: 100vh;
line-height: 1.4; line-height: 1.4;
@@ -63,6 +63,10 @@
font-size: inherit; font-size: inherit;
} }
figcaption {
color: #6a6a6a;
}
.homepage-title { .homepage-title {
font-size: 3.1em; font-size: 3.1em;
margin: 0; margin: 0;
@@ -75,6 +79,7 @@
padding: 0.7em; padding: 0.7em;
max-width: 1200px; max-width: 1200px;
margin: 0 auto; margin: 0 auto;
min-height: 55vh;
} }
@media screen and (max-width: 400px) { @media screen and (max-width: 400px) {
@@ -120,7 +125,7 @@
.btn { .btn {
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
padding: 10px 20px; padding: 10px 2em;
display: inline-block; display: inline-block;
border-radius: 8px; border-radius: 8px;
text-transform: uppercase; text-transform: uppercase;
@@ -134,11 +139,12 @@
.download-btn { .download-btn {
color: white; color: white;
background-color: #4d7bd6; background: linear-gradient(to bottom, #4d7bd6, #3c5d9e);
border: 2px solid #4569b1; border: 2px solid #32508b;
border-bottom-color: #4870b3;
line-height: 2.5rem; line-height: 2.5rem;
margin: 1rem 0 0; margin: 1rem 0 0;
width: 80%; /* width: 80%; */
text-decoration: none; text-decoration: none;
} }
@@ -175,6 +181,10 @@
padding: 0.5em; padding: 0.5em;
} }
.site-header__logo {
width: 50px;
height: 20px
}
.site-footer { .site-footer {
text-align: center; text-align: center;
@@ -232,6 +242,7 @@
.info { .info {
display: none; display: none;
visibility: hidden;
} }
.people-say { .people-say {
@@ -366,7 +377,6 @@
} }
.info { .info {
display: block;
background: white; background: white;
box-shadow: 0 -10px 35px rgba(0, 0, 0, 0.15); box-shadow: 0 -10px 35px rgba(0, 0, 0, 0.15);
padding: 2rem; padding: 2rem;
@@ -383,6 +393,8 @@
} }
.info.show { .info.show {
display: block;
visibility: visible;
transform: translateY(0); transform: translateY(0);
} }
@@ -451,9 +463,11 @@
<header class="site-header"> <header class="site-header">
<div> <div>
<h2 style="display: inline;"> <h2 style="display: inline;">
<a href="/"><svg width="100" height="40"> <a href="/">
<svg class="site-header__logo">
<use xlink:href="#logo"></use> <use xlink:href="#logo"></use>
</svg> Web Maker</a> </svg> Web Maker
</a>
</h2> </h2>
</div> </div>
<div> <div>

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

View File

@@ -2,7 +2,7 @@
layout: default.html layout: default.html
--- ---
<h2 style="font-size: 2em; " class="ta-c">What you get</h2> <h2 style="font-size: 2em; " class="ta-c">Awesome Features</h2>
<div class="flex feature-box"> <div class="flex feature-box">
<div class="feature"> <div class="feature">