Categories: R10コンピュータ

Twenty Fourteenテーマ改造 メモ (CSS部)

Twenty Fourteen改造の作業メモ

今回のスタイルシート変更の差分を抽出してメモっておきます。

長いので、コードのみ・・・

/*
Theme Name: Twenty Fourteen child
Theme URI: http://asakita.net/kabekin/twenty-fourteen-child
Author: the kabekin
Author URI: http://asakita.net/kabekin
Template: twentyfourteen
Description: Twenty Fourteen child theme
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, green, white, light, dark, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
Text Domain: twenty-fourteen-child
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/h1,
h2,
h3,
h4,
h5,
h6 {
 clear: both;
 font-weight: 700;
 margin: 36px 0 12px;
}
/* H1～H3を弄るとサイドバー等もデザインが変わるのでできればH4以降でカスタマイズ */h1 {
 font-size: 26px;
 line-height: 1.3846153846;
}
h2 {
 font-size: 24px;
 line-height: 1;
}
h3 {
 font-size: 22px;
 line-height: 1.0909090909;
}
h4 {
    /*+++ Kabekin Modify 20150328 装飾付き見出し 26px(H1相当) */ /* font-size: 20px;
 line-height: 1.2; */    font-size: 26px;
 line-height: 1.3846153846;
 border-left:12px solid #48832C;
 padding:3px 15px;
}
h5 {
    /*+++ Kabekin Modify 20150328 装飾付き見出し 22px(H2相当) */    /* font-size: 18px;
 line-height: 1.3333333333; */ font-size: 22px;
 line-height: 1.0909090909;
 border-left:8px solid #48832C;
 border-bottom:1px solid #48832C;
 padding:3px 15px 5px;
}
h6 {
    /*+++ Kabekin Modify 20150328 装飾付き見出し 22px(H3相当) */ /* font-size: 16px;
 line-height: 1.5; */ font-size: 22px;
 line-height: 1.0909090909;
    border-bottom:1px solid #48832C;
 padding:3px 15px 5px;
}
table,
th,
td {
 /*+++ Kabekin Modify 20150325 テーブルの罫線を黒色に変更 */ /* border: 1px solid rgba(0, 0, 0, 0.1); */ border: 1px solid #000000;
}
/* Input fields */input,
textarea {
 /*+++ Kabekin Modify 20150328 入力欄の枠線色変更 */ /* border: 2px solid rgba(0, 0, 0, 0.1); */ border: 1px solid #000000;
 border-radius: 2px;
 color: #2b2b2b;
 padding: 8px 10px 7px;
}
textarea {
 /* コメント欄背景色 */ background: #ffffff;
 width: 100%;
}
/* Responsive images. Fluid images for posts, comments, and widgets */.comment-content img,
.entry-content img,
.entry-summary img,
#site-header img,
.widget img,
.wp-caption {
 max-width: 100%;
 /* Kabekin Add 20150321 画像に枠線を入れる */ border: 1px #000000 solid;
}
/**
 * Make sure images with WordPress-added height and width attributes are
 * scaled correctly.
 */.comment-content img[height],
.entry-content img,
.entry-summary img,
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"],
#site-header img {
 height: auto;
}
img.size-full,
img.size-large,
.wp-post-image,
.post-thumbnail img {
 height: auto;
 max-width: 100%;
 /* Kabekin Add 20150321 画像に枠線を入れる */ border: 1px #000000 solid;
}
.alignright {
 float: right;
 /*+++ Kabekin Add 20150323 右寄せ位置調整 */ /* position: relative;
 left: -140px; */}
/**
 * 3.0 Basic Structure
 * -----------------------------------------------------------------------------
 */.site {
 /*+++ Kabekin Modify 20150325 コンテンツエリア色変更 #fff->fffff0 */ background-color: #ffffff0;
 max-width: 1260px;
 position: relative;
 /*+++ Kabekin Add 20150325 コンテンツエリア中央寄せ */ margin: 0 auto;
}
.site-navigation a {
 color: #fff;
 display: block;
    /* Kabekin Modify 20150321 大文字変換を無効 */ /* text-transform: uppercase; */ text-transform: none;
}
.site-content .entry-header,
.site-content .entry-content,
.site-content .entry-summary,
.site-content .entry-meta,
.page-content {
 margin: 0 auto;
 max-width: 840px;
}
.entry-title {
 font-size: 33px;
 font-weight: 300;
 line-height: 1.0909090909;
 margin-bottom: 12px;
 margin: 0 0 12px 0;
 /* text-transform: uppercase; *+++  Kabekin Modify 20150321 */ text-transform: none;
 /*+++ Kabekin Add 20150325 コンテンツエリア色追加 #fffff0 */ background-color: #fffff0;
}
.site-content .entry-header {
 /*+++ Kabekin Modify 20150328 記事背景色変更 */ background-color: #fffff0;
 padding: 0 10px 12px;
}
/**
 * 6.3 Entry Meta
 * -----------------------------------------------------------------------------
 */.entry-meta {
 clear: both;
 color: #767676;
 /*+++ Kabekin Modify 20150321 エントリ情報の文字を大きく */ font-size: 20px;
 font-weight: 400;
 line-height: 1.3333333333;
    /*+++ Kabekin Commentout 20150328 エントリ情報のuppercase中止 */ /* text-transform: uppercase; */}
