[Blogger] ヘッダ、ウィジェットの余白を調整

Atom | RSS

このサイトを検索 | Search this site

Awesomeテンプレートの修正備忘録です。

• ウィジェット間のスペースを 8px に統一した
• Navbarの表示領域をゼロにした

変数：widget.padding.side

変数は Variable name で定義されています。

投稿エリアとサイドバーの余白

 .main-inner .widget { background-color: $(widget.background.color); border: 1px solid $(widget.border.color); padding: 0 $(widget.padding.side) 15px; margin: 20px -16px;

<Variable name="widget.padding.side" description="Widget Padding Side" type="length" default="15px" min="0" max="100px" value="8px"/>

変数：date.space

Headerとmain-innerの余白

.main-inner { padding-top: $(date.space); }

<Variable name="date.space" description="Date Space" type="length" default="30px" min="0" max="100px" value="8px"/>

CSS追加

Navbarを非表示にしてもNavbar領域は確保されたままになるので height=0 に設定しました。

ヘッダー上部のマージン（navbar領域）をゼロにする

#navbar {
  height: 0;
}

SC2

ブログサークルSNS
クリックして応援してね！

このサイトを検索 | Search this site