Studio TA Subsite の案内とお知らせ

エキサイトブログ / 旧編集画面のアレンジ(8) Chrome版 - ライフログ等の整形

2017年 04月 05日
ニッチな話ですが、旧編集画面のアイコンで呼び出される小ウインドウで、「ライフログ」はデザイン崩れがあります。

b0174191_22060956.png

記入枠の大きさがまちまちで、ウインドウ幅が小さいと上段が更に崩れます。 この崩れを整形し、ついでに編集画面の背景色を適応しました。 下図は新しいスタイルを適応した状態です。

b0174191_22562730.png

この小ウインドウは、編集画面とは別のURLを引いて開いているので、URLが異なります。 従って、この「(8)Chrome版 - ライフログ等の整形」は、Stylist上で編集画面のスタイル登録とは別に、ひとつのスタイルとして登録します。

この画面のコードは全体のベース「body」に背景色を指定しているので、他の「地図」「ジャンル」の小ウインドウに適応させると、それらの背景色も同じに出来ます。(デブォルトは白) 下図は Stylist登録画面で、それらのアイコンが開くURLも併せて4行のURLを登録しています。

b0174191_22061825.png


登録した指定URLは以下です。
  「prefix」=「 http://www.exblog.jp/blog/lifelog
  「prefix」=「 http://www.exblog.jp/myblog/lifelog/
  「prefix」=「 http://www.exblog.jp/myblog/entry/map/
  「prefix」=「 http://www.exblog.jp/myblog/entry/entry_genre



Chrome版 - ライフログ等の整形と背景色用 パッチ


/* ライフログ等の整形と背景色 パッチ 2017.04.05 */

select[onchange="chgCategory(this)"] {
height: 26px; }

select[onchange="chgCategory(this)"]+input[type="text"] {
height: 20px; }

form[name="LifelogFrm"]>select[name="category"] {
height: 26px; }

form[action="/myblog/lifelog/"] {
min-width: 480px; }


/* 背景色指定 */

body {
background-color: #98c1dc !important; }



/* 注意 Stylist の URL指定は、
「prefix」=「 http://www.exblog.jp/blog/lifelog 」
「prefix」=「 http://www.exblog.jp/myblog/lifelog/ 」
「prefix」=「 http://www.exblog.jp/myblog/entry/map/ 」
「prefix」=「 http://www.exblog.jp/myblog/entry/entry_genre 」
の4行を指定 */





[PR]
by Ataron | 2017-04-05 22:29 | ブログスキンのアレンジ | Comments(0)
名前
URL
削除用パスワード

※このブログはコメント承認制を適用しています。ブログの持ち主が承認するまでコメントは表示されません。