nDiki : CSS

2008年12月18日 (木)

今日のさえずり - ツレってヨメの事だと思っていたが違うらしい

2008年12月16日

2008年12月17日

  • 08:57 みんな走りすぎ(自分も)。L:秋葉原駅 [mb]
  • 12:09 風邪の初期症状きている。 *P3
  • 12:34 Flickr Pro Account 2年延長。2011年5月4日まで。 *P3
  • 13:54 Excel で書かれた設計書編集している。うえー。 *P3
  • 15:29 @zakwa きっと一言いわされるので、今から考えておくように。 *P3
  • 15:58 オフィスで k12u が話題になっている。 *P3
  • 19:33 今日はずっと下唇の下あたりがヒクヒクしている。 [mb]
  • 19:56 熱があると思ったら 36.1℃ だった。 [mb]

2008年12月18日

スポンサード リンク
[ 12月18日全て ]

2010年2月22日 (月)

Google ドキュメントの文書に章節番号を自動的につける

ラベル参照などはできないけれど、番号をつけるだけなら CSS でできる。

 body {
  counter-reset: chapter section subsection;
 }

 H2:before {
   counter-increment: chapter;
   content: "第" counter(chapter) "章 ";
 }

 h2 {
   counter-reset: section subsection;
 }

 H3:before {
   counter-increment: section;
   content: counter(chapter) "." counter(section) " ";
 }

 h3 {
   counter-reset: subsection;
 }

 H4:before {
   counter-increment: subsection;
   content: counter(chapter) "." counter(section) "." counter(subsection) " ";
 }

H1 はタイトル用。

今日のさえずり - お賽銭って小遣い帳/家計簿につけてる?

rimage:/nDiki/Flickr/4386646560.jpg

2010年02月22日

[ 2月22日全て ]

2010年8月16日 (月)

今日のさえずり: 紅生姜、全部賞味期限切れです

2010年08月16日

  • 08:28 RT @DruckerBOT: 人はコストではなく資源である。共有する目的に向けて共に働くとき、大きな成果が得られる。
  • 09:45 隣も向かいもサラリーマンがモノ食ってる京浜東北線
  • 10:35 Google ドキュメント 新バージョンでは文書の CSS の編集ができないのか(ヘルプによると将来復活させる予定のようである)。旧バージョンにして編集。
  • 11:18 ずっと JUDE/Community 使っていたけど落ち着いたので astah* community も入れてみた。
  • 12:06 弁当とお茶 501円。 (@ ファミリーマート神田佐久間町店) http://4sq.com/biJuCj
  • 13:12 缶コーヒー 100円。
  • 13:33 Twitter の「You both follow」は spam アカウントを follow してしまっている follower をあぶりだすための機能。
  • 13:59 扇風機のみってマジか? RT @zakwa: 我が家にエアコンが来た。今までは扇風機のみでした。
  • 14:04 宮城県なら少しは平気なのかと想像しますが気温的にはどうなんでしょう? RT @Keiichi_SHIGA: 家もエアコンを入れたのはここ数年です。^^;;;
  • 14:25 ちょっと違ったっぽい。 RT @Naney: Twitter の「You both follow」は spam アカウントを follow してしまっている follower をあぶりだすための機能。
  • 14:38 「You follow these followers of」の方だな。RT @Naney: Twitter の「You both follow」は spam アカウントを follow してしまっている follower をあぶりだすための機能。
  • 16:12 業務連絡: 冷蔵庫に入っているなか卯の紅生姜、全部賞味期限切れです。
  • 17:03 帰ろうと思ったが、ケータイ電池がこころもとないので充電器つないでもう少しやる。
  • 18:14 アイスクリーム調達指令。
[ 8月16日全て ]

2011年7月19日 (火)

今日のさえずり: following と followers 表示が 0 になるとかすごく粛清された感

2011年07月19日

  • 09:35 とうとう上の2フロアにテナントが入った。朝のエレベーターの雰囲気が変わるな。
  • 09:35 冷し中華 450円。 (@ ローソン 渋谷三丁目東店) http://4sq.com/pOOiRz
  • 10:32 following と followers 表示が 0 になるとか Twitter にすごく粛清された感。
  • 13:39 ブルースクリーンくらった。
  • 17:33 Web ブラウザのデフォルト CSS で font-size + margin-top + margin-left が h1 よりも h6 の方が大きいのはどういう意図のデザインなんだろう。
  • 17:33 margin-left 違う。
  • 17:34 Web ブラウザのデフォルト CSS で font-size + margin-top + margin-bottom が h1 よりも h6 の方が大きいのはどういう意図のデザインなんだろう。
  • 17:45 @y_aki margin どうしでのキャンセルあたりも考慮しているとは思うですが……。
  • 19:10 退勤。台風だけど雨の谷間。
  • 21:06 Google+ でサークルに追加した人を、 Gmail 連絡先上で既存の連絡先と統合するとサークルから外されるの困る。ちなみに統合後に再度サークルに入れるとさらに連絡先が新規に追加されることはさすがにない。
