かすみん日記

暇なときに何か喋ります

【vscode】MDN Referenceのポップアップを非表示にする

環境

内容

エディタvscodeで、カーソルホバーしたときに表示されるMDN Referenceのポップアップが邪魔でうざいのでなんとかする。

f:id:geniusium:20210803055205p:plain

vscodecmd + ,(or ctrl + ,)で設定を開き、検索窓に「editor.hover.sticky」と入力する。

すると下の画像のような項目が表示されるので、チェックを外す。

f:id:geniusium:20210803055520p:plain

これで、カーソルホバーでポップアップは表示されるが、ポップアップ上にカーソル移動すると自動で消えるようになる。

あるいは、完全に表示したくない場合は「editor.hover.enabled」と検索して表示される項目のチェックを外してしまえばいい。

f:id:geniusium:20210803055915p:plain

一概にポップアップと言っても便利なものもあるので(カラーピッカーとか)、余程の神経質でない限りは前者の設定をお勧めする。

以上。

参考

yoshiya-kiryu.com

【Minecraft】OptiFineの導入(Mac)

環境

OptiFineのインストール

公式サイトから、欲しいバージョンのOptiFineをダウンロードする。

最新バージョンなら、一番上のものでよい。

f:id:geniusium:20210730235735p:plain

「Download」をクリックすれば、広告を挟んでページが遷移する。

もう一度「Download」をクリックすれば、ダウンロードが始まる。

f:id:geniusium:20210730235929p:plain

ファインダーを開いて、jar ファイルがダウンロードされていることを確認。

f:id:geniusium:20210731000143p:plain

ダウンロードした jar ファイルを、右クリックして「開く」を選択。

セキュリティのポップアップが表示されたら、「開く」を選択。

すると、インストーラが起動するので、「Install」をクリック。

f:id:geniusium:20210731000845p:plain

次のようなウインドウが表示されれば、インストール成功。

f:id:geniusium:20210731000931p:plain

イクラを起動

イクラのランチャーを起動する。

「プレイ」タブの起動構成の選択のところで「OptiFine」を選択し、後は普通に「プレイ」ボタンを押してマイクラを起動する。

f:id:geniusium:20210731002029p:plain

選択肢に「OptiFine」がない場合は自分で構成する。

「起動構成」タブから「New Installation」をクリックし、「バージョン」のところでインストールしたOptiFineを指定し、(適当に名前をつけて)「作成」ボタンを押して完了。

f:id:geniusium:20210731001954p:plain

あとは「プレイ」タブに戻って、今作成した起動構成を選択して「プレイ」ボタンを押してマイクラを起動する。

セキュリティのポップアップが表示されるが、チェックボックスにチェック入れて「プレイ」を押し続行。

ちゃんと導入できているかの確認

イクラを起動し、ホーム画面の左下のバージョンが書かれているところに「Mod導入済み」と書かれていれば成功。

f:id:geniusium:20210731002327p:plain

以上。

参考

zenzenzenchan.com

【Mac】かな入力で幸せになるOptionキーショートカット

環境

  • macOS big sur
  • US配列キーボード

内容

macの日本語かな入力で、returnで変換確定する前に option + A, S, Z, X を押すと....

キーバインド 機能
option + Z or fn + F6 ひらがなに変換
option + X or fn + F7 全角カタカナに変換
option + A or fn + F8 半角カタカナに変換
option + C or fn + F9 全角英字に変換
option + S or fn + F10 半角英字に変換

今まではファンクションキーで変換していたが、Optionキーを使った方が楽そう。

蛇足

今回は奇跡的に発見した。

軽くググったが、こういう情報はApple公式ヘルプにまとめられてないっぽい。

下記ページにもこのキーバインドは書いてない;

Macの日本語変換用のキーボードショートカット - Apple サポート

また、下記の古い記事でこのキーバインドが紹介されているので、どうやら「ことえり」呼称時代からあるものらしい;

Macのことえりで簡単にカタカナを入力する方法 / Inforati

以上。

関連記事

私が書いた関連記事です。

geniusium.hatenablog.com

【Mac】ミュージックアプリで楽曲の表記が英語になる問題

MaciOSのどちらでも観測しているが、なぜかミュージックの表記が英語になるバグがある。

何年も前からずっとあるバグだが、ググっても当てになる解決法は見つからず、OSのアップデートでも改善される兆しがない。

ということなのだが、もしかしたら有効かもしれない方解決方法が一つ思い当たったので共有しておく。

Macの「システム環境」の「言語と地域」のところにある「優先する言語」の2つめに「英語」が設定されていたので、それを消す。

それからミュージックアプリで、英語表記になっている音楽にラブを付けると、途端に日本語表記に変化した。

