Help us understand the problem. What is going on with this article?

Mac をやりすぎて Hack になったわね

自分を hacker だと信じて止まない 1 一般男性が Mac の画面を広くする記事です。

↓ デスクトップ画面 (常時、フルスクリーンに匹敵)

vscode.png

パクりタイトルでごめんなさい。みんなで優勝していくことにしましょう。

1. 導入 (Dock & menu bar)

画面の上下を整理します。

1.1. Dock を隠す

Automatically hide and show the Dock という設定があります2:

dock.png

1.2. Spacebar を使う

これは好みの問題ですが、僕は Mac の menu bar の代わりに、 Spacebar を使っています。

Menu bar を隠すには:

hide_menu_bar.png

Spacebar には、注目中アプリのタイトルが表示されます。しかし、これはアプリのタイトルバーと役割が被ります。たとえば、 qutebrowser では:

dead_title_bar.png

これでは、上のスペースが死んでいますね。そこで、 2. の項で、様々なアプリから タイトルバーを取り除いていきます

1.3. 備考: Dock / menu bar にフォーカスするショートカット

環境設定 (System Preferences) から設定できます:

dock_menubar.png

僕の設定では、 CapsLock+[ で menu bar にフォーカスできます。 CapsLockCtrl+Option+Shift+Command (hyper key) にマッピングされています (Karabiner-Elements)

なお、 CapsLock+<key> でアプリの起動/フォーカスができるようにもしました。裏では、skhd がキー入力に応じて open -a <app> を走らせます。

2. タイトルバーを取り除く

アプリ毎に特別な設定が必要だと思います。

2.1. ターミナル

Alacritty

Alacritty は世界最速のターミナルです (たぶん) 。タイトルバーを消すには:

~/.config/alacritty/alacritty.yaml
window:
  decorations: false

冴えてますね。

alacritty.png

Kitty

Kitty は macOS/Linux で動く 安定 したターミナルです。設定ファイルに以下を加えます:

hide_window_decorations   yes
macos_option_as_alt       no

早速タイトルバーが消えました。今度は、デスクトップ全体としては:

kitty.png

iTerm

GUI からの設定を頑張ります (Cmd+,)。

2.2. エディタ

VSCode

Customize UI という拡張を使います。拡張のインストール後、 Settings.json に以下を追加します:

{
  // ~~
  "window.titleBarStyle": "native",
  "customizeUI.titleBar": "inline",
  "customizeUI.activityBar": "wide",
  // ~~
}

以下のようになります。タブの厚さの調整法などは分かりません。

vscode.png

Sublime Text 3

Sublime は VSCode よりも軽くて良いと思います。ただ、タイトルバーを消す方法は分かりませんでした。

奥義としては、 フルスクリーンにすることでタイトルバーを消せます 。また、 yabai を使えば、 macOS でもアニメ無しで (一瞬で) 仮想デスクトップ間を移動できます。

SIP; System Integrity Protection を無効化した上で (要検索; yabai には載っていない?)、 skhd から yabai -m space --focus 1 などを呼ぶ。

2.3. ブラウザ

タイトルバーとアドレスバーを取り除いていきます。

Firefox

拡張にツリー型タブがあるブラウザです。設定方は、おそらく Firefox の バージョンによって変わります (?) 。

2020 年 4 月 (ver. 75.0) 時点では、 userChrome.css (要検索) というファイルを有効にして、作成します:

userChrome.css
/* ~/Library/Application Support/Firefox/Profiles/<name_of_your_profile>/chrome/userChrome.css */

/* hide the tab bar */
#TabsToolbar {
  visibility: collapse !important;
}

/* hide the header of the side bar (Tree Style Tab) */
#sidebar-header {
  visibility: collapse;
}

/* Hide address bar and addon icons */
/* DO NOT USE THIS IF YOU CANT DO WITHOUT THEM */
#TabsToolbar {visibility: collapse;}
#navigator-toolbox {visibility: collapse;}

ツリー型タブ (Firefox 限定のアドオン) と組み合わせて、以下のように:

firefox_css.png

Chrome

ツリー型タブが無いので、タブバーを消しても仕方がないと思いました。

qutebrowser

ちょっと大変です。 config.py に追記します:

c.window.hide_decoration = True

ただし、この設定が True の間は、ウィンドウの移動・リサイズができませんでした (yabai を使っても) 。そこで、上手くアプリをリサイズ・配置してから、 True に設定します。

何度も失敗するはずなので、コマンドラインからの :set content.hide_decoration <value> も役立つと思います。

qute.png

Vivaldi

少しずつ良くなっているブラウザです。タブツリーこそ無いものの、タブスタック (1 階層までのタブのグルーピング) があります。

こんな画面を経由して、カスタム CSS を有効にします:

Screen Shot 2020-05-13 at 8.22.22.png

CSS の内容としては:

vivaldi.css
/* 1. Visit `vivaldi://experiments` and check "Allow for using CSS modifications" */
/* 2. Open preferences and set the "CUSTOM UI MODIFICATIONS" directory */
/* 3. Add this file to the directory and restart Vivaldi */

/* Hide title bar */
#header { display: none; }

/* Set panel width */
#panels-container { width: 220px !important; }

/* Hide header of panels (https://forum.vivaldi.net/topic/39358/hide-header-title-for-vivaldi-panels) */
.panel > header h1  { display: none; }
.panel > header     { padding-top: 0; padding-bottom: 0; }
.webpanel-header h1 { display: initial !important; }

最終結果:

vivaldi_css.png

バグも直ってきた (?) ようですし、しれっと画面分割ができます。良さそう。

2.4. Mac only

Finder

タイトルバーの消し方が分かりません。せめて、フルパスを表示させます:

$ defaults write com.apple.finder _FXShowPosixPathInTitle -bool YES
$ killall Finder # 再起動

3. まとめ

常時フルスクリーンのような画面を作ることにより、 Mac の縦長ディスプレイ (16:10) が持つポテンシャルを開放しました。


  1. ネタです。微塵も思ったことはありません。 

  2. この画面の Prefer tabs when opening windows: True もおすすめです。たとえば、 Preview でファイルを開くとき、タブが増えていくようになります。 Finder の設定ではないのですね。 

toyboot4e
設定と UI の話を投稿しようと思います
https://github.com/toyboot4e
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした