昨晩は寝たのが遅かった（明け方くらい？）ので、今日目覚めたのは 15 時ごろだった。実際に起きたのは 16 時過ぎだった。

今日はあまりやる気が出なかった。開発は CSS をいじるくらいの簡単なことだけやった。今日やったことは、こんな感じ。

• テーブルの幅を 100 % に無理やり収めずに、はみ出した部分は横スクロールできるようにした
  • 表が横に長いと（あるいはスマホのように横幅が狭いディスプレイだと）一つ一つのセル内の文字がぎゅうぎゅう詰めになってしまい読みづらいと感じたので
• プライベートテンプレートの背景色のピンク色をちょっとだけ薄くした
  • 濃いと思ったので
• 画像をアップロードしたあとに空行が入るようになっていたが、空行は入らないようにした
• ※
• 画像の上下に余分な空白が入ってしまっていたのでそれを適切な空白に直した
• 画像左右のマージンを消して、画像リンクの範囲を、本来の画像のある範囲内に収めた
  • CSS だけじゃ無理だったので JavaScript を使った
  • https://github.com/noraworld/diary/blob/ff078600990163c3cc3538fdbf8e91329ed725b8/app/assets/javascripts/common/articles.js#L3-L8
  • CSS 4 がブラウザに実装されて :has() が使えるようになれば CSS だけでもいけるんだけどね

※ 画像を連続でアップロードしたとき

![foo](/foo)

![foo](/foo)

![foo](/foo)

となってしまっていたのを

![foo](/foo)
![foo](/foo)
![foo](/foo)

になるようにした。

CSS 3 で「子要素に <img> タグを持つ <a> タグ」のような指定をする方法がわからなかったので、jQuery を使った。CSS 4 ではこれができるようになるらしいんだけどいつ使えるようになるんだろうね。

大幅アップデート で入れた内容はほとんど新機能で、それによりデザインが崩れてしまっている部分がちらほら出てきているので少しずつ直していこう。新機能も作っていきたいけどデザインの修正とかメンテナンス性の向上とかリファクタリングも大事だね。

SSL/TLS 証明書の更新をした。

以前にメールで証明書の期限通知が来たときに更新しようとしたらエラーが発生して、そのときはめんどくさかったのでそのまま放置していた。でもちょうど今日が証明書の期限日だったのでエラーを特定して更新した。

Nginx をソースからビルドしているので、パスを指定しないとダメだったらしい。以下でうまくいった。

$ sudo certbot renew --nginx-server-root /usr/local/nginx/conf

食べたもの

• プロテイン

今日の学び

• テーブルを横スクロールさせる CSS の書き方を学んだ
  • はみ出たtableを横スクロールで滑らかに表示するCSS
  • 結構めんどくさいと思っていたけど意外と簡単だった（良かった）
• Sass の @function をはじめて使ってみた
  • https://github.com/noraworld/diary/blob/259a0fbaaf2a9dfdedcb437434161d78b9a6616d/app/assets/stylesheets/common/articles.scss#L949-L951
  • Sassメモ
  • プロパティの値の一部分に変数を入れたかったので @mixin では実現できない
  • Sass 便利！

成長記録

• (this is a private diary) メールの返信をした！
  • めんどくさくて返信せずに放置してしまっていたんだけどちゃんと返信できたのでえらい！

気分レベル

4

今日の気分はどうだったか

なんか今日は鼻水が出るし、頭もちょっと痛い。熱もある気がする。そんなにひどいわけでもないし、一応開発もする気力はあったので、星 4 くらい？

• ← Previous Post
• Next Post →