feat: add popup functionality and theme styles for Borlander extension

This commit is contained in:
2026-01-22 09:37:33 +05:30
parent 5f8e4c43e7
commit 925efe55cc
7 changed files with 163 additions and 14 deletions

View File

@@ -0,0 +1,12 @@
const domain = window.location.hostname;
chrome.storage.local.get([domain], (result) => {
if (result[domain] !== 'disabled') {
const link = document.createElement('link');
link.id = 'borland-theme-style';
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = chrome.runtime.getURL('styles.css');
(document.head || document.documentElement).appendChild(link);
}
});

View File

@@ -3,13 +3,39 @@
"name": "Borlander",
"version": "1.0",
"description": "Applies the classic Borland blue and yellow theme to all websites.",
"permissions": [
"storage",
"tabs"
],
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"css": [
"exclude_matches": [
"*://monkeytype.com/*",
"*://*.monkeytype.com/*"
],
"js": [
"content.js"
]
}
],
"web_accessible_resources": [
{
"resources": [
"styles.css"
],
"matches": [
"<all_urls>"
]
},
{
"resources": [
"sites/github.com/styles.css"
],
"matches": [
"https://github.com/*"
]
}
]

31
borlander/popup.html Normal file
View File

@@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<style>
body {
width: 180px;
padding: 10px;
font-family: sans-serif;
background: #0000A4;
color: #FFFF4E;
}
button {
width: 100%;
cursor: pointer;
background: #4F4F4F;
color: #FFFF4E;
border: 1px solid #FFF;
padding: 5px;
}
</style>
</head>
<body>
<h4 id="site-name">Domain</h4>
<button id="toggle-btn">Disable on this site</button>
<script src="popup.js"></script>
</body>
</html>

22
borlander/popup.js Normal file
View File

@@ -0,0 +1,22 @@
chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
const url = new URL(tabs[0].url);
const domain = url.hostname;
document.getElementById('site-name').textContent = domain;
const btn = document.getElementById('toggle-btn');
chrome.storage.local.get([domain], (result) => {
const isDisabled = result[domain] === 'disabled';
btn.textContent = isDisabled ? "Enable on this site" : "Disable on this site";
btn.onclick = () => {
if (isDisabled) {
chrome.storage.local.remove(domain);
} else {
chrome.storage.local.set({ [domain]: 'disabled' });
}
chrome.tabs.reload(tabs[0].id);
window.close();
};
});
});

View File

@@ -0,0 +1,13 @@
:root {
--contribution-default-bgColor-0: #4F4F4F !important;
--contribution-default-bgColor-1: #FFFFB6 !important;
--contribution-default-bgColor-2: #FFFFCC !important;
--contribution-default-bgColor-3: #FFFF4E !important;
--contribution-default-bgColor-4: #ffea00 !important;
--contribution-default-borderColor-0: #4F4F4F !important;
}
.ContributionCalendar-label {
color: #FFFF4E !important;
}

View File

@@ -1,9 +1,37 @@
/* 1. Global Reset (The Borland Look) */
:root {
--bgColor-default: #0000A4 !important;
--bgColor-muted: #000080 !important;
--bgColor-inset: #000060 !important;
--fgColor-default: #FFFF4E !important;
--fgColor-muted: #EEEEEE !important;
--fgColor-accent: #B5DCFF !important;
--button-default-bgColor-rest: #4F4F4F !important;
--button-default-fgColor-rest: #FFFF4E !important;
--control-bgColor-rest: #4F4F4F !important;
--color-ansi-blue: #96CBFE !important;
--color-ansi-cyan: #C6C5FE !important;
--color-ansi-green: #A8FF60 !important;
--color-ansi-red: #FF6C60 !important;
}
video,
.html5-video-player,
.html5-video-container {
background-color: transparent !important;
}
html,
body,
div,
span,
nav,
p,
footer,
textarea,
section,
article {
background-color: #0000A4 !important;
@@ -14,20 +42,40 @@ article {
video,
.html5-video-player,
.html5-video-container,
.ytp-gradient-bottom,
.ytp-gradient-top,
.ytp-chrome-bottom,
canvas {
background-color: transparent !important;
}
/* prevent the "Blue Box" */
div[class*="player"],
div[class*="video"],
div[class*="overlay"] {
background-color: transparent !important;
}
input,
textarea,
select,
button,
input[type="text"],
input[type="search"],
input[type="email"],
#search-input,
.gsfi {
background-color: #4F4F4F !important;
color: #FFFF4E !important;
border: 2px solid #EEEEEE !important;
border-radius: 0px !important;
appearance: none !important;
-webkit-appearance: none !important;
box-shadow: none !important;
}
::placeholder {
color: #7C7C7C !important;
opacity: 1;
}
a,
a * {
color: #B5DCFF !important;
@@ -41,13 +89,4 @@ h4,
h5,
h6 {
color: #FFFFFF !important;
}
input,
textarea,
button,
select {
background-color: #4F4F4F !important;
color: #FFFF4E !important;
border: 1px solid #EEEEEE !important;
}

6
readme.md Normal file
View File

@@ -0,0 +1,6 @@
# Borlander
#### Monkeytype theme
[Monkeytype](https://monkeytype.com?customTheme=eyJjIjpbIiMwMDAwYTQiLCIjZmZmZjRlIiwiI2RjOGE3OCIsIiNhY2IwYmUiLCIjNzA3MDcwIiwiI2ZmZmY0ZSIsIiNkMjBmMzkiLCIjZTY0NTUzIiwiI2QyMGYzOSIsIiNlNjQ1NTMiXSwiaSI6IiIsInMiOiJjb3ZlciIsImYiOlswLDEsMSwxXX0=)