ランディングページの整備、諸々を書き連ねる

portfolioモーダル

箇条書きが２〜３行ほどであればさほど気にならないが、文章にすると気になる。モーダルの文章が中央揃えされると読みにくい。

これを、左詰めに変更した。

_sass/_portal-mod.scss を追加した。以降はこの.scssファイルにcssの変更は集中させるつもりだ。

.portfolio-modal .modal-content p text-align を left にした。このままだとモーダルのサブタイトルも左揃えになりカッコが悪い。p.item-introはcenterとした。

再びscss問題

過去の履歴のスタイル…の css/_sass(ディレクトリ)/scss の記述は色々舌足らずなようだ。２年ぶりの試行錯誤の上、想定通りになったのでまとめておこう。

  • <jekyllソースルート>/css/main.scss

    jekyll-agencyインストールでデフォルトで作成される.scss。_sass配下の.scssを_site/css配下の.cssにコンパイルすることを示す。

    portalディレクトリに移設の際に意図的に削除したのか、真偽は判らないが、不在なのでblogからディレクトリごとコピーした

    想定外の挙動はこのファイルの不在だった

    過去の記事では、これを resume.scss に名前変更し、変更点をそのまま resume.scss に記載したようだ

    .scssで記述できるのは、_sass配下のみのようだ、agencyの仕様と思う

    ファイル末尾の@import文に’,’区切りで_sass配下に追加する.scssを拡張子無しで追加する

    今回の追加はportal-modとした

  • <jekyllソースルート>/_sass/_portal-mod.scss

    ファイル名には’_‘を接頭する

    目当ての変更を一般的なscssで記述する

  • <jekyllソースルート>/_include/head.html

    main.scssを元に生成されるmain.cssをlinkタグで指すようにする

    必須な修正

main.scssの存在が過去記事で触れられてはいるのだが、我ながら分かりづらい。resume.scssに変更したとか、resume.scss(main.scss)の目的とかが書かれていれば見過ごさなかったのかもしれない。