.site-content .entry-meta {
    /*+++ Kabekin Modify 20150325 コンテンツエリア色変更 #fff->#fffff0 */ background-color: #fffff0;
 margin-bottom: 8px;
}
.site-content .entry-content,
.site-content .entry-summary,
.page-content {
 /*+++ Kabekin 20150409 Modify #fff->#fffff0 */   background-color: #fffff0;
 padding: 12px 10px 0;
}
.entry-content .more-link {
 white-space: nowrap;
    /*+++ Kabekin Add 20150321 続きを読むを太字で大きく */   font-weight:bold;
 font-size:x-large;
}
.post-navigation,
.image-navigation {
 margin: 24px auto 48px;
 max-width: 840px;
 padding: 0 10px;
}
/**
 * 6.9 Archives
 * -----------------------------------------------------------------------------
 */.archive-header,
.page-header {
 margin: 24px auto;
 max-width: 840px;
}
.contributor-info {
 margin: 0 auto;
 max-width: 840px;
}
.comments-area {
 margin: 48px auto;
 max-width: 840px;
 padding: 0 10px;
}
/**
 * 10.0 Multisite
 * -----------------------------------------------------------------------------
 */.site-main .widecolumn {
 padding-top: 72px;
 width: auto;
}
.site-main .mu_register,
.widecolumn > h2,
.widecolumn > form {
 margin: 0 auto 48px;
 max-width: 840px;
 padding: 0 30px;
}
 .list-view .site-content .hentry {
  /*+++ Kabekin Modify 20150328 投稿ページ記事区切り線の太さ変更 1px->4px */    border-top: 4px solid rgba(0, 0, 0, 0.1);
  padding-top: 48px;
 }
 .content-area {
  float: left;
  width: 100%;
    /*+++ Kabekin 20150411 Add */    background-color: #fffff0;
 }
 .archive-header,
 .comments-area,
 .image-navigation,
 .page-header,
 .page-content,
 .post-navigation,
 .site-content .entry-content,
 .site-content .entry-summary,
 .site-content footer.entry-meta {
  padding-right: 30px;
  padding-left: 30px;
    /*+++ Kabekin Add 20150328 横幅縮小時の記事背景色 */    background-color: #ffffff0;
 }
 .masthead-fixed .site-main {
  margin-top: 48px;
    /*+++ Kabekin Add 20150325 コンテンツエリア色追加 #fffff0 */  background-color: #fffff0;
 }
 /* Primary Navigation */ .primary-navigation {
  float: right;
    /*+++ Kabekin Add 20150323 トップメニュの文字を少し大きく 非選択時=11->18px */  font-size: 18px;
  margin: 0 1px 0 -12px;
  padding: 0;
    /* Kabekin Modify 20150321 大文字変換を無効 */  /* text-transform: uppercase; */  text-transform: none;
 }
 .primary-navigation li:hover > a,
 .primary-navigation li.focus > a {
  background-color: #24890d;
  color: #fff;
    /*+++ Kabekin Add 20150323 トップメニュの文字を少し大きく 選択時=20px */    font-size: 20px;
 }
