Find file
Fetching contributors…
Cannot retrieve contributors at this time
155 lines (153 sloc) 4.8 KB
<!-- Save this HTML file and set it as your browser startpage e.g. -->
<!DOCTYPE html>
<link rel="icon" href="favicon.ico">
`--------´ `------´
<meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, minimum-scale=1.0, user-scalable=no">
<script type="text/javascript">
function getTime(){
var t=new Date(),nhour=t.getHours(),nmin=t.getMinutes();
if(nmin<=9) nmin="0"+nmin;
body {
width: 100%;
min-height: 100vh;
background-image: url(''); /* comment this line out to use solid color bg */
background-color: #9F1749;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
font-family: 'Helvetica', sans-serif;
margin: 0;
padding: 0;
.wrapper {
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: center;
min-height: 100vh;
width: 100%;
.box-item {
margin: 24px;
width: 240px;
text-align: center;
.item-heading {
border-top: 6px solid rgba(159,23,73,0.1);
border-right: 6px solid rgba(159,23,73,0.1);
border-left: 6px solid rgba(159,23,73,0.1);
height: 55px;
line-height: 54px;
background: rgba(228,231,236,0.6);
font-weight: 900;
color: #DF2353;
font-size: 1.4em;
ul {
background: rgba(42,54,59, 0.6);
border: 6px solid rgba(159,23,73,0.1);
padding: 20px 0px 20px 0px;
margin: 0;
min-height: 230px;
li {
padding: 14px 0;
font-size: 1em;
font-weight: normal;
list-style: none;
li a, a:link, a:visited, a:focus {
color: white;
text-decoration: none;
cursor: pointer;
li a:hover {
color: #F1C1CF;
cursor: pointer;
font-weight: 700;
text-decoration: none;
#clock {
position: fixed;
font-family: 'Verdana', sans-serif;
bottom: 10px;
right: 10px;
font-size: .62em;
color: rgb(247,194,54);
<base target="_blank"> <!-- lets all links open in a new window -->
<div class="wrapper">
<div class="box-item">
<div class="item-heading">タイム</div>
<li><a href="">/g/</a> <a href="">/gd/</a> <a href="">/biz/</a></li>
<li><a href="">フェイスブック</a></li>
<li><a href="">Reddit</a></li>
<li><a href="">YouTube</a></li>
<li><a href="">Twitch</a></li>
<div class="box-item">
<div class="item-heading">ワーク</div>
<li><a href="">Github</a></li>
<li><a href="">Smashing Magazine</a></li>
<li><a href="">CSS Tricks</a></li>
<li><a href="">GoogleDev</a></li>
<li><a href="">MDN</a></li>
<div class="box-item">
<div class="item-heading">ツール</div>
<li><a href="">DistroWatch</a></li>
<li><a href="">Trello</a></li>
<li><a href="">やっつける</a></li>
<li><a href="">Gmail</a></li>
<li><a href="">Translate</a></li>
<div class="box-item">
<div class="item-heading">タイム</div>
<li><a href="">ツイッター</a></li>
<li><a href="">LinkedIn</a></li>
<li><a href="">Béhance</a></li>
<li><a href="">Uplabs</a></li>
<li><a href="">Dribbble</a></li>
<div id="clock"></div> <!-- comment out or remove this line to remove clock -->