noham/Pocket-Bird
1
0
Fork 0
mirror of https://github.com/NohamR/Pocket-Bird.git synced 2026-05-24 19:59:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update field guide colors and use more color variables

Browse Source
This commit is contained in:
Idrees Hassan
2025-09-13 17:13:28 -04:00
parent 4d1254b9d4
commit 74612dbfcc
4 changed files with 68 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
build.js
View File

@@ -24,7 +24,7 @@ const userScriptHeader =
`// ==UserScript==
// @name Browser Bird
// @namespace https://idreesinc.com
// @version 2025-09-13-01
// @version 2025-09-13-02
// @description birb
// @author Idrees
// @downloadURL https://github.com/IdreesInc/Browser-Bird/raw/refs/heads/main/dist/birb.user.js

37
dist/birb.js vendored
View File

@@ -58,6 +58,8 @@ const STYLESHEET = `:root {
--neg-double-border-size: calc(var(--neg-border-size) * 2);
--highlight: #ffa3cb;
--border-color: var(--highlight);
--background-color: #ffecda;
--mix-color: color-mix(in srgb, var(--highlight) 50%, var(--background-color));
--birb-scale: ${BIRB_CSS_SCALE};
--ui-scale: ${UI_CSS_SCALE};
}
@@ -87,7 +89,7 @@ const STYLESHEET = `:root {
color: #000000 !important;
z-index: 2147483639 !important;
position: fixed;
background-color: #ffecda;
background-color: var(--background-color);
box-shadow:
var(--border-size) 0 var(--border-color),
var(--neg-border-size) 0 var(--border-color),
@@ -165,14 +167,14 @@ const STYLESHEET = `:root {
text-align: center;
flex-grow: 1;
user-select: none;
color: #ffecda;
color: var(--background-color);
}
.birb-window-close {
position: absolute;
top: 1px;
right: 0;
color: #ffecda;
color: var(--background-color);
user-select: none;
cursor: pointer;
padding-left: 5px;
@@ -185,13 +187,13 @@ const STYLESHEET = `:root {
.birb-window-content {
box-sizing: border-box;
background-color: #ffecda;
background-color: var(--background-color);
margin-top: var(--border-size);
flex-grow: 1;
box-shadow:
var(--border-size) 0 #ffecda,
var(--neg-border-size) 0 #ffecda,
0 var(--border-size) #ffecda,
var(--border-size) 0 var(--background-color),
var(--neg-border-size) 0 var(--background-color),
0 var(--border-size) var(--background-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
display: flex;
@@ -222,11 +224,11 @@ const STYLESHEET = `:root {
}
.birb-music-player-content {
background: #ffecda;
background: var(--background-color);
box-shadow:
var(--border-size) 0 #ffecda,
var(--neg-border-size) 0 #ffecda,
0 var(--border-size) #ffecda,
var(--border-size) 0 var(--background-color),
var(--neg-border-size) 0 var(--background-color),
0 var(--border-size) var(--background-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
display: flex;
@@ -256,10 +258,10 @@ const STYLESHEET = `:root {
background: var(--highlight) !important;
color: white !important;
box-shadow:
var(--border-size) 0 var(--border-color),
var(--neg-border-size) 0 var(--border-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
var(--border-size) 0 var(--highlight),
var(--neg-border-size) 0 var(--highlight),
0 var(--neg-border-size) var(--highlight),
0 var(--border-size) var(--highlight);
}
.birb-menu-item-arrow {
@@ -305,6 +307,10 @@ const STYLESHEET = `:root {
cursor: pointer;
}
.birb-grid-item:hover {
border-color: var(--highlight);
}
.birb-grid-item canvas {
image-rendering: pixelated;
transform: scale(2);
@@ -328,6 +334,7 @@ const STYLESHEET = `:root {
.birb-grid-item-selected {
border: var(--border-size) solid var(--highlight);
background: var(--mix-color);
}
.birb-field-guide-description {

39
dist/birb.user.js vendored
View File

@@ -1,7 +1,7 @@
// ==UserScript==
// @name Browser Bird
// @namespace https://idreesinc.com
// @version 2025-09-13-01
// @version 2025-09-13-02
// @description birb
// @author Idrees
// @downloadURL https://github.com/IdreesInc/Browser-Bird/raw/refs/heads/main/dist/birb.user.js
@@ -72,6 +72,8 @@ const STYLESHEET = `:root {
--neg-double-border-size: calc(var(--neg-border-size) * 2);
--highlight: #ffa3cb;
--border-color: var(--highlight);
--background-color: #ffecda;
--mix-color: color-mix(in srgb, var(--highlight) 50%, var(--background-color));
--birb-scale: ${BIRB_CSS_SCALE};
--ui-scale: ${UI_CSS_SCALE};
}
@@ -101,7 +103,7 @@ const STYLESHEET = `:root {
color: #000000 !important;
z-index: 2147483639 !important;
position: fixed;
background-color: #ffecda;
background-color: var(--background-color);
box-shadow:
var(--border-size) 0 var(--border-color),
var(--neg-border-size) 0 var(--border-color),
@@ -179,14 +181,14 @@ const STYLESHEET = `:root {
text-align: center;
flex-grow: 1;
user-select: none;
color: #ffecda;
color: var(--background-color);
}
.birb-window-close {
position: absolute;
top: 1px;
right: 0;
color: #ffecda;
color: var(--background-color);
user-select: none;
cursor: pointer;
padding-left: 5px;
@@ -199,13 +201,13 @@ const STYLESHEET = `:root {
.birb-window-content {
box-sizing: border-box;
background-color: #ffecda;
background-color: var(--background-color);
margin-top: var(--border-size);
flex-grow: 1;
box-shadow:
var(--border-size) 0 #ffecda,
var(--neg-border-size) 0 #ffecda,
0 var(--border-size) #ffecda,
var(--border-size) 0 var(--background-color),
var(--neg-border-size) 0 var(--background-color),
0 var(--border-size) var(--background-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
display: flex;
@@ -236,11 +238,11 @@ const STYLESHEET = `:root {
}
.birb-music-player-content {
background: #ffecda;
background: var(--background-color);
box-shadow:
var(--border-size) 0 #ffecda,
var(--neg-border-size) 0 #ffecda,
0 var(--border-size) #ffecda,
var(--border-size) 0 var(--background-color),
var(--neg-border-size) 0 var(--background-color),
0 var(--border-size) var(--background-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
display: flex;
@@ -270,10 +272,10 @@ const STYLESHEET = `:root {
background: var(--highlight) !important;
color: white !important;
box-shadow:
var(--border-size) 0 var(--border-color),
var(--neg-border-size) 0 var(--border-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
var(--border-size) 0 var(--highlight),
var(--neg-border-size) 0 var(--highlight),
0 var(--neg-border-size) var(--highlight),
0 var(--border-size) var(--highlight);
}
.birb-menu-item-arrow {
@@ -319,6 +321,10 @@ const STYLESHEET = `:root {
cursor: pointer;
}
.birb-grid-item:hover {
border-color: var(--highlight);
}
.birb-grid-item canvas {
image-rendering: pixelated;
transform: scale(2);
@@ -342,6 +348,7 @@ const STYLESHEET = `:root {
.birb-grid-item-selected {
border: var(--border-size) solid var(--highlight);
background: var(--mix-color);
}
.birb-field-guide-description {

37
stylesheet.css
View File

@@ -5,6 +5,8 @@
--neg-double-border-size: calc(var(--neg-border-size) * 2);
--highlight: #ffa3cb;
--border-color: var(--highlight);
--background-color: #ffecda;
--mix-color: color-mix(in srgb, var(--highlight) 50%, var(--background-color));
--birb-scale: ${BIRB_CSS_SCALE};
--ui-scale: ${UI_CSS_SCALE};
}
@@ -34,7 +36,7 @@
color: #000000 !important;
z-index: 2147483639 !important;
position: fixed;
background-color: #ffecda;
background-color: var(--background-color);
box-shadow:
var(--border-size) 0 var(--border-color),
var(--neg-border-size) 0 var(--border-color),
@@ -112,14 +114,14 @@
text-align: center;
flex-grow: 1;
user-select: none;
color: #ffecda;
color: var(--background-color);
}
.birb-window-close {
position: absolute;
top: 1px;
right: 0;
color: #ffecda;
color: var(--background-color);
user-select: none;
cursor: pointer;
padding-left: 5px;
@@ -132,13 +134,13 @@
.birb-window-content {
box-sizing: border-box;
background-color: #ffecda;
background-color: var(--background-color);
margin-top: var(--border-size);
flex-grow: 1;
box-shadow:
var(--border-size) 0 #ffecda,
var(--neg-border-size) 0 #ffecda,
0 var(--border-size) #ffecda,
var(--border-size) 0 var(--background-color),
var(--neg-border-size) 0 var(--background-color),
0 var(--border-size) var(--background-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
display: flex;
@@ -169,11 +171,11 @@
}
.birb-music-player-content {
background: #ffecda;
background: var(--background-color);
box-shadow:
var(--border-size) 0 #ffecda,
var(--neg-border-size) 0 #ffecda,
0 var(--border-size) #ffecda,
var(--border-size) 0 var(--background-color),
var(--neg-border-size) 0 var(--background-color),
0 var(--border-size) var(--background-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
display: flex;
@@ -203,10 +205,10 @@
background: var(--highlight) !important;
color: white !important;
box-shadow:
var(--border-size) 0 var(--border-color),
var(--neg-border-size) 0 var(--border-color),
0 var(--neg-border-size) var(--border-color),
0 var(--border-size) var(--border-color);
var(--border-size) 0 var(--highlight),
var(--neg-border-size) 0 var(--highlight),
0 var(--neg-border-size) var(--highlight),
0 var(--border-size) var(--highlight);
}
.birb-menu-item-arrow {
@@ -252,6 +254,10 @@
cursor: pointer;
}
.birb-grid-item:hover {
border-color: var(--highlight);
}
.birb-grid-item canvas {
image-rendering: pixelated;
transform: scale(2);
@@ -275,6 +281,7 @@
.birb-grid-item-selected {
border: var(--border-size) solid var(--highlight);
background: var(--mix-color);
}
.birb-field-guide-description {