height: 100%;
}
+ /*
header,main{
max-width: 1100px;
margin: 0 auto;
- }
+ }*/
header h1, .header-description{
display: inline-block;
.box{
cursor: pointer;
display: flex;
- margin-top: 5vh;
+ /* margin-top: 5vh; */
+ padding: 3vh;
+ justify-content: center;
}
main, header{
/* width: 100vw; */
}
+ /*
@media screen and (max-width:999px) {
main, header{
margin: 0;
margin-right: 0.1vw;
}
}
+ */
</style>
element.style.width = MaxWidth + 5 + "px";
})
})
- //console.log(MaxWidthList)
+ console.log(MaxWidthList)
// 中央の空白を設定
/*
window.addEventListener("load",SetStyle);
window.addEventListener("resize",SetStyle);
+ //window.addEventListener("resize", function(){location.reload();});
</script>
</head>
<body>
</header>
<main>
<div class="box-container">
+ <div class="box" data-link="/alter/index.html">
+ <p class="service-name">Alter Linux Alpha Release</p>
+ <p class="service-description">Alter Linuxの限定公開ビルドをダウンロードできるサイト。TailWind CSS最高。</p>
+ </div>
+ <div class="box" data-link="./blog/">
+ <p class="service-name">ハヤオの物置き</p>
+ <p class="service-description">個人的な内容ばかりのブログ。Hugoで構築してるのでそこそこモダン。</p>
+ </div>
<div class="box" data-link="/buildmydist/index.html">
<p class="service-name">【2019年版】Ubuntu系のOSを自作しよう(旧版)</p>
<p class="service-description">昔のハヤオが作ったUbuntu18.04の派生OSを開発するためのサイト。黒歴史。</p>
<p class="service-name">Web NotePad</p>
<p class="service-description">初めて作ったウェブアプリ。LocalStorageにデータを保存する。タブ機能有り。</p>
</div>
+ <div class="box" data-link="/sanmoku">
+ <p class="service-name">三目並べ</p>
+ <p class="service-description">プレーヤーの人数やマス目を自由に設定できるおかしな三目並べ</p>
+
+ </div>
<div class="box" data-link="/sleep/index.php">
<p class="service-name">n秒後に反応するサイト</p>
<p class="service-description">ウェブのタイムアウトなどを検証するためにあえて遅延させるサイト。</p>
</div>
</main>
</body>
-</html>
\ No newline at end of file
+</html>