james/miles-city-council
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

css fixes

Browse Source
This commit is contained in:
scoliono 2021-04-28 21:10:28 -07:00
parent 6e605eec2e
commit f973a9ab9b
3 changed files with 32 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
css/main.css
View File

@ -1,5 +1,6 @@
* {
--page-bg: rgb(22, 41, 216);
--banner-dark-bg: rgb(32, 2, 145);
--banner-bg: rgb(255, 255, 255);
--button-bg: rgb(234, 215, 73);
--button-hover: rgb(219, 200, 58);
@ -13,10 +14,13 @@
src: url(../assets/Navigo-Bold.ttf);
}
html {
scroll-behavior: smooth;
}
body {
font-family: Navigo Bold;
background-color: var(--page-bg);
scroll-behavior: smooth;
}
a {
@ -24,7 +28,8 @@ a {
}
nav {
position: sticky;
position: fixed;
width: 100vw;
top: 0;
z-index: 9;
display: flex;
@ -46,12 +51,19 @@ nav a:hover {
.main-banner {
position: relative;
background-color: var(--banner-bg);
top: 6rem;
top: 50vh;
transform: translateY(-50%);
left: 4.5rem;
padding: 1rem 2.5rem;
width: 550px;
}
.main-banner img {
display: block;
margin: 1.5rem auto;
width: 70%;
}
.main-banner-buttons {
display: flex;
}

13
index.html
View File

@ -4,20 +4,21 @@
<meta charset="utf-8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha512-NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w==" crossorigin="anonymous">
<link rel="stylesheet" href="css/main.css">
<link rel="fav icon" href="assets/favicon.png">
<title>Miles Linden for City Council</title>
</head>
<body>
<div id="home"></div>
<nav>
<nav id="main-nav">
<a href="#home">Home</a>
<a href="#about">About</a>
<a href="#contact">Contact</a>
<a href="#donate">Donate</a>
<a href="#joinus">Join</a>
<a href="#donate">Donate</a>
<a href="#contact">Contact</a>
</nav>
<div id="landing" class="fullpage">
<div class="main-banner">
<img src="assets/4chan.png" width="550" height="200">
<img src="assets/myles-logo.png">
<div class="main-banner-buttons">
<a href="#donate">Donate</a>
<a href="#joinus">Join</a>
@ -27,11 +28,11 @@
<div id="about" class="fullpage">
</div>
<div id="contact" class="fullpage">
<div id="joinus" class="fullpage">
</div>
<div id="donate" class="fullpage">
</div>
<div id="joinus" class="fullpage">
<div id="contact" class="fullpage">
</div>
</body>
</html>

10
js/scroll.js Normal file
View File

@ -0,0 +1,10 @@
document.addEventListener("DOMContentReady", function () {
var navLinks = document.querySelectorAll("#main-nav > a");
for (var link of navLinks) {
link.addEventListener("click", function (e) {
document.querySelector(this.getAttribute("href")).scrollIntoView({
behavior: "smooth"
});
});
}
});