@fylib/theme 0.1.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/engine.js +68 -68
  2. package/package.json +24 -22
package/dist/engine.js CHANGED
@@ -190,40 +190,40 @@ export class ThemeEngine {
190
190
  // Extract solid color fallback from thumbBase if it's a gradient
191
191
  const thumbFallback = thumbBase.includes('gradient') ? '#2b56a3' : thumbBase;
192
192
  const hThumbFallback = hThumbFull.includes('gradient') ? '#2b56a3' : thumbFallback;
193
- let styleContent = `
194
- ::-webkit-scrollbar {
195
- width: ${width} !important;
196
- height: ${width} !important;
197
- display: block !important;
198
- }
199
- ::-webkit-scrollbar-track {
200
- background: ${trackFull} !important;
201
- }
202
- ::-webkit-scrollbar-thumb {
203
- background: ${thumbFull} !important;
204
- background-color: ${thumbFallback} !important;
205
- border-radius: ${radius} !important;
206
- border: ${bWidth} solid ${bColor} !important;
207
- box-shadow: ${shadow} !important;
208
- min-height: 20px !important;
209
- }
210
- ::-webkit-scrollbar-thumb:vertical {
211
- background: ${thumbFull} !important;
212
- background-color: ${thumbFallback} !important;
213
- }
214
- ::-webkit-scrollbar-thumb:horizontal {
215
- background: ${hThumbFull} !important;
216
- background-color: ${hThumbFallback} !important;
217
- }
218
- ::-webkit-scrollbar-thumb:hover {
219
- background: ${thumbHoverFull} !important;
220
- }
221
- ::-webkit-scrollbar-thumb:vertical:hover {
222
- background: ${thumbHoverFull} !important;
223
- }
224
- ::-webkit-scrollbar-thumb:horizontal:hover {
225
- background: ${hThumbHoverFull} !important;
226
- }
193
+ let styleContent = `
194
+ ::-webkit-scrollbar {
195
+ width: ${width} !important;
196
+ height: ${width} !important;
197
+ display: block !important;
198
+ }
199
+ ::-webkit-scrollbar-track {
200
+ background: ${trackFull} !important;
201
+ }
202
+ ::-webkit-scrollbar-thumb {
203
+ background: ${thumbFull} !important;
204
+ background-color: ${thumbFallback} !important;
205
+ border-radius: ${radius} !important;
206
+ border: ${bWidth} solid ${bColor} !important;
207
+ box-shadow: ${shadow} !important;
208
+ min-height: 20px !important;
209
+ }
210
+ ::-webkit-scrollbar-thumb:vertical {
211
+ background: ${thumbFull} !important;
212
+ background-color: ${thumbFallback} !important;
213
+ }
214
+ ::-webkit-scrollbar-thumb:horizontal {
215
+ background: ${hThumbFull} !important;
216
+ background-color: ${hThumbFallback} !important;
217
+ }
218
+ ::-webkit-scrollbar-thumb:hover {
219
+ background: ${thumbHoverFull} !important;
220
+ }
221
+ ::-webkit-scrollbar-thumb:vertical:hover {
222
+ background: ${thumbHoverFull} !important;
223
+ }
224
+ ::-webkit-scrollbar-thumb:horizontal:hover {
225
+ background: ${hThumbHoverFull} !important;
226
+ }
227
227
  `;
228
228
  if (s.buttonsVisible) {
229
229
  const bBg = s.buttonBackground || thumbBase;
@@ -236,40 +236,40 @@ export class ThemeEngine {
236
236
  const downImg = s.buttonDownImage ? `url(${s.buttonDownImage})` : `url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='4' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E")`;
237
237
  const downHoverImg = s.buttonDownHoverImage ? `url(${s.buttonDownHoverImage})` : downImg;
238
238
  const downActiveImg = s.buttonDownActiveImage ? `url(${s.buttonDownActiveImage})` : downHoverImg;
239
- styleContent += `
240
- ::-webkit-scrollbar-button:single-button {
241
- background: ${bBg} !important;
242
- display: block !important;
243
- border-radius: ${bRad} !important;
244
- border: ${bWidth} solid ${bColor} !important;
245
- background-position: center !important;
246
- background-repeat: no-repeat !important;
247
- box-shadow: ${shadow} !important;
248
- }
249
- ::-webkit-scrollbar-button:single-button:hover {
250
- background: ${bHoverBg} !important;
251
- }
252
- ::-webkit-scrollbar-button:single-button:active {
253
- background: ${bActiveBg} !important;
254
- }
255
- ::-webkit-scrollbar-button:single-button:vertical:decrement {
256
- background-image: ${upImg} !important;
257
- }
258
- ::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
259
- background-image: ${upHoverImg} !important;
260
- }
261
- ::-webkit-scrollbar-button:single-button:vertical:decrement:active {
262
- background-image: ${upActiveImg} !important;
263
- }
264
- ::-webkit-scrollbar-button:single-button:vertical:increment {
265
- background-image: ${downImg} !important;
266
- }
267
- ::-webkit-scrollbar-button:single-button:vertical:increment:hover {
268
- background-image: ${downHoverImg} !important;
269
- }
270
- ::-webkit-scrollbar-button:single-button:vertical:increment:active {
271
- background-image: ${downActiveImg} !important;
272
- }
239
+ styleContent += `
240
+ ::-webkit-scrollbar-button:single-button {
241
+ background: ${bBg} !important;
242
+ display: block !important;
243
+ border-radius: ${bRad} !important;
244
+ border: ${bWidth} solid ${bColor} !important;
245
+ background-position: center !important;
246
+ background-repeat: no-repeat !important;
247
+ box-shadow: ${shadow} !important;
248
+ }
249
+ ::-webkit-scrollbar-button:single-button:hover {
250
+ background: ${bHoverBg} !important;
251
+ }
252
+ ::-webkit-scrollbar-button:single-button:active {
253
+ background: ${bActiveBg} !important;
254
+ }
255
+ ::-webkit-scrollbar-button:single-button:vertical:decrement {
256
+ background-image: ${upImg} !important;
257
+ }
258
+ ::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
259
+ background-image: ${upHoverImg} !important;
260
+ }
261
+ ::-webkit-scrollbar-button:single-button:vertical:decrement:active {
262
+ background-image: ${upActiveImg} !important;
263
+ }
264
+ ::-webkit-scrollbar-button:single-button:vertical:increment {
265
+ background-image: ${downImg} !important;
266
+ }
267
+ ::-webkit-scrollbar-button:single-button:vertical:increment:hover {
268
+ background-image: ${downHoverImg} !important;
269
+ }
270
+ ::-webkit-scrollbar-button:single-button:vertical:increment:active {
271
+ background-image: ${downActiveImg} !important;
272
+ }
273
273
  `;
274
274
  }
275
275
  style.innerHTML = styleContent;
package/package.json CHANGED
@@ -1,22 +1,24 @@
1
- {
2
- "name": "@fylib/theme",
3
- "version": "0.1.0",
4
- "main": "dist/index.js",
5
- "types": "dist/index.d.ts",
6
- "files": ["dist"],
7
- "publishConfig": {
8
- "access": "public"
9
- },
10
- "scripts": {
11
- "build": "tsc -p tsconfig.json"
12
- },
13
- "dependencies": {
14
- "@fylib/core": "workspace:*",
15
- "@fylib/animation": "workspace:*",
16
- "@fylib/logger": "workspace:*"
17
- },
18
- "devDependencies": {
19
- "typescript": "catalog:",
20
- "@types/node": "catalog:"
21
- }
22
- }
1
+ {
2
+ "name": "@fylib/theme",
3
+ "version": "0.2.1",
4
+ "main": "dist/index.js",
5
+ "types": "dist/index.d.ts",
6
+ "files": [
7
+ "dist"
8
+ ],
9
+ "publishConfig": {
10
+ "access": "public"
11
+ },
12
+ "dependencies": {
13
+ "@fylib/animation": "0.2.1",
14
+ "@fylib/core": "0.2.1",
15
+ "@fylib/logger": "0.2.1"
16
+ },
17
+ "devDependencies": {
18
+ "typescript": "^5.9.3",
19
+ "@types/node": "^20.17.19"
20
+ },
21
+ "scripts": {
22
+ "build": "tsc -p tsconfig.json"
23
+ }
24
+ }