Browse Source

landing page: background image darkened with prelim menu

master
Sean Clarke 12 months ago
parent
commit
97b539f3c0
  1. 46
      css/main.css
  2. BIN
      favicon.ico
  3. BIN
      img/image-landing.png
  4. BIN
      img/logo-header.png
  5. 39
      index.html
  6. BIN
      seanland-brew-co.png

46
css/main.css

@ -0,0 +1,46 @@
:root {
--gold-font: #f5bb00;
}
html {
/* font-family: "Comic Sans MS", cursive, sans-serif; */
font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;
text-align: center;
color: var(--gold-font);
}
body {
width: 100%;
background-image: url("../img/image-landing.png");
background-position: center;
background-position: top;
background-size: 1920px 1080px;
}
#logo-header{
width: 125px;
}
#header {
position: fixed;
top 0;
width: 100%;
}
#menu {
font-weight: 1000;
letter-spacing: 0.15em;
list-style-type: none;
margin: 0;
padding: 0;
}
#menu li {
display: inline;
padding: 16px;
margin: 8px;
}
#image-landing {
width: 100%;
}

BIN
favicon.ico

BIN
img/image-landing.png

After

Width: 1920  |  Height: 1080  |  Size: 1.3 MiB

BIN
img/logo-header.png

After

Width: 1216  |  Height: 1216  |  Size: 136 KiB

39
index.html

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="Seanland Brew Co.">
<meta name="author" content="Sean Clarke">
<title>Seanland Brew Co.</title>
<!-- Favicon -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<!-- Bootstrap core CSS -->
<link href="css/main.css" rel="stylesheet">
<!-- Font Awesome Icons -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
</head>
<body>
<!-- add logo and menu -->
<section id="header">
<div>
<img id="logo-header" src="img/logo-header.png" />
</div>
<!-- Menu -->
<ul id="menu">
<li>BEER</li>
<li>RECIPES</li>
<li>PROJECTS</li>
<li>EVENTS</li>
<li>STORE</li>
<li>CONTACT</li>
</ul>
</section>
<!--
<div>
<img id="image-landing" src="img/image-landing.png" />
</div> -->
<!-- Logo sits above menu -->
<!-- section 1 - about brewery -->
</body>

BIN
seanland-brew-co.png

After

Width: 1216  |  Height: 1216  |  Size: 136 KiB

Loading…
Cancel
Save