ミュージックアプリを再起動すれば一括で直る、ということはなかった。よくわからん。

ダウンロードのやり直しでも変化はなかったが、ライブラリを一旦消して再度追加すれば日本語表記になった。

iOSの方では綿密に言語設定見直したりしていたがMacの方は見落としてた。

また英語表記に戻るかもしれないが、一旦はこれで大丈夫そう。

サブスク新規加入するならApple Musicはやめとけ。

以上。


追記:

やっぱりダメそう。英語表記に戻る。;;

【css】メニューやトップへ戻るボタンをコンテンツ内に固定する

f:id:geniusium:20210715195656p:plain

ヘッダーにある「ハンバーガーメニューアイコン」やフッターにある「トップへ戻るボタン」を、width を設定せず max-width のみを設定しているレスポンシブルなコンテンツ内の右端に固定する方法。

sample code

See the Pen by nakasu (@nakasu) on CodePen.

解説

header, main, footer の中に、max-width を設定した .wrapper を入れて中央寄せしている。

このときに、「メニュー」と「トップへ戻るボタン」を .wrapper 内で右端に寄せている。

.wrapper の外にははみ出ないのがポイント(両端)。

右寄せするときに right: 0; とするのではなく、親要素に

display: flex;
justify-content: flex-end;

を設定することで実現する。

固定は普通に position: fixed; で設定し、top あるいは bottom で固定位置を指定する。

leftright を指定するとコンテンツからはみ出るのでダメ。

たかが右寄せのために flex なんて使って良いのか疑問だが、他に方法が思いつかなかった。ググっても見当たらない。

他に良い方法があったら教えてください。

以上。

【sass】ギザギザを作る

ギザギザというかジグザグのスタイルを作った。

See the Pen zigzag by nakasu (@nakasu) on CodePen.

コード

zigzag というクラス名の要素の擬似要素 :before:after にジグザグを作る。

HTML:

<div class="zigzag">
  ジグザグ
</div>

scss:

@mixin zigzag($color, $height, $position) {
  @if $position != before and $position != after {
    @error "$positioin '#{$position}' must be either before or after.";
  }

  background-color: $color;
  position: relative;

  &:#{$position} {
    content: "";
    position: absolute;
    left: 0;
    height: $height;
    width: 100%;

    $deg: 30deg;
    $tan: 1 / 1.732;

    // $deg: 45deg;
    // $tan: 1;

    // $deg: 60deg;
    // $tan: 1.732;

    $box-h: 2 * $height;
    $box-w: $box-h / $tan;

    $is-before: if($position == before, true, false);

    @if $is-before {top: -$height;}
    @else {bottom: -$height;}

    $deg: if($is-before, $deg, 180deg - $deg);
    $ratio: if($is-before, 50%, 25%);

    background:
      linear-gradient($deg, $color $ratio, transparent $ratio),
      linear-gradient(360deg - $deg, $color $ratio, transparent $ratio);
    background-size: $box-w $box-h;
  }
}

.zigzag {
  @include zigzag(tomato, 10px, before);
  @include zigzag(tomato, 10px, after);
}

解説

zigzag というmixinを、ジグザグさせたい要素のスタイルにincludeする;

.zigzag {
  @include zigzag(tomato, 10px, before);
}

1つ目の引数が色、2つ目が高さ、3つ目が擬似要素名。

before だと上にジグザグ、after だと下にジグザグする。

ジグザグの角度を変えたい場合は、mixin zigzag の定義を直接編集する。

角度 $deg とその正接 $tan の値を書き換えてください。

不満点

sassは三角関数が使えないらしい。アホである。

なので、タンジェント $tan の値は自分で計算して用意した。

上のサンプルコードでは、ジグザグの角度は  30^\circ に固定してある。

 45^\circ 60^\circ のコードもコメントアウトして用意しておいた。

参考

kuzlog.com

developer.mozilla.org

MacのMusicアプリで自動再生「∞」を使う

macOS Big Sur 11.2でMusicアプリを利用していたが、iOSの方にある自動再生の「∞」アイコンを見つけられなくて困っていた。

Appleのユーザガイドを見ると、UIがCatalinaのものと同じだった。

support.apple.com

ユーザガイドではmacOS Big Sur 11.0からこの機能が使えるみたいな書き方がされているが、どうやらMacでこの機能が使えるのはmacOS Big Sur 11.3以降に付帯するMusicアプリかららしい。

現在(2020-06-28)ではBig Sur 11.4が最新OSであるので、これにアップデートする。

すると、MusicアプリのUIが変更されて、自動再生「∞」機能が使えるようになる。

support.apple.com

ユーザガイドが少し不親切だったので、一応このことをメモしておく。

以上。