Merge pull request #2 from System-x64/main

fixed some alignment bugs
This commit is contained in:
Vaxry 2022-09-27 23:41:35 +01:00 committed by GitHub
commit 5a56e5e116
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 58 additions and 15 deletions

View file

@ -40,13 +40,14 @@ header {
.logo { .logo {
margin-right: auto; margin-right: auto;
margin-left: 40px;
} }
.logo img { .logo img {
width: 240px; width: 190px;
height: auto; height: auto;
padding-top: 20px;
padding-right: 10px;
} }
.nav__links { .nav__links {
@ -77,7 +78,7 @@ header {
.cta { .cta {
margin-left: 20px; margin-left: 20px;
padding: 9px 25px; padding: 16px 25px;
background-color: aquamarine; background-color: aquamarine;
border: none; border: none;
cursor: pointer; cursor: pointer;
@ -149,7 +150,7 @@ header {
width: 200px; width: 200px;
height: 50px; height: 50px;
background-color: aquamarine; background-color: aquamarine;
margin-top: 20px; margin-top: 45px;
transition: all 0.5s ease; transition: all 0.5s ease;
} }
@ -157,7 +158,7 @@ header {
text-align: center; text-align: center;
color:#1a1a2e; color:#1a1a2e;
background-color: aquamarine; background-color: aquamarine;
padding-top: 10px; padding-top: 1rem;
} }
#install-hypr { #install-hypr {
@ -469,19 +470,20 @@ header {
width: 100%; width: 100%;
height: 300px; height: 300px;
} }
.get-started { /* .get-started {
font-family: 'JosefinSans-Regular'; font-family: 'JosefinSans-Regular';
font-size: 34px; font-size: 34px;
color: #cfe8f6; color: #cfe8f6;
padding-left: 10%; padding-left: 10%;
padding-right: 10%;
} }
.get-started a div { .get-started a div {
color: #1a1a2e; color: #1a1a2e;
font-size: 24px; font-size: 24px;
font-family: "Sofia-Pro-Medium"; font-family: "Sofia-Pro-Medium";
padding: 15px 60px; padding: 15px 60px;;
margin-left: 30px; margin-right: 40%;
margin-top: 40px; margin-top: 40px;
margin-bottom: 100px; margin-bottom: 100px;
width: 300px; width: 300px;
@ -490,11 +492,39 @@ header {
} }
.get-started a { .get-started a {
text-decoration: none; text-decoration: none;
} } */
/*
.get-started a div:hover { .get-started a div:hover {
transform: scale(1.2); transform: scale(1.2);
} */
#get-started-button {
width: 330px;
background-color: aquamarine;
padding: 20px 80px;
margin-left: 39%;
margin-bottom: 160px;
transition: all 0.5s ease;
} }
#get-started-button:hover {
transform: scale(1.2);
}
#get-started-button a{
color: #1a1a2e;
background-color: aquamarine;
text-decoration: none;
font-family: "Sofia-Pro-Medium";
font-size: 22px;
}
footer { footer {
font-family: 'Sofia-Pro-Light'; font-family: 'Sofia-Pro-Light';
display: flex; display: flex;
@ -663,6 +693,16 @@ footer a:hover {
.footer-text { .footer-text {
max-width: 250px; max-width: 250px;
} }
#get-started-button {
margin-left: auto;
margin-right: auto;
margin-bottom: 80px;
}
.get-started {
margin-top: 80px;
}
} }
@ -671,9 +711,11 @@ footer a:hover {
padding-left: 5px; padding-left: 5px;
} }
.logo img { .logo img {
width: 180px; width: 160px;
height: auto; height: auto;
} }
.swiper-slide img { .swiper-slide img {
width: 384px; width: 384px;
height: auto; height: auto;
@ -737,6 +779,8 @@ footer a:hover {
.footer-icons { .footer-icons {
margin-left: 20%; margin-left: 20%;
} }
} }

View file

@ -15,7 +15,7 @@
<body> <body>
<header> <header>
<a class="logo" href="/"><img src="svg/hyprland.svg" alt="logo"></a> <a class="logo" href="/"><img src="imgs/hyprland.png" alt="logo"></a>
<nav> <nav>
<ul class="nav__links"> <ul class="nav__links">
<li><a id="home-full" href="https://hyprland.org">Hyprland</a></li> <li><a id="home-full" href="https://hyprland.org">Hyprland</a></li>
@ -144,8 +144,7 @@
<a href="https://github.com/hyprwm/Hyprland#features" style="text-decoration: none;"><h1>And More!</h1></a> <a href="https://github.com/hyprwm/Hyprland#features" style="text-decoration: none;"><h1>And More!</h1></a>
</div> </div>
<div class="get-started"> <div class="get-started">
<h1>Get Started_</h1> <div id="get-started-button"><a href="https://wiki.hyprland.org/Getting-Started/Installation/">Install Hyprland</a></div>
<a href="https://wiki.hyprland.org/Getting-Started/Installation/"><div>Install Hyprland</div></a>
</div> </div>
<hr style="color: #a3a3a3a5; margin: 0px 10%;"> <hr style="color: #a3a3a3a5; margin: 0px 10%;">
<footer> <footer>