なんか書いていこうぜー.com

Let's write something good

progressタグに対するデザイン適用

社内のesaに愚痴的に書いたものをパクって転載。(パクってって書いたけど自分で書いたものね:sweat_smile:)

progress タグにデザインを当てるには、The HTML5 progress Element のように [value] や -webkit-progress-value を指定してそこにいろいろ記述していくのだけれども、-webkit-progress-bar に after/before 疑似要素が、少なくとも Chrome/Chromium だと指定しても無視される様子。なので、progress の右端に現在の%をcontentで表示したり画像載せるのは難しいっぽい。

progress {
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  border: 0;
  width: 100%;
  height: 5px;

  &[value] {
    border: 0;
    -webkit-appearance: none;

    &::-webkit-progress-value {
      transition: all .2s ease;
      background-color: $progress-bar-color;
      transition-delay: 0;
    }
  }
}

徐々に表示が右にずれていくようにしたかったため、span タグを使って回避した。

経過とともに progress が ++ されていくようにしているので width が :up:され 、右端に画像が表示されるように指定しているのでそれが :arrow_right: に動いていく(ように見えるようになる)。(裏でprogressの計算はしている)

<span className="p-progress-icon-area" style=\{\{width: `${progress}%`\}\}>
  <img src="assets/images/emoji/koko.png" className="p-progress-icon" />
</span>

※記事buildの都合でstyle=のところをescapeしております :sob:

.p-progress-icon {
  width: .8em;
  height: .8em;
  vertical-align: middle;
}

S3 の静的サイトホスティングにゆるりと移行中

意を決して Octopress から Jekyll に移して S3 ホスティングにしてみた。

https 化も着手中ではあるが、メールが届いてこない:angel:のでまだもう少し先の話になりそう。

リンク切れとかもありそうなので:innocent:ゆるりと直して行く予定。

2017年の目標

毎年恒例の事業部行事で、2017年の目標を書いた。※私のは23ページ目

年末の休みにふと、物事を習慣化して継続するにはどうしたもんかと思ってググると、やる気の継続が…とか書かれていてついカッとなって目標にした。

「やる気の継続」と「習慣」は別の要素だと思っているので、やる気が継続してたとしても作業が続くか?部屋を片付けたいとずっと思っていても、ただし部屋を片付けるとは言っていない、みたいなこともあるので、やる気が継続していてもアクションしないと結果として「続いた」とは言い難い。

なので、アクションを起こし続けられるような仕組みを生活に組み込んで、長期間何かを意識的にやっていこう、というのが目的の目標。

その1 trello を使ってみた

とりあえず、安易に「日常意識的に見るものにやることを表示しておこう」と思って trello を使ってやることを書き出して、スマホのウィジェットにやることを表示させてみた。

やりたいことが常に見えるのでやらないといけない感じが演出はできたものの、ウィジェットではタスクがあいうえお順に表示されるのと、レーンの区別なく表示されるのでちょっとしっくりこなかった。見えすぎるのも逆に無視しやすくなる感じもした。(オオカミ少年的な?)

スマホは毎日意識的に見るので、ここに組み込むのはよさそうな気がする。

2016年なにしてたっけ?

2016年何してたかを考える。

仕事

今年の3月から新しい現場に変わって、そのまま今もそのプロジェクトにいる。 一旦モノはリリースしたものの、AWSを使ったアーキテクチャへの変更で新しい体験もさせてもらっているのでありがたい。お客様とはビデオ通話を使ってリモートで打ち合わしつつ、ふりかえりや同じ場にいたほうが議論が進む場合にのみ訪問するスタイルなので非常にやりやすい。

minami.rb の同窓会に行ってきた

先日の RubyWorld Conference@satomicchy さんに直接お誘いいただいたので、この勤労感謝の日に大阪に行ってきた。

buoys を 0.5.0 にした

Ruby 2.3.2Ruby 2.2.6 がリリースされていたので、例の如く 2.3.2 と 2.2.6 を .travis.yml に記載してテスト通してリリースした。

特に機能的なアップはないものの、いろいろ溜まっていたものと、deprecation warnings が出てたものを抑えている。

あと、おまけ程度に rubocop ちゃんと動かして直しておいた。

ThinkPad X1 Carbon に Arch Linux をインストールした

以前使っていた Macbook Air に入れていた Arch が動かなくなったのと、そろそろ新しい PC を買っても良さそうということで購入した。 全部ではないものの、備忘録として実行したコマンドを書いておく。

予め SD カードに Arch Linux のイメージを書き込んでおいて、USB 接続のカードリーダから起動している。

Ginza.rb の第 40 回に参加してきた

※現在、風邪でぶっ倒れております。

パイセンに誘われたので、buoysしかネタがなかったので前日にがんばってスライド作成していってきた。

XP祭り2016でLTしてきました

会社の勉強会で、『エクストリームプログラミング』の第二版の読書会を約 1 年かけて実施したので、読書会に参加した人の代表として、本読んだ感想と思ったことをば書いて発表してきました。

電子工作ことはじめ

7/14, 15 に、会社の合宿で IoT ハッカソン的なことをしてきました。:muscle:

私のチームは Raspberry Pi を扱ったものを作るってことで、人感センサと超音波距離センサを使って集中ルームみたいな狭い部屋に人がいるかどうかを判定するモノをつくってみようということでこの数週間、細々といろいろと触ってみました。

Ruby が使い慣れているだろうということで Ruby で制御してみました。 成果は muryoimpl/frontdesk にアップしてあります。

センサーの結果を取るのがこちらの対処が悪いのか、反応が遅いのかわからんのですが、いうほど敏感でないというのが実際の動きになっています。:sweat_smile:

Fritzing で絵を書いてみたり、配線してみたり、オームの法則という懐かしい単語に遭遇したりでなかなか楽しかったです。

Raspberry Pi は言ったら小さい Linux マシンなのでなんでもできちゃうんですけど、もうちょっと Raspberry Pi は触り続けてみようかな、というところです。