Variables.scss

/* palette */
--white: #fff;
--black: #000;
--black-fade-5: rgba(0, 0, 0, 0.1);

Spacing

/* radii */
--radius-sm: 4px;

/* spacing */
--space-sm: 4px;
--space-md: 8px;
--space-lg: 16px;
--space-xl: 20px;
--space-2xl: 24px;
--space-3xl: 48px;

Text . Font

/* line-height */
--solid: 1;
--dense: 1.25;
--default: 1.5;
--loose: 1.75;

/* font-weight */
--body: 400;
--medium: 500;
--semibold: 600;
--bold: 700;
--extrabold: 800;
--heavy: 900;

/* font-size */
--text-xs: 12px;
--text-sm: 14px;
--text-md: 16px;
--text-lg: 18px;
--text-xl: 20px;
--text-2xl: 24px;
--text-3xl: 32px;
--text-4xl: 48px;
--text-5xl: 64px;
--text-6xl: 76px;

Color . Size

/* colors */
--primary: #ffc400;
--secondary: #afc2cb;
--crimson: #DC143C;
--blue: #4a90e2;
--border: var(--black-fade-5);

/* size */
--text-lead: var(--text-lg);
--text-prose: var(--text-md);
--text-title: var(--text-3xl);
/* tracking */
--text-prose-tracking: -0.011em;

/* size */
--size-gutter: var(--space-2xl);
--size-logo: var(--space-2xl);
--size-max-width: 80rem;

--text-xs: 12px;

--text-sm: 14px;

--text-md: 16px;

--text-lg: 18px;

--text-xl: 20px;

--text-2xl: 24px;

--text-3xl: 32px;

--text-4xl: 48px;

--text-5xl: 64px;

--text-6xl: 76px;

H1 heading このブログはGatsby.jsでつくられています。

私わたくしはその人を常に先生と呼んでいた。だからここでもただ先生と書くだけで本名は打ち明けない。これは世間を憚はばかる遠慮というよりも、その方が私にとって自然だからである。私はその人の記憶を呼び起すごとに、すぐ「先生」といいたくなる。筆を執とっても心持は同じ事である。よそよそしい頭文字かしらもじなどはとても使う気にならない。

H2 heading このブログはGatsby.jsでつくられています。

私が先生と知り合いになったのは鎌倉かまくらである。その時私はまだ若々しい書生であった。暑中休暇を利用して海水浴に行った友達からぜひ来いという端書はがきを受け取ったので、私は多少の金を工面くめんして、出掛ける事にした。私は金の工面に二に、三日さんちを費やした。ところが私が鎌倉に着いて三日と経たたないうちに、私を呼び寄せた友達は、急に国元から帰れという電報を受け取った。

電報には母が病気だからと断ってあったけれども友達はそれを信じなかった。友達はかねてから国元にいる親たちに勧すすまない結婚を強しいられていた。彼は現代の習慣からいうと結婚するにはあまり年が若過ぎた。それに肝心かんじんの当人が気に入らなかった。それで夏休みに当然帰るべきところを、わざと避けて東京の近くで遊んでいたのである。彼は電報を私に見せてどうしようと相談をした。私にはどうしていいか分らなかった。けれども実際彼の母が病気であるとすれば彼は固もとより帰るべきはずであった。それで彼はとうとう帰る事になった。せっかく来た私は一人取り残された。

.primary-col {
  color: var(--primary);
}
.secondary-col {
  color: var(--secondary);
}
.crimson-col {
  color: var(--crimson);
}
.blue-col {
  color: var(--blue);
}

H3 heading このブログはGatsby.jsでつくられています。

学校の授業が始まるにはまだ大分だいぶ日数ひかずがあるので鎌倉におってもよし、帰ってもよいという境遇にいた私は、当分元の宿に留とまる覚悟をした。友達は中国のある資産家の息子むすこで金に不自由のない男であったけれども、学校が学校なのと年が年なので、生活の程度は私とそう変りもしなかった。したがって一人ひとりぼっちになった私は別に恰好かっこうな宿を探す面倒ももたなかったのである。

H4 heading このブログはGatsby.jsでつくられています。

宿は鎌倉でも辺鄙へんぴな方角にあった。玉突たまつきだのアイスクリームだのというハイカラなものには長い畷なわてを一つ越さなければ手が届かなかった。車で行っても二十銭は取られた。けれども個人の別荘はそこここにいくつでも建てられていた。それに海へはごく近いので海水浴をやるには至極便利な地位を占めていた。

H5 heading このブログはGatsby.jsでつくられています。

私は毎日海へはいりに出掛けた。古い燻くすぶり返った藁葺わらぶきの間あいだを通り抜けて磯いそへ下りると、この辺へんにこれほどの都会人種が住んでいるかと思うほど、避暑に来た男や女で砂の上が動いていた。ある時は海の中が銭湯せんとうのように黒い頭でごちゃごちゃしている事もあった。その中に知った人を一人ももたない私も、こういう賑にぎやかな景色の中に裹つつまれて、砂の上に寝ねそべってみたり、膝頭ひざがしらを波に打たしてそこいらを跳はね廻まわるのは愉快であった。

H6 heading このブログはGatsby.jsでつくられています。

私は実に先生をこの雑沓ざっとうの間あいだに見付け出したのである。その時海岸には掛茶屋かけぢゃやが二軒あった。私はふとした機会はずみからその一軒の方に行き慣なれていた。長谷辺はせへんに大きな別荘を構えている人と違って、各自めいめいに専有の着換場きがえばを拵こしらえていないここいらの避暑客には、ぜひともこうした共同着換所といった風ふうなものが必要なのであった。彼らはここで茶を飲み、ここで休息する外ほかに、ここで海水着を洗濯させたり、ここで鹹しおはゆい身体からだを清めたり、ここへ帽子や傘かさを預けたりするのである。海水着を持たない私にも持物を盗まれる恐れはあったので、私は海へはいるたびにその茶屋へ一切いっさいを脱ぬぎ棄すてる事にしていた。

• 0618 : note-post.jsに <span className={styles.meta}> –{' '} {posts.timeToRead} minute read</span>

• 0619 : Darkmode追加。gatsby-plugin-use-dark-mode　+　use-dark-mode
  use-dark-mode - npm