Arc Browser Boosts – How To Tweak Website CSS
An in-depth guide on using Boosts in Arc browser.
An in-depth guide on using Boosts in Arc browser to tweak CSS of websites to your own needs—on a practical example of adjusting Daring Fireball to become mobile responsive using CSS Grid. You'll learn how to use Arc Boots, Changes Drawer in DevTools, how to easily set up mobile-responsive CSS Grid, and more.
Chapters
- 00:00 Intro
- 02:28 How Arc browser Boosts work
- 03:43 How to tweak code in Arc browser Boosts
- 03:56 How to show/hide sidebar in Arc Browser
- 04:15 How to open Developer Tools from Arc Boost
- 05:09 How to copy CSS changes from DevTools to Arc Boost
- 06:50 How to tweak the fixed layout sizing in DevTools
- 08:50 How to prepare absolute layout for CSS Grid
- 10:32 How to set CSS Grid using grid-template-areas
- 12:22 How to set optimal line lengths in CSS
- 13:24 How to add gap between CSS Grid elements
- 13:55 How to tweak sizing of CSS Grid columns
- 15:10 Howgrid switch reasoingn - adjust mobile version
- 15:39 How to copy CSS changes from DevTools to Arc Boost
- 16:22 How to fix sidebar margin problems
- 17:00 How to adjust layout for mobile responsive version
- 18:57 How to adjust sidebar for mobile responsive version
- 19:45 How to adjust ad for mobile resposive version
- 22:06 How to adjust logo for mobile responsive version
- 23:32 How to adjust search & copyright for mobile responsive version
- 25:08 How we tweaked Daring Fireball in Arc Boost
- 25:35 Why should Arc support Boosts on mobile
- 26:00 Conclusion