@media screen and (min-width: 846px) {
 .content-area,
 .content-sidebar {
  padding-top: 72px;
 /*+++ Kabekin Add 20150325 コンテンツエリア色追加 #fffff0 */    background-color: #ffffff0;
 }
 #secondary {
          /*+++ Kabekin 20150325 Commentout サイドバーの左右バランスを調整 */  /*background-color: transparent; */  border: 0;
  clear: none;
  float: left;
  margin: 0 0 0 -100%;
  min-height: 100vh;
  width: 122px;
 }
 .secondary-navigation a {
  padding: 10px 30px;
    /*+++ Kabekin 20150323 Add サイドメニューの文字を大きく 非選択時＝18px */    font-size: 18px;
 }
 .secondary-navigation li:hover > a,
 .secondary-navigation li.focus > a {
  background-color: #24890d;
  color: #fff;
  /*+++ Kabekin 20150323 Add サイドメニューの文字を大きく 選択時＝20px */  font-size: 20px;
 }
 .footer-sidebar .widget,
 .primary-sidebar .widget {
  /* Kabekin Modify 20150323 サイドバーの文字を少し大きく 12px->16px */    font-size: 16px;
  line-height: 1.5;
 }
 .footer-sidebar .widget .widget-title,
 .primary-sidebar .widget .widget-title {
  /*+++ Kabekin Modify 20150323 サイドバーメニュー文字を少し大きく 11px->14px */    font-size: 14px;
  font-weight: 900;
  line-height: 1.6363636363;
  margin-bottom: 18px;
 }
 .full-width .archive-header,
 .full-width .comments-area,
 .full-width .image-navigation,
 .full-width .page-header,
 .full-width .page-content,
 .full-width .post-navigation,
 .full-width .site-content .entry-header,
 .full-width .site-content .entry-content,
 .full-width .site-content .entry-summary,
 .full-width .site-content footer.entry-meta {
  padding-right: 30px;
  padding-left: 30px;
    /*+++ Kabekin Add 20150328 横幅縮小時の記事背景色 */  background-color: #fffff0;
 }
}
@media screen and (min-width: 1080px) {
 .search-box .search-field {
  width: 324px;
 }
 .site-content,
 .site-main .widecolumn {
  margin-left: 300px;
 }
 .full-width .archive-header,
 .full-width .comments-area,
 .full-width .image-navigation,
 .full-width .page-header,
 .full-width .page-content,
 .full-width .post-navigation,
 .full-width .site-content .entry-header,
 .full-width .site-content .entry-content,
 .full-width .site-content .entry-summary,
 .full-width .site-content footer.entry-meta {
  padding-right: 30px;
  padding-left: 30px;
    /*+++ Kabekin Add 20150328 横幅縮小時の記事背景色 */  background-color: #fffff0;
 }
}
@media screen and (min-width: 1080px) {
 .search-box .search-field {
  width: 324px;
 }
 .site-content,
 .site-main .widecolumn {
  /*+++ Kabekin Modify サイズ変更 222px->300px */  margin-left: 300px;
 }
 .site:before {
  /*+++ Kabekin Modify サイズ変更 222px->300px */  width: 300px;
 }
 .search-box-wrapper,
 .featured-content {
  /*+++ Kabekin Modify サイズ変更 222px->300px */  padding-left: 300px;
 }
 #secondary {
        /*+++ Kabekin Modify 20150323 サイドバーの横幅を260pxに変更 */  width: 260px;
 }
 .secondary-navigation,
 .secondary-navigation ul ul {
  /*+++ Kabekin Modify サイズ変更 222px->300px */  width: 300px;
 }
 .full-width .archive-header,
 .full-width .comments-area,
 .full-width .image-navigation,
 .full-width .page-header,
 .full-width .page-content,
 .full-width .post-navigation,
 .full-width .site-content .entry-header,
 .full-width .site-content .entry-content,
 .full-width .site-content .entry-summary,
 .full-width .site-content footer.entry-meta {
  margin-right: auto;
  /*+++ Kabekin Add 20150325 コンテンツエリア色追加 #fffff0 */  background-color: #fffff0;
 }
/*+++ Kabekin Add 20150323 検索窓色変更&文字サイズを大きく */.primary-sidebar .widget input {
 background-color: #ffffff;
 border-color:#00ff00;
 color: #000000;
    font-size: 26px;
}
/*+++ Kabekin Add 20150325 引用部分に背景追加 *//* テーマディレクトリのimages/postquote.png に画像をアップロード */blockquote {
    border: 1px solid #E7E492;
    margin: 10px 10px 10px 50px;
    padding: 4px 4px 4px 41px;
    background-color: #F5F4D1;
    background-image: url("images/postquote.png");
    background-position: left top;
    background-repeat: no-repeat;
    overflow: auto;
    clear: both;
}

 

kabekin

Leave a Comment
Share
Published by
kabekin
Tags: ネットワーク関連
9年 ago

Recent Posts

ALGYAN 8周年オリジナル IoT 基板を頂きました^^

ALGYAN 6周年、7周年に…

11か月 ago

PC-9801-102 PCカード増設ボードの相性確認

PC-98のCバス用PCカード…

1年 ago

日立 ベーシックマスタ レベル3でPC/AT用FDD(TEAC FD-235HG)を使う その2

こちらで作ったレベル3でPC/…

1年 ago

日立 ベーシックマスタ レベル3でPC/AT用FDD(TEAC FD-235HG)を使う

こちらで作ったレベル3用外付け…

1年 ago

レベル3 & MB-S1用 データセパレータ基板をFDD用シャーシに組込む

こちらで組み立てた Sasaj…

2年 ago

横河電機 YEW 2892-12 クランプセンサのレンジ判明

デジボル側のレンジが分からなく…

2年 ago