design.estate/dees-catalog
2
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Juergen Kunz
2025-06-27 21:05:28 +00:00
parent 956964f5b9
commit ecad05098f
2 changed files with 221 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
ts_web/elements/dees-dataview-codebox.ts
View File

@ -53,23 +53,23 @@ export class DeesDataviewCodebox extends DeesElement {
}
.mainbox {
position: relative;
color: ${this.goBright ? '#333333' : '#ffffff'};
border-top: 1px solid ${this.goBright ? '#ffffff' : '#333333'};
box-shadow: 0px 0px 5px ${this.goBright ? 'rgba(0,0,0,0.1)' : 'rgba(0,0,0,0.5)'};
background: ${this.goBright ? '#ffffff' : '#191919'};
border-radius: 16px;
color: ${cssManager.bdTheme('#09090b', '#fafafa')};
border: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
background: ${cssManager.bdTheme('#ffffff', '#09090b')};
border-radius: 6px;
overflow: hidden;
}
.appbar {
position: relative;
color: ${cssManager.bdTheme('#333', '#ccc')};
background: ${cssManager.bdTheme('#ffffff', '#161616')};
border-bottom: 1px solid ${cssManager.bdTheme('#eeeeeb', '#222222')};
height: 24px;
color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
background: ${cssManager.bdTheme('#f9fafb', '#18181b')};
border-bottom: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
height: 32px;
display: flex;
font-size: 12px;
line-height: 24px;
font-size: 13px;
line-height: 32px;
justify-content: center;
align-items: center;
}
@ -82,31 +82,32 @@ export class DeesDataviewCodebox extends DeesElement {
}
.bottomBar {
color: ${cssManager.bdTheme('#333', '#ccc')};
background: ${cssManager.bdTheme('#ffffff', '#161616')};
border-top: 1px solid ${cssManager.bdTheme('#eeeeeb', '#222222')};
height: 24px;
color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
background: ${cssManager.bdTheme('#f9fafb', '#18181b')};
border-top: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
height: 28px;
font-size: 12px;
line-height: 24px;
line-height: 28px;
text-align: right;
padding-right: 100px;
}
.languageLabel {
color: ${cssManager.bdTheme('#333', '#ccc')};
color: ${cssManager.bdTheme('#3b82f6', '#3b82f6')};
font-size: 12px;
line-height: 24px;
line-height: 28px;
z-index: 10;
background: #6596ff20;
background: ${cssManager.bdTheme('rgba(59, 130, 246, 0.1)', 'rgba(59, 130, 246, 0.1)')};
display: inline-block;
position: absolute;
bottom: 0px;
right: 0px;
padding: 0px 16px 0px 8px;
font-weight: 500;
}
.hljs-keyword {
color: #ff65ec;
color: ${cssManager.bdTheme('#dc2626', '#f87171')};
}
.codegrid {
@ -116,10 +117,10 @@ export class DeesDataviewCodebox extends DeesElement {
}
.lineNumbers {
color: ${this.goBright ? '#acacac' : '#666666'};
padding: 30px 16px 0px 0px;
color: ${cssManager.bdTheme('#71717a', '#52525b')};
padding: 24px 16px 0px 0px;
text-align: right;
border-right: 1px solid ${this.goBright ? '#eaeaea' : '#222222'};
border-right: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
}
.lineCounter:last-child {
@ -129,11 +130,11 @@ export class DeesDataviewCodebox extends DeesElement {
pre {
overflow-x: auto;
margin: 0px;
padding: 30px 40px;
padding: 24px 24px;
}
code {
font-weight: ${this.goBright ? '400' : '300'};
font-weight: 400;
padding: 0px;
margin: 0px;
}
@ -147,23 +148,39 @@ export class DeesDataviewCodebox extends DeesElement {
}
.hljs-string {
color: #ffa465;
color: ${cssManager.bdTheme('#059669', '#10b981')};
}
.hljs-built_in {
color: #65ff6a;
color: ${cssManager.bdTheme('#8b5cf6', '#a78bfa')};
}
.hljs-function {
color: ${this.goBright ? '#2765DF' : '#6596ff'};
color: ${cssManager.bdTheme('#3b82f6', '#60a5fa')};
}
.hljs-params {
color: ${this.goBright ? '#3DB420' : '#65d5ff'};
color: ${cssManager.bdTheme('#0891b2', '#06b6d4')};
}
.hljs-comment {
color: ${this.goBright ? '#EF9300' : '#ffd765'};
color: ${cssManager.bdTheme('#71717a', '#71717a')};
}
.hljs-number {
color: ${cssManager.bdTheme('#ea580c', '#fb923c')};
}
.hljs-literal {
color: ${cssManager.bdTheme('#dc2626', '#f87171')};
}
.hljs-attr {
color: ${cssManager.bdTheme('#8b5cf6', '#a78bfa')};
}
.hljs-variable {
color: ${cssManager.bdTheme('#09090b', '#fafafa')};
}
</style>
<div