フォントサイズ・スライダーの範囲を適正値にして復活させた。最小、最大、現在値を表示した。

ブツ

インストール＆実行

NAME='Electron.MyLog.20220915100705'
git clone https://github.com/ytyaru/$NAME
cd $NAME
npm install
npm start

準備

  1. GitHubアカウントを作成する
  2. repoスコープ権限をもったアクセストークンを作成する
  3. インストール＆実行してアプリ終了する
    1. db/setting.jsonファイルが自動作成される
  4. db/setting.jsonに以下をセットしファイル保存する
    1. username:任意のGitHubユーザ名
    2. email:任意のGitHubメールアドレス
    3. token:repoスコープ権限を持ったトークン
    4. repo.name:任意リポジトリ名
    5. address:任意モナコイン用アドレス
  5. dst/mytestrepo/.gitが存在しないことを確認する（あればdstごと削除する）
  6. GitHub上に同名リモートリポジトリが存在しないことを確認する（あれば削除する）

実行

  1. npm startで起動またはアプリでCtrl+Shift+Rキーを押す（リロードする）
  2. git initコマンドが実行される
    • repo/リポジトリ名ディレクトリが作成され、その配下に.gitディレクトリが作成される
  3. [createRepo][]実行後、リモートリポジトリが作成される

GitHub Pages デプロイ

アップロードされたファイルからサイトを作成する。

  1. アップロードしたユーザのリポジトリページにアクセスする（https://github.com/ユーザ名/リポジトリ名）
  2. 設定ページにアクセスする（https://github.com/ユーザ名/リポジトリ名/settings）
  3. Pagesページにアクセスする（https://github.com/ユーザ名/リポジトリ名/settings/pages）
    1. SourceのコンボボックスがDeploy from a branchになっていることを確認する
    2. Branchをmasterにし、ディレクトリを/(root)にし、Saveボタンを押す
    3. F5キーでリロードし、そのページにhttps://ytyaru.github.io/リポジトリ名/のリンクが表示されるまでくりかえす（数分かかる）
    4. https://ytyaru.github.io/リポジトリ名/のリンクを参照する（デプロイ完了してないと404エラー）

やったこと

  • フォントサイズ・スライダーの範囲を適正値にして復活させた。最小、最大、現在値値を表示するようにした。
<div id="line-of-chars-slider">
    <input id="line-of-chars" type="range" min="20" max="40" value="35" step="1"><span id="line-of-chars-now">35</span>字／行</span>
    <div id="line-of-chars-slider-values">
        <span id="line-of-chars-min">20</span>
        <span id="line-of-chars-max">38</span>
    </div>
</div>

#line-of-chars {
    width:60%;
}
#line-of-chars-slider {
    line-height:16px;
    padding:;
}
#line-of-chars-slider-values {
    display: flex;
    justify-content: space-between;
    font-size:16px;
    width:60%;
}

スライダーのサイズは適当に60%。その横に現在値をN字／行と表示する。本当はもっと綺麗にサイズ計算したいのだがとりあえず暫定値。

スライダーの最小、最大値を表示する<span>を用意した。こんなのはスライダーUI自体に用意してもらいたいところだが存在しないので自作した。細かいところはJSで実装した。

気づいたこと

フォントサイズの計算が微妙。大きくなりすぎる気がする。

そもそもスライダーで調整なんて面倒なことしたくない。自動でよしなにしてほしい。