無名
This commit is contained in:
harukin
+45
@@ -0,0 +1,45 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="./style2.css">
|
||||
<meta name="flattr:id" content="xjd3yw">
|
||||
<link href="https://fonts.googleapis.com/css?family=Noto+Serif+JP:700&subset=japanese" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/earlyaccess/sawarabimincho.css" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css?family=PT+Serif" rel="stylesheet">
|
||||
</head>
|
||||
<header>
|
||||
<a href="./index.html" style="width: 70px;">
|
||||
<div class="circle">
|
||||
<img src="./picture/28 - 1.png" class="circleimage" alt="">
|
||||
</div>
|
||||
</a>
|
||||
<a style="margin:auto;"></a>
|
||||
<a style="width: 150px; right: 0px;">
|
||||
<div class="text">
|
||||
<span id="view_clock"></span>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
timerID = setInterval('clock()',500); //0.5秒毎にclock()を実行
|
||||
|
||||
function clock() {
|
||||
document.getElementById("view_clock").innerHTML = getNow();
|
||||
}
|
||||
|
||||
function getNow() {
|
||||
var now = new Date();
|
||||
var year = +now.getFullYear();
|
||||
var mon = now.getMonth()+1; //１を足すこと
|
||||
var day = now.getDate();
|
||||
var hour = ("00"+now.getHours()).slice(-2);
|
||||
var min = ("00"+now.getMinutes()).slice(-2);
|
||||
var sec = ("00"+now.getSeconds()).slice(-2);
|
||||
|
||||
//出力用
|
||||
var s = hour + ":" + min + "</br>" + year + "/" + mon + "/" + day;
|
||||
return s;
|
||||
}
|
||||
</script>
|
||||
</header>
|
||||
+88
@@ -0,0 +1,88 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>harukinトップページ</title>
|
||||
<script src="./jquery-3.3.1.min.js"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
$("#frame").load("frame2.html");
|
||||
});
|
||||
</script>
|
||||
<meta name="flattr:id" content="xjd3yw">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main>
|
||||
<h1>haruk.inはharukinによる趣味のためのサイトです。</h1>
|
||||
<h2>倉庫です。</h2>
|
||||
<div class="box" style="background: url('./picture/connectwork.png'); color: aliceblue;">
|
||||
<div class="br22"></div>
|
||||
<h1>OSSを活かしたサービス（遊び）</h1>
|
||||
<div class="box-line">
|
||||
<div class="box-half">
|
||||
<a href="https://plus.haruk.in" class="box-4" style="background-color: rgba(255, 255, 255, 0.39);">
|
||||
<h1>Hubzilla</h1>
|
||||
<img src="https://plus.haruk.in/picture/icon.png" width=30%>
|
||||
<p>phpで動くFacebook似なSNSです。</p>
|
||||
</a>
|
||||
<a href="https://gitlab.haruk.in" class="box-4" style="background-color: rgba(255, 255, 255, 0.39);">
|
||||
<h1>Gitlab</h1>
|
||||
<img src="https://png.icons8.com/color/1600/gitlab.png" width=30%>
|
||||
<p>Githubのフォークを目指したGitソフトウェアです。</p>
|
||||
</a>
|
||||
</div>
|
||||
<div class="box-half">
|
||||
<a href="https://mattermost.haruk.in" class="box-4" style="background-color: rgba(255, 255, 255, 0.39);">
|
||||
<h1>mattermost</h1>
|
||||
<img src="./picture/logoVertical_WS.png" width=30%>
|
||||
<p>Slackのフォークを目指したソフトウェアです。Gitlabアカウントを接続して利用します。</p>
|
||||
</a>
|
||||
<a href="https://nexcloud.haruk.in" class="box-4" style="background-color: rgba(255, 255, 255, 0.39);">
|
||||
<h1>nextcloud</h1>
|
||||
<img src="./picture/icon-nextcloud-white.svg" width=30%>
|
||||
<p>DropboxやOneDriveのようなクラウドストレージです。メールや通話機能などもあります。</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="box-line">
|
||||
<div class="box-half">
|
||||
<a href="./MinecraftServer.html" class="box-4" style="background-color: rgba(255, 255, 255, 0.39);">
|
||||
<h1>Minecraft BE server</h1>
|
||||
<img src="./picture/73fc5ada842bf9aaaefaf82aac364a31.png.jpg" width=30%>
|
||||
<p>公式サーバーソフトを利用しているきままなサバイバルサーバーです。</p>
|
||||
</a>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="box" style="background: url('./picture/connectwork.png'); color: aliceblue;">
|
||||
<div class="br22"></div>
|
||||
<h1>製作ソフトウェア</h1>
|
||||
<div class="box-line">
|
||||
<div class="box-half">
|
||||
<a href="https://harukin0731.github.io/Atsumori" class="box-4" style="background-color: rgba(255, 255, 255, 0.39);">
|
||||
<h1>熱盛タイム</h1>
|
||||
<p style="margin-bottom: 0px;">(published by Xprocess)</p>
|
||||
<img src="https://lh3.googleusercontent.com/iiFmIE16v-F38t1R03ug-nesApZsnH0eLl4Oyfr0HKaKukl6m5WPzPyOs8YY_W7dhw=s180"
|
||||
width=50%>
|
||||
<p style="margin-top: 0px;">貴方のスマホが突zアツモリィィィッッッ！！</p>
|
||||
</a>
|
||||
<a href="https://harukin0731.github.io/qsqt.html" class="box-4" style="background-color: rgba(255, 255, 255, 0.39);">
|
||||
<h1>QSQT</h1>
|
||||
<p>(published by Xprocess)</p>
|
||||
<img src="https://lh3.googleusercontent.com/rrT3G1Xthe3Ypr9RfVVwgadFh7vY9tpTksrglgozvaG2nnDFpaOLzNREZxDlaM8o4w=s180"
|
||||
width=40%>
|
||||
<p>痒いとこに手が届くメモツール</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="br20"></div>
|
||||
<div class="br20"></div>
|
||||
<div class="br20"></div>
|
||||
<div class="br20"></div>
|
||||
</main>
|
||||
<div id="frame"></div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,128 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>JR四国列車運行情報表示支援ブックマークレット</title>
|
||||
<script src="./jquery-3.3.1.min.js"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
$("#frame").load("frame.html");
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main>
|
||||
|
||||
<div class="box" style="background-color: rgba(255, 255, 255, 0.726);">
|
||||
<div class="br22"></div>
|
||||
<h1>JR四国列車運行情報表示支援ブックマークレット</h1>
|
||||
<h2>JR四国の列車運行情報を自動更新させるスクリプトです。</h2>
|
||||
<p>使い方：</p>
|
||||
<p>1 <a class="btn btn-success" href="javascript:setTimeout(after%2C5000)%3Bfunction%20after()%7Bdocument.getElementById('refreshIcon').click()%3BsetTimeout(after%2C5000)%3B%7Dvoid(0);">ここを長押ししてコピーしてください。</a></p>
|
||||
<p>(上を長押ししてブックマークへの追加が表示される場合は追加してください。表示されない場合はコピーして下へ。)</p>
|
||||
<div class="gallerybase"><img src="./picture/Screenshot_20180915-115730.png" class="gallery"></div>
|
||||
<p>2 下の共有ボタンからこのサイトをブックマークに追加してください。</p>
|
||||
<div class="gallerybase"><img src="./picture/Screenshot_20180915-115902.png" class="gallery"></div>
|
||||
<p>3 ブックマークの編集をして今登録したページのurlを消去してペーストしてください。</p>
|
||||
<div class="br22"></div>
|
||||
</div>
|
||||
<div class="box" style="background-color: rgba(255, 255, 255, 0.726);">
|
||||
<div class="br22"></div>
|
||||
<h1>ルール</h1>
|
||||
<div class="rule">
|
||||
<h2>共有物以外のものを勝手に使用しない</h2>
|
||||
<p>共有物である人工物は大抵その旨が近くの看板に記されています。そこの決まりに従って共有物を使用してください。</p>
|
||||
<h2>相手が嫌になることをしない</h2>
|
||||
<p>基準は相手です。皆が不快に思うことはしないようにしましょう。</p>
|
||||
</div>
|
||||
<div class="br22"></div>
|
||||
</div>
|
||||
<div class="box" style="background-color: rgba(255, 255, 255, 0.726);">
|
||||
<div class="br22"></div>
|
||||
<h1>サーバー情報</h1>
|
||||
<h3>アドレス : haruk.in</h3>
|
||||
<h3>ポート : 19132(ipv4) or 19133(ipv6)</h3>
|
||||
<div class="br22"></div>
|
||||
</div>
|
||||
<div class="br20"></div>
|
||||
<div class="br20"></div>
|
||||
<div class="br20"></div>
|
||||
<div class="br20"></div>
|
||||
|
||||
</main>
|
||||
<div id="frame"></div>
|
||||
</body>
|
||||
|
||||
<head>
|
||||
<script>
|
||||
function copyToClipboard() {
|
||||
var copyFrom = document.createElement("textarea");
|
||||
// テキストエリアへ値をセット
|
||||
copyFrom.textContent = "javascript:setTimeout(after%2C5000)%3Bfunction%20after()%7Bdocument.getElementById('refreshIcon').click()%3BsetTimeout(after%2C5000)%3B%7Dvoid(0);";
|
||||
|
||||
// bodyタグの要素を取得
|
||||
var bodyElm = document.getElementsByTagName("body")[0];
|
||||
// 子要素にテキストエリアを配置
|
||||
bodyElm.appendChild(copyFrom);
|
||||
|
||||
// テキストエリアの値を選択
|
||||
copyFrom.select();
|
||||
// コピーコマンド発行
|
||||
var retVal = document.execCommand('copy');
|
||||
// 追加テキストエリアを削除
|
||||
bodyElm.removeChild(copyFrom);
|
||||
// コピーをお知らせする
|
||||
alert("コピーできました！続きに従ってください！");
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.gallery {
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.gallery:hover {
|
||||
box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, 0.61);
|
||||
transition: all 300ms 0s;
|
||||
}
|
||||
|
||||
.gallerybase {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.gallerybase::after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
content: "";
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
|
||||
z-index: -1;
|
||||
background: white;
|
||||
transform: rotate(5deg);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
transition: all 300ms 0s;
|
||||
}
|
||||
|
||||
.gallerybase:hover::after {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
.box>.rule {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.rule>h2::before {
|
||||
content: "○";
|
||||
}
|
||||
|
||||
.rule>p::before {
|
||||
content: "*";
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
+178
@@ -0,0 +1,178 @@
|
||||
html{
|
||||
background: url("./picture/what-the-hex.png")center center / cover no-repeat fixed;
|
||||
color: rgb(0, 0, 0);
|
||||
margin: 0px;
|
||||
}
|
||||
body{
|
||||
margin: 0%;
|
||||
}
|
||||
main{
|
||||
text-align: center;
|
||||
margin: 0px;
|
||||
position: relative;
|
||||
float: right;
|
||||
width: calc(100% - 200px);
|
||||
font-family: 'PT Serif', serif , "Sawarabi Mincho";
|
||||
}
|
||||
header{
|
||||
width:100vw;
|
||||
height: 50px;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
background:linear-gradient(to bottom, rgba(156, 156, 156, 0.644), rgba(36, 35, 35, 0.562));
|
||||
text-align: center;
|
||||
font-family: 'Noto Serif JP', sans-serif;
|
||||
transition: all 300ms 0s;
|
||||
display: flex;
|
||||
}
|
||||
header a{
|
||||
height: 50px;
|
||||
max-height:100px;
|
||||
transition: all 300ms 0s;
|
||||
display: flex;
|
||||
width:200px;
|
||||
color: rgb(255, 255, 255);
|
||||
text-decoration: none;
|
||||
}header a:hover{
|
||||
box-shadow: 5px 5px 5px 0px rgba(206, 206, 206, 0.856) inset;
|
||||
background: rgba(247, 207, 162, 0.466);
|
||||
}
|
||||
.text{
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.big{
|
||||
font-size: 20px;
|
||||
}
|
||||
.small{
|
||||
font-size: 15px;
|
||||
}
|
||||
.circle{
|
||||
width: auto;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
background-color: rgb(252, 241, 229);
|
||||
object-fit: cover;
|
||||
margin:auto;
|
||||
box-shadow: 10px 10px 10px 10px rgba(0,0,0,0.4);
|
||||
}
|
||||
.circleimage{
|
||||
border-radius: 50%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.box{
|
||||
width:calc(100% - 20px);
|
||||
margin: 10px;
|
||||
border-radius: 0.5%;
|
||||
color: black;
|
||||
box-shadow: 10px 10px 10px 10px rgba(0,0,0,0.4);
|
||||
transition: all 300ms 0s;
|
||||
}
|
||||
.box-line{
|
||||
display: flex;
|
||||
transition: all 300ms 0s;
|
||||
}
|
||||
.box-half{
|
||||
display: flex;
|
||||
width: 50%;
|
||||
transition: all 300ms 0s;
|
||||
}
|
||||
.box-4{
|
||||
width:calc(50% - 10px);
|
||||
margin: 5px;
|
||||
border-radius: 3%;
|
||||
color: black;
|
||||
box-shadow: 5px 5px 5px 5px rgba(0,0,0,0.4);
|
||||
text-decoration: none;
|
||||
transition: all 300ms 0s;
|
||||
}
|
||||
.box-4:hover{
|
||||
box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, 0.658);
|
||||
}
|
||||
.boxitem{
|
||||
margin: auto;
|
||||
display: table-cell;
|
||||
width: 100px;
|
||||
}
|
||||
.box-4>img{
|
||||
transition: all 300ms 0s;
|
||||
}
|
||||
.box-4:hover>img{
|
||||
filter: drop-shadow(10px 10px 10px rgba(75, 75, 75, 0.685));
|
||||
}
|
||||
.br22 {
|
||||
height: 10px;
|
||||
clear: left;
|
||||
}
|
||||
h1{
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1130px) {
|
||||
.box-line {
|
||||
display: block;
|
||||
}
|
||||
.box-half{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 700px) {
|
||||
main{
|
||||
float: unset;
|
||||
width: 100%;
|
||||
}
|
||||
header{
|
||||
width:100vw;
|
||||
height: 45px;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.4) inset;
|
||||
}
|
||||
header a{
|
||||
background: linear-gradient( rgba(219, 170, 113, 0.925),rgb(255, 255, 255));
|
||||
height:100px;
|
||||
box-shadow: 0px 0px 5px 0px rgba(206, 206, 206, 0.856) inset;
|
||||
display: flex;
|
||||
width:200px;
|
||||
color: rgb(38, 40, 41);
|
||||
text-decoration: none;
|
||||
}header a:hover{
|
||||
box-shadow: none;
|
||||
background: linear-gradient( rgba(255, 216, 171, 0.925),rgb(255, 255, 255));
|
||||
}
|
||||
.text{
|
||||
margin-top: unset;
|
||||
}
|
||||
.big{
|
||||
font-size: 15px;
|
||||
}
|
||||
.small{
|
||||
font-size: 10px;
|
||||
}
|
||||
.br20 {
|
||||
height: 20px;
|
||||
clear: left;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 550px) {
|
||||
.box-half{
|
||||
display: grid;
|
||||
}
|
||||
.box-4{
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 450px) {
|
||||
header{
|
||||
height: 30px;
|
||||
}
|
||||
.big{
|
||||
font-size: 10px;
|
||||
}
|
||||
.small{
|
||||
font-size: 7px;
|
||||
}
|
||||
}
|
||||
@@ -59,7 +59,7 @@
|
||||
<div class="box-half">
|
||||
<a href="https://mstdn.jp/@harukin0731" class="box-4" style="background-color: rgba(243, 160, 105, 0.685);">
|
||||
<h3>[email protected]</h3>
|
||||
<img src="https://media.mstdn.jp/images/accounts/avatars/000/028/933/original/1ae1ec65dcfd8867.jpg"
|
||||
<img src="https://media.mstdn.jp/accounts/avatars/000/028/933/original/1ae1ec65dcfd8867.jpg"
|
||||
width=30%>
|
||||
<p>mstdn.jp</p>
|
||||
</a>
|
||||
@@ -79,7 +79,7 @@
|
||||
<div class="box-half">
|
||||
<a href="https://twitter.com/@mhkai00731" class="box-4" style="background-color: rgba(0, 217, 255, 0.767);">
|
||||
<h3>Hairs UK Intelligent</h3>
|
||||
<img src="https://pbs.twimg.com/profile_images/896895547377729538/jWH1XOEE_400x400.jpg" width=30%>
|
||||
<img src="https://pbs.twimg.com/profile_images/1047659033375600640/1qRIEyiu_400x400.jpg" width=30%>
|
||||
<p>Twitter</p>
|
||||
</a>
|
||||
<a href="https://plus.google.com/114801278289524675913" class="box-4" style="background-color: rgb(255, 0, 0, 0.767);">
|
||||
@@ -92,7 +92,7 @@
|
||||
<div class="box-half">
|
||||
<a href="https://www.instagram.com/harukin0731/" class="box-4" style="background-color: rgb(243, 105, 209, 0.767);">
|
||||
<h3>harukin0731</h3>
|
||||
<img src="https://scontent-nrt1-1.cdninstagram.com/vp/c6310c87407f42ab2f2bda2df3aa9ab0/5C40B0FB/t51.2885-19/s150x150/21819937_118392865525629_2711145633984544768_n.jpg"
|
||||
<img src="./picture/21819937_118392865525629_2711145633984544768_n.jpg"
|
||||
width=30%>
|
||||
<p>Instagram</p>
|
||||
</a>
|
||||
|
||||
Reference in New Issue
Block a user