Expand Mail/Cloud to include multiple options
This commit is contained in:
parent
66156b7a58
commit
5cb56e8e6e
1 changed files with 30 additions and 19 deletions
|
@ -6,26 +6,26 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>++ H O M E ++</title>
|
||||
<style>
|
||||
html {
|
||||
background-color: #0e0e0e; color: #555555; }
|
||||
a {
|
||||
color: #555555; text-decoration: none; transition: color 1s; }
|
||||
a:hover {
|
||||
color: #d4d454; text-decoration: none; transition: color 1s; }
|
||||
html { background-color: #0e0e0e; color: #555555; }
|
||||
a { color: #555555; text-decoration: none; transition: color 1s; }
|
||||
a:hover { color: #d4d454; text-decoration: none; transition: color 1s; }
|
||||
body {
|
||||
position: absolute; bottom: 0px; display: table;
|
||||
width: 100%; height: 100%; margin: 0; padding: 0; }
|
||||
header {
|
||||
position: fixed; top: 5%; right: 5%; height: 50px; }
|
||||
#icon {
|
||||
display: table;
|
||||
float: left; margin: 0 10px; height: 64px; width: 64px;
|
||||
header { position: fixed; top: 3%; right: 3%; height: 50px; }
|
||||
#icons { display: table-cell; vertical-align: middle; }
|
||||
#category {
|
||||
float: left; margin: 0px; padding: 0px 20px; list-style: none; }
|
||||
#category li {
|
||||
color: lightgray; font-weight: bold;
|
||||
text-align: center; padding: 10px 0px; }
|
||||
#category li:first-child { border-bottom: 2px solid #270e24; }
|
||||
#category a {
|
||||
display: table-cell; width: 50px; height: 50px;
|
||||
background: #270e24; border: 1px solid #270e24; border-radius: 50%;
|
||||
font-size: 30px; text-align: center; }
|
||||
#icon a {
|
||||
display: table-cell; vertical-align: middle; color: lightgray; }
|
||||
#icon a:hover {
|
||||
color:#d4d454; text-decoration:none; transition: color 1s; }
|
||||
vertical-align: middle; color: lightgray; }
|
||||
#category a:hover {
|
||||
color: #d4d454; text-decoration: none; transition: color 1s; }
|
||||
#fence {
|
||||
display: table-cell; vertical-align: middle;
|
||||
margin: 0px auto; width: 1000px; }
|
||||
|
@ -50,9 +50,19 @@
|
|||
</head>
|
||||
<body >
|
||||
<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>
|
||||
<ul id="icons">
|
||||
<ul id="category">
|
||||
<li>Mail</li>
|
||||
<li><a href="https://mail.google.com">G</a></li>
|
||||
<li><a href="https://www.yahoo.com/mail">Y</a></li>
|
||||
</ul>
|
||||
<ul id="category">
|
||||
<li>Cloud</li>
|
||||
<li><a href="https://drive.google.com">D</a></li>
|
||||
<li><a href="https://cyberthunderdesigns.com/owncloud">L</a></li>
|
||||
<li><a href="https://github.com">GH</a></li>
|
||||
</ul>
|
||||
</ul>
|
||||
</header>
|
||||
<!-- Commonly visited links -->
|
||||
<section id="fence">
|
||||
|
@ -75,6 +85,7 @@
|
|||
</ul>
|
||||
<ul id="links">
|
||||
<li id="header">Read</li>
|
||||
<li><a href="https://feedly.com">Feedly</a></li>
|
||||
<li><a href="https://news.ycombinator.com/">Hacker News</a></li>
|
||||
<li><a href="https://lobste.rs/">Lobsters</a></li>
|
||||
<li><a href="https://www.reddit.com">Reddit</a></li>
|
||||
|
|
Loading…
Reference in a new issue