白黒のコード - フィンランドが好きな建築学生のブログ

今日は、ホームページやブログのデザインをシンプルにしてみました。

ここに以前のコードを書き残してみます。

/* <system section="theme" selected="17391345971627985862"> */
@import "https://usercss.blog.st-hatena.com/-/theme/17391345971627985862.css?version=2ad88a3541937ac3188b00db334b7ef03498f56b";
/* </system> */

/* <system section="background" selected="default"> */
/* default */
/* </system> */
<div class="movie-wrap">
<iframe width="560" height="315" src="https://www.youtube.com/embed/1rfC0CZyVhQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

.movie-wrap {
position: relative;
padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
height: 0;
overflow: hidden;
}

.movie-wrap iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/*クリック前の色*/
.hatena-module-profile a:link {color:#ffffff;}
/*クリック後*/
.hatena-module-profile a:visited {color:#ffffff;}
/*マウスを重ねた時*/
.hatena-module-profile a:hover {color:#ffffff;}

・サイドバーのカテゴリーのリンク色を青色にする
/*クリック前の色*/
.hatena-module-category a:link {color:#ffffff;}
/*クリック後*/
.hatena-module-category a:visited {color:#ffffff;}
/*マウスを重ねた時*/
.hatena-module-category a:hover {color:#ffffff;}

/*クリック前の色*/
.hatena-module-recent-entries a:link {color:#ffffff;}
/*クリック後*/
.hatena-module-recent-entries a:visited {color:#ffffff;}
/*マウスを重ねた時*/
.hatena-module-recent-entries a:hover {color:#ffffff;}

/*クリック前の色*/
.hatena-module-entries-access-ranking" a:link {color:#ffffff;}
/*クリック後*/
.hatena-module-entries-access-ranking" a:visited {color:#ffffff;}
/*マウスを重ねた時*/
.hatena-module--entries-access-ranking" a:hover {color:#ffffff;}

/*クリック前の色*/
.hatena-module-archive a:link {color:#ffffff;}
/*クリック後*/
.hatena-module-archive a:visited {color:#ffffff;}
/*マウスを重ねた時*/
.hatena-module-archive a:hover {color:#ffffff;}

/*タイトル*/
#title a{
color: #ffffff;
font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳＰ明朝", "ＭＳ明朝", serif;
}
}

/*ブログ説明*/
#blog-description {
color: #ffffff;
}

/*記事日付*/
.date- .date a,.date-first .date a{
font-size:15px;
color:#ffffff
}
/*記事タイトル*/
.entry-title{
color: #ffffff;
font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳＰ明朝", "ＭＳ明朝", serif;
}

.entry-title{
color: #ffffff;
/*background-color: #000000;*/
}
.entry-title a{
color: #ffffff;
font-size:18px;
font-weight:700;
font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳＰ明朝", "ＭＳ明朝", serif;
}
.entry-title a:hover{
color:#000000;
text-decoration:none;
border-bottom:1px solid #000;
background:#fffff
}

/*記事本文*/
.entry-content {
color: #ffffff;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳＰ明朝", "ＭＳ明朝", serif;
}

/*記事タイトル横カテゴリー*/
.categories{margin:4px 0 16px;display:inline-block;float:right}
.categories a{
color:#DA70D6;
font-size:13px;
margin:0 0 0 7px
}
.categories a:hover{
color:#000000;
text-decoration:none;
border-bottom:1px solid #000;
background:#DA70D6
}

/*編集*/
.entry-header-menu a{
padding:7px 7px 5px;
line-height:1;
display:block;
/*background:#DA70D6;*/
color:#DA70D6;
}
.entry-header-menu a:hover{
background:#DA70D6;
color:#000000;
}

/*記事本文*/
.entry-content {
color: #ffffff;
}
/*記事本文リンク*/
.entry-content a{
color:#ffffff;
/*text-decoration:none;*/
/*border-bottom:1px solid #777*/
}
/*記事本文リンクマウスオーバー*/
.entry-content a:hover{
color:#000000;
text-decoration:none;
border-bottom:1px solid #000;
background:#ffffff
}
/*はてなキーワード*/
.entry-content .keyword{
color:#000;
text-decoration:none;
border-bottom:1px solid #000
}
.entry-content .keyword:hover{
color:#000;
text-decoration:none;
border-bottom:1px solid #000;
background:none
}

/*大見出し*/
.entry-content h3{
color: #000000;
border-bottom:1px solid #000;
padding:0 0 0px;
/*padding:0 0 50px;*/
font-weight:700;
margin:56px 0 16px;
font-size:18px
}
/*中見出し*/
.entry-content h4{
/*background: #0000ff;*/
padding:8px 0 0;
font-weight:700;
margin:32px 0 8px;
line-height:1
}
.entry-content h4:before{
content:"";width:14px;
height:14px;border-radius:50%;
display:block;background:#20B2AA;
float:left;margin:1px 5px 0 0
}
/*小見出し*/
.entry-content h5,.entry-content h6{
/*background: #ffff00;*/
font-weight:700;
margin:32px 0 8px
}
/*フッター*/
.entry-footer{
color: #ffffff;
margin:16px 0 0
}
.entry-footer-time a{
color: #ffffff;
border:none
}
.entry-footer-time a:hover{
color: #000000
}

/* 目次*/
.table-of-contents {
background:#none;
border: 1px solid #ffffff;
color:#ffffff;
}
.table-of-contents a{
/*text-decoration:none;*/
color:#ffffff;
}
.table-of-contents a:hover{
background:#ffffff
}
.table-of-contents:before {
content: "目次";
font-size: 100%;
font-weight:bold;
color:#ffffff;
}
/*表見出し*/
.section table th {
background:#000000;
}
/*表通常*/
.section table td {
background:#ffffff;
}

/* right */
.hatena-module{margin:0 0 32px}

/*サイドバー見出しリンク*/
.hatena-module-title a{
/*background-color: #ffffff;*/
color:#ffffff!important;
border:none
}
/*サイドバー*/
.hatena-module-title a:hover{text-decoration:underline}
.hatena-module-title{
color: #ffffff;
/*background-color: #ffffff;*/
font-weight:700;
text-decoration:none;
margin:0 0 8px;
font-size:14px;
font-family:Helvetica Neue,Helvetica,Univers,Arial,Hiragino Kaku Gothic Pro,Meiryo,MS PGothic,sans-serif
}

/*プロフィール*/
.hatena-module-profile{
color: #ffffff;
letter-spacing:0
}

/*最新記事*/
.hatena-module-recent-entries{
color: #ffffff;
}

/*プロフィール*/
.hatena-module-profile{
color: #ffffff;
}

/*注目記事*/
.hatena-module-recent-entries{
color: #ffffff;
}

/*カテゴリー*/
.hatena-module-categories{
color: #ffffff;
}

/*リンク*/
.hatena-module-links{
color: #ffffff;
}
/*月別アーカイブ*/
.hatena-module-archive{
color: #ffffff;
}

/*記事一覧ページ*/
.page-archive .archive-entry{
color:#ffffff;
margin-bottom:50px;
border: 1px #ffffff solid;
padding: 15px;
align-items: center;
box-sizing: border-box;
justify-content: space-around
}
/*カテゴリーページのヘッダー(無かったので追加)*/
.archive-heading{
color:#ffffff;
}

/* サイドバー */
.side a{
color: #ffffff;
}
.side a:link{
color: #ffffff;
}
.side a:visited{
color: #ffffff;
}
.side a:hover{
color: #ffffff;
}

/* サイドバー吹き出し */

.hatena-module-title {

color: #ffffff;

}