Tip #767

アドレスバーとタブバーを統合して画面領域を増やす方法

ノートパソコンのような小さめの画面でも効率的に作業したい、ブラウザをコンパクトに利用したい、いずれにしても、ツールバーのカスタマイズ設定には目的に沿った設定が備わっています。

アドレスバー と タブバー を統合するには、以下のようにしてアドレスバーのコンポーネントをタブバーに移動させてください。

1. ツールバーエディター を開くには、メインメニューから、表示 > ツールバーをカスタマイズ に移動する、あるいは、ツールバーのコンポーネントを右クリックして、ツールバーをカスタマイズ を選択する
2. アイコンがその場で揺れている間に、アドレスバーでよく使うコンポーネントをタブバー（あるいは他のツールバー）にドラッグする
3. テーマのハイライトカラーで線が表示されたら、コンポーネントを新しい場所にドロップする
4. エディターのウィンドウで「完了」をクリックする
5. その後、メインメニュー > 表示 に移動して、「アドレスバーを表示する」をクリックしてアドレスバーを非表示にする

#customisation #TabBar #Tabs #vivaldi #VivaldiBrowser #アドレスバー #ツールバー

https://vivaldi.com/ja/blog/tips/desktop-tips/tip-767/

Tip #767

Gain screen real estate by merging Address and Tab Bars.

Whether you’re working on a small laptop screen where every pixel counts or just prefer a more compact look, Vivaldi’s toolbar customisation settings are here to help you achieve a configuration that works for you.

To combine the Address Bar and the Tab Bars, you need to move components from the Address Bar to the Tab Bar. Here’s how!

1. Open the Toolbar Editor from the main menu > View > Customize Toolbar, or right-click on a component on the toolbars and select Customize Toolbar.
2. While the icons are wiggling in their place, drag components you regularly use from the Address Bar to the Tab Bar (or to other toolbars).
3. When you see a line in your theme’s highlight color appear, drop the component to its new place.
4. When you’re happy with the result, click “Done” in the editor window.
5. Then, in the main menu > View, click on “Show Address bar” to hide the Address Bar.

#addressBar #customisation #TabBar #Tabs #toolbar #Vivaldi #VivaldiBrowser

https://vivaldi.com/blog/tips/tip-767/

Exclusive: From ‘Salim Langda’ to ‘Court Kachehri’, Pavan Malhotra shares why he still gets nervous, how real-life moments shape his roles and why acting remains a never-ending learning process. https://english.mathrubhumi.com/movies-music/interview/exclusive-from-salim-langda-to-court-kachehri-pavan-malhotra-reveals-why-he-still-feels-nervous-before-every-role-vrmpl88x?utm_source=dlvr.it&utm_medium=mastodon #PavanMalhotra #CourtKacheri #BlackFriday #SalimLangda #Tabbar

I added an Emacs icon on the left side of the tab bar. Clicking on it reveals the menu bar contents, and I moved Telega's message notifications to the right side of the tab bar. #tabbar #emaca #telega

https://dribbble.com/shots/19948430-Tab-Bar-Animation 🩷 https://cloud.protopie.io/p/06d4e78f14

#microinteraction #tabbar #icon #protopie #ui #uidesign #ux

Today I will be using the #Mona app. Just fixed my #TabBar at the bottom. You can not only arrange the tabs in the order you want, but you can also add your #list as tabs. And in addition, you also get to say how many tabs you want! The #customAbility of this app is one of its strong #features! #Mona #Rocks

Similar to what @r_p_f.twitter.com suggested earlier:

“How To Switch Back To Firefox Old Style Of Tabs”, SuperUser (https://superuser.com/questions/1653533/how-to-switch-back-to-firefox-old-style-of-tabs/1669549#1669549).

Via HN: https://news.ycombinator.com/item?id=28190859

#Firefox #UX #Firefox91 #Tabs #Proton #CSS #BadUX #TabBar #Design #BadDesign

custom CSS for the firefox extension “tree style tabs” to make it not horrible, paste this into the extension settings

tab-item:not([data-child-ids]) tab-twisty {
    margin-left: -12px;
}

tab-item tab-label {
    padding-bottom: 0;
}

tab-item {
    align-items: center;
}

:root #tabbar-container {
    top: 0 !important;
}

:root {
    --tab-surface-hover: #1b1b1b;
}

tab-item[data-parent-id].active {
    border-left: 1px solid #0a84ff;
}