Add upper-left links

This commit is contained in:
Bill Niblock 2016-11-23 13:35:31 -05:00
parent fc98ca204c
commit 2b27303fae

View file

@ -3,26 +3,28 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="UTF-8">
<style> <style>
html { html {
background-color: #0e0e0e; background-color: #0e0e0e; color: #555555; }
color: #555555; }
a { a {
color: #555555; color: #555555; text-decoration: none;
text-decoration: none;
transition: color 1s; } transition: color 1s; }
a:hover { a:hover {
color: #d4d454; color: #d4d454; text-decoration: none;
text-decoration: none;
transition: color 1s; } transition: color 1s; }
body { body {
position: absolute; bottom: 0px; display: table; position: absolute; bottom: 0px; display: table;
width: 100%; height: 100%; width: 100%; height: 100%; margin: 0; padding: 0; }
margin: 0; padding: 0; }
header { header {
position: fixed; top: 0px; right: 0px; position: fixed; top: 5%; right: 5%; height: 50px; }
height: 50px; width: 50px; #icon {
border: 2px solid white;} display: table;
float: left; margin: 0 10px; height: 64px; width: 64px;
background: #270e24; border: 1px solid #270e24; border-radius: 50%;
font-size: 30px; text-align: center; }
#icon a {
display: table-cell; vertical-align: middle; }
#fence { #fence {
display: table-cell; vertical-align: middle; display: table-cell; vertical-align: middle;
margin: 0px auto; width: 1000px; } margin: 0px auto; width: 1000px; }
@ -31,15 +33,14 @@
margin: 25px 46px; padding: 0px 0px 12px 0px; margin: 25px 46px; padding: 0px 0px 12px 0px;
list-style: none; list-style: none;
border: 2px solid #270e24; border-radius: 10px; border: 2px solid #270e24; border-radius: 10px;
background-color: #270e24; } background: #270e24; }
#links #header { #links #header {
background-color: #270e24; background-color: #270e24;
color: lightgray; font-weight: bold; color: lightgray; font-weight: bold;
border-top-right-radius: 10px; border-top-left-radius: 10px; } border-top-right-radius: 10px; border-top-left-radius: 10px; }
#links li { #links li {
padding: 5px 10px; padding: 5px 10px; text-align: center;
background-color: black; background-color: black; }
text-align: center; }
footer { footer {
position: fixed; bottom: 0px; left: 0px; right: 0px; width: 75%; position: fixed; bottom: 0px; left: 0px; right: 0px; width: 75%;
margin: 0px auto; margin: 0px auto;
@ -50,6 +51,9 @@
</head> </head>
<body > <body >
<header> <header>
<div id="icon"><a href="https://mail.google.com">M</a></div>
<div id="icon"><a href="https://drive.google.com">D</a></div>
<div id="icon"><a href="#">L</a></div>
</header> </header>
<!-- Commonly visited links --> <!-- Commonly visited links -->
<section id="fence"> <section id="fence">