[ 7月19日全て ]

2011年11月11日 (金)

www.naney.org のトップページを nDiki

www.naney.org のトップページは、大学のサーバで /~naney/ として使っていたレガシーなものをたまーに修正しつつずっと置いておいたのだけれども、まあもういいでしょうということで。

302 Found で nDiki にリダイレクトするように .htaccess に設定を追加。

今は普通にできる 1+ 2 カラム構成を、当時 Web ブラウザの初期の CSS 実装互換性に悩まされつつ試行錯誤したり、Content negotiation による言語設定にあわせた出力切り替えやってみたりとかは思いで。

今日のさえずり: PHPer にならなかったのは、コマンドラインから実行するスクリプトを書きにくそうだったからです

2011年11月11日

  • 09:43 おにぎり他 365円。 (@ ローソン 渋谷三丁目東店) http://t.co/LtrMccc2
  • 09:44 11:11:11 はミーティング中なのでスクリプトを組む必要があります。
  • 09:57 ポッキーとプリッツ買い忘れた!
  • 11:08 ミーティング中なのに 11:11:11 狙ってるやつがいる。
  • 13:22 コンポタが嬉しい季節になった。
  • 16:45 午後、コツコツとチームの過去タスクのリスト作ってた。
  • 16:50 「開発が進んで、もれなくトラッキングできてて、必要なコミュニケーションが取れて、記録が残せていれば ITSチケットの分類とかステータスの変更とかちょっとぐらいルーズでもいいでしょ。」って開発中は思うんだけれど、後で集計してねっていうのがくると途端に泣ける。
  • 16:53 同じ誕生日の人が6人もいる日があるのか。
  • 17:36 クランキー ポップジョイ 100円。
  • 21:21 退勤。
  • 21:35 PHPer にならなかったのは、コマンドラインから実行するスクリプトを書きにくそうだったからです。
  • 24:24 髭 sorry.
  • 24:50 Web サイトのトップページほったらかしだったので nDiki にリダイレクト設定。
  • 26:03 500 潰したり、CSS 微修正したりしてたらこんな時間。
[ 11月11日全て ]

2012年8月1日 (水)

今日のさえずり: ギャバンの「なるほど!」ポーズが好きです

2012年08月01日

  • 08:35 本日の YouTube ラジオ体操 done.
  • 08:42 S 式を延々と解く公文式ドリルないの。
  • 08:44 KUMON じゃなくて公文と書くやつは古いってこのあいだ言われた。
  • 08:49宇宙刑事ギャバン THE MOVIE」観に行きたいっていったら、「行っておいで行っておいで(ただし一人で)」て言われた。
  • 09:05 @yaizawa 小学校のクラスの中では公文やってる奴は計算速かった記憶があります(自分はやってなかった)。
  • 09:11 ギャバンの「なるほど!」ポーズが好きです。
  • 09:48 今日の雲はカッコいい。 (@ 株式会社ミクシィ (mixi, Inc.)) http://t.co/Nu2kRywU
  • 22:24 CSS と戦う戦士をあとに退勤。
  • 22:28 明日はアキヨドに予約に行くかなあ。
  • 23:29 今回のアンパンマン、やっぱり復興ものだったらしいよ。
  • 23:59 オフィスからアキヨド行くの中央線経由が速いって出ているけれど、5分の差なら山手線の方が楽でいいか。
[ 8月1日全て ]

2013年2月3日 (日)

nDikiサイドバー無くした

nDiki(この Web 日記)では長らく右にサイドバーのある2列レイアウトにしていたんだけれど、昔みたいな「ブログパーツ!」みたいな時代でもとうに無くなっているし、簡単な自己紹介と直近の Tweets を載せているぐらいだったので、バスッと消すことにした。

時代はスマートフォンだしね(スマートフォン向けにまでは CSS 修正していないから、まだまだ最適化されていないけど)。

あと昔貼った Facebook ソーシャルプラグインの挙動が変になってきたので、HTML5 用の新しいのに変えた。多少ましになったかな。

時代とともに仕様もデバイスもトレンドも変わっていってしまうから、長く継続していくにシンプルにしてメンテナンスコストを抑えよう。

[ 2月3日全て ]

2013年8月27日 (火)

