google chrome extension – How to access and edit brave://resources/brave/css/reset.css file on Mac OS X?

by


I have been writing extensions for personal use for quite a while now, and with the following feature of the manifest.josn file, it becomes spectacularly easy to target the CSS selectors of whichever page I want to target as the author of the extension:

"content_scripts": 
[ 
   {
      "matches":   ["https://www.bbc.com/"],
      "css":       ["BBCCustomStyles.css"]
   }
]

Although I have been able to target external pages with immense ease, however, when it comes to modern web browsers’ internal pages, I have not been able to find a simple way of targeting the default stylesheet that comes preinstalled with the browser. I have been using Brave web browser for over a year, and although I know that I can write a new HTML page to replace the current newtab page, however, as the browser allows the developers to examine the DOM of all of the rendered internal pages, hence, I have been able to ascertain that Brave uses the following files to define or describe the layout of its NewTab page:

brave://resources/brave/css/reset.css
chrome://resources/css/text_defaults.css

Instead of developing a complete extension just to redefine the layout of the NewTab page, I would love to know that can a developer access these pages on one’s computer by exploring the installed web browser package? I have tried to explore the Brave’s installed package on my laptop, however, I have not been able to locate these files. I would greatly appreciate if someone could provide some information on how to locate these files and open them for editing. Although I have no problems with developing a new extension, however, when the files at least seem already available somewhere — I have been open them in the web browser using the aforementioned internal URIs — therefore, it feels a waste of effort to create the whole of the HTML structure and find all of the JavaScript libraries to fetch time, date, and favorite websites related data. If anyone has the information on how to locate these files purely for editing purposes and not just viewing purposes, then I would greatly appreciate that information.

I have explored a couple of dozen pages to find a way to target the web browser’s internal pages using the matches option in the manifest.json file. However, apparently, browsers have yet to provide access to pages like brave://newtab and brave://settings using the matches option in the web browser’s extension’s manifest.json file. After perusing dozens of pages, including Chrome’s available documentation on how to develop extensions for various types of pages, all I have been able to find is that an extension developer can use the following to target the internal pages and then write a complete web page to meet one’s own preferences.

"chrome_url_overrides": { "newtab": "index.html" }

I would need to author the whole of the index.html page all of the CSS files to create a NewTab page that would meet my needs. Some of the most detailed information on this matter is available on the following page:

text

All of the other pages discussing the customization of NewTab page and other pages available on medium.com and other websites provide an identical method with either some more or usually less information.

I was expecting and I am still hoping that I would be able to find a way to rewrite the CSS files that come bundled with the browser’s installation instead of having to write new HTML and CSS pages for all of the internal pages.



Source link

Leave a Comment