今日のさえずり: Firefox の Pearl Crescent Page Saver Basic 使ったら固定ヘッダ重複することなく全体キャプチャできました!

2013年08月27日

[ 8月27日全て ]

2013年12月1日 (日)

Bootstrap 3 に移行して Web 日記を延命

この Web 日記(nDiki)がスマートフォンで見にくいのがずっと気になっていたので、さくっと Bootstrap 3 に移行した。CSSBootstrap 3.0.2 のものに変えて、navbar を使うようにコードをちょっと変更程度の軽い対応。

もともと tDiary テーマ CSS 用の HTML 構造を生成していたんだけれど、そのあたりが問題で崩れることはなく BootstrapCSS を当てることができた。もともと Wiki 記法で書いたソースドキュメントを HTML に変換しているので、変な構造の HTML は吐かないようになっていたというのもサクっといけた点かな。

細かいところういうと画像の回り込みに対応させなければならなかったり、テーブルなど適宜 Bootstrap のクラスを指定した方がいいところがあるけれど、まあ追い追いで。

あとそもそも iPhoneAndroid などのスマートフォンで見にくかったのは CSS の問題というよりは、viewport の指定がなかったからだった。Bootstrap に差し替えただけではやはりスマートフォンでは見にくくて、Bootstrap の Getting started の通り、

 <meta name="viewport" content="width=device-width, initial-scale=1.0">

と書いたら文字サイズなど見易くなった。

2004年2月22日にハイパー日記システム(hns)から自作の DiKicker移行してからもうすぐで10年。そういえば2004年2月22日は奇しくも mixi がプレオープンした日だっとはなあ。何かの縁か。

[ 12月1日全て ]

2013年12月16日 (月)

プレゼンテーションスライドを Markdown で書いて pandoc で reveal.js なページを生成する

ちょっとした勉強会などの資料は Markdown とかで軽く書いて、Web ブラウザプレゼンテーションするための HTML ファイルと、参照用のシンプルな HTML ファイルを生成したいなと思ってちょっとチェックしてみた。pandoc を使うと Markdown から reveal.js を使ったスライドページを作れるし、普通に HTML5 なページにも変換できるので良さそげ。

pandoc をインストール

pandoc は Haskell で書かれている。 GHC + Haskell Platform が入っている環境なら

 cabal update
 cabal install pandoc

を実行すればインストールできる(Fedora 17 の home 以下に GHC + Haskell Platform をインストールした時のメモ)。Debian GNU/Linux sid にも pandoc Debian パッケージはあるのだけれど、まだちょっと古めなので cabal で入れた。

スライド原稿を用意する

 mkdir pandoc-sample
 cd pandoc-sample
 emacs source.md

してサンプルを Markdown で書く。

できたら reveal.js をとってくる。

 git clone https://github.com/hakimel/reveal.js.git

CSS の微調整が必要なら reveal.js/css/reveal.min.css に手を入れる(自分の場合 text-align: center を left にしたり、.reveal h<n> のサイズを小さくしたりする)。

reveal.jsHTML を生成する

 ~/.cabal/bin/pandoc -s -t revealjs -V theme:default -o slide.html source.md

でスライド HTML ファイルが生成される。

HTML のテンプレートを変更したい場合は、例えば

 cp -a ~/.cabal/share/pandoc-1.12.2.1/data/templates/default.revealjs .

とコピーしてきて編集後、

 ~/.cabal/bin/pandoc -s -t revealjs -V theme:default --template=default.revealjs -o slide.html source.md

とする。

シンプルな HTML5 版を生成する

 ~/.cabal/bin/pandoc -s -t html5 --toc -c /path/to/bootstrap.min.css -o doc.html source.md

などとしてシンプルな HTML5 版も作っておける。

[ 12月16日全て ]

About Me

Naney Naney (なにい)です。株式会社ミクシィで SNS 事業の部長をしています。

About nDiki

nDiki1999年1月に始めたコンピュータ日誌を前身とする NaneyWeb 日記(兼パーソナルナレッジベース)です。

#nNote タグがついている記事は他の記事に比べて、より断片的・未整理・不完全なちょっとしたノートです。まだ結論に至っていない考えなども含まれます。頻繁/大幅に更新したり削除したりすることがあります。

Other Notes

ナレッジベースアプリケーション Obsidian で書いているノートの一部を notes.naney.org で 公開しています。

※内容は個人的見解であり所属組織とは関係ありません。

月別インデックス
Process Time: 0.0941610000000001s / load averages: 0.57, 0.59, 0.49
nDiki by WATANABE Yoshimasa (Naney)
Powered by DiKicker