feat: add developers landing#520
Conversation
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
|
Warning Review the following alerts detected in dependencies. According to your organization's Security Policy, it is recommended to resolve "Warn" alerts. Learn more about Socket for GitHub.
|
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
| --color-background: #111111; | ||
| --color-foreground: oklch(94.66% 0 0); | ||
| --color-info: oklch(71.7% 0.1648 250.79); | ||
| --color-line: #181818; | ||
| --color-on-accent: #ffffff; | ||
| --color-positive: oklch(81.51% 0.2258 148.1); | ||
| --color-surface-input: #222222; | ||
| --color-surface-page: #0a0a0a; |
There was a problem hiding this comment.
should be leveraging vocs css variables for some of these, or deriving vocs css variables from these
| --color-on-negative: #ffffff; | ||
| --color-on-surface-onyx: #ffffff; | ||
| --color-surface-block: #f5f5f5; | ||
| --color-surface-block-muted: #f7f7f7; | ||
| --color-surface-card: #ffffff; | ||
| --color-surface-card-elev: #ffffff; | ||
| --color-surface-input: #f5f5f5; | ||
| --color-surface-onyx: #111111; | ||
| --color-surface-deep: #f4f4f5; | ||
| --color-surface-skeleton: #e5e5e5; | ||
| --color-surface-panel: #f7f7f7; | ||
| --color-surface-page: #fafafa; | ||
| --color-surface-shell: #ffffff; | ||
| --color-line: #e5e5e5; | ||
| --color-line-strong: #d4d4d4; | ||
| --color-line-dashed: #a3a3a3; | ||
| --color-accent-blue: #3c66d8; | ||
| --color-indicator-green: #168f24; | ||
| --color-indicator-green-dark: #0f5f18; | ||
| --color-performance-tps-start: var(--color-indicator-green); | ||
| --color-performance-tps-mid: color-mix( | ||
| in srgb, | ||
| var(--color-indicator-green) 45%, | ||
| var(--color-accent-blue) | ||
| ); | ||
| --color-performance-tps-end: var(--color-accent-blue); | ||
| --color-canvas-dot-bright: #111111; | ||
| --color-selection-bg: #111111; | ||
| --color-selection-fg: #ffffff; | ||
| --color-code-token-keyword: #a93ad4; | ||
| --color-code-token-function: var(--color-accent-blue); | ||
| --color-code-token-string: #167a52; | ||
| --color-code-token-number: #6a7500; | ||
| --color-code-token-comment: color-mix(in srgb, var(--color-foreground) 38%, transparent); | ||
| --color-code-token-punctuation: color-mix(in srgb, var(--color-foreground) 48%, transparent); | ||
| --color-prose-body: color-mix(in srgb, var(--color-foreground) 70%, transparent); | ||
| --color-prose-link-decoration: color-mix(in srgb, var(--color-foreground) 28%, transparent); | ||
| --color-prose-marker: color-mix(in srgb, var(--color-foreground) 35%, transparent); | ||
| --color-prose-quote: color-mix(in srgb, var(--color-foreground) 52%, transparent); | ||
| --color-prose-caption: color-mix(in srgb, var(--color-foreground) 45%, transparent); | ||
| --color-scrollbar-thumb: #d4d4d4; | ||
| --canvas-dot-rgb: 17, 17, 17; | ||
| --canvas-dot-alpha-base: 0.045; | ||
| --showcase-window-frame: var(--surface-block); | ||
| --showcase-window-frame-border: var(--line-strong); | ||
| --showcase-window-bg: var(--surface-shell); | ||
| --showcase-window-chrome: var(--surface-panel); | ||
| --showcase-window-card: var(--surface-card); | ||
| --showcase-window-input: var(--surface-card); | ||
| --showcase-window-active: var(--surface-block); | ||
| --showcase-window-chip: var(--surface-input); | ||
| --showcase-window-border: var(--line); | ||
| --showcase-window-border-strong: var(--line-strong); | ||
| --showcase-window-dot: var(--surface-skeleton); | ||
| --showcase-window-text: var(--foreground); | ||
| --showcase-window-muted: var(--foreground-secondary); | ||
| --showcase-window-accent: var(--accent-blue); | ||
| --showcase-window-accent-text: var(--on-accent); | ||
| --showcase-window-positive: var(--indicator-green); | ||
| --showcase-window-positive-bg: color-mix(in srgb, var(--indicator-green) 12%, transparent); | ||
| --showcase-window-warning: var(--negative); | ||
| --showcase-window-warning-bg: color-mix(in srgb, var(--negative) 12%, transparent); | ||
| } | ||
|
|
||
| @theme inline { | ||
| --color-background: var(--background); | ||
| --color-foreground: var(--foreground); | ||
| --color-foreground-secondary: var(--foreground-secondary); | ||
| --color-foreground-secondary-hover: var(--foreground-secondary-hover); | ||
| --color-negative: var(--negative); | ||
| --color-info: var(--info); | ||
| --color-positive: var(--positive); | ||
| --color-warning: var(--warning); | ||
| --color-on-accent: var(--on-accent); | ||
| --color-on-negative: var(--on-negative); | ||
| --color-on-surface-onyx: var(--on-surface-onyx); | ||
|
|
||
| --color-surface-block: var(--surface-block); | ||
| --color-surface-block-muted: var(--surface-block-muted); | ||
| --color-surface-card: var(--surface-card); | ||
| --color-surface-card-elev: var(--surface-card-elev); | ||
| --color-surface-input: var(--surface-input); | ||
| --color-surface-onyx: var(--surface-onyx); | ||
| --color-surface-deep: var(--surface-deep); | ||
| --color-surface-skeleton: var(--surface-skeleton); | ||
| --color-surface-panel: var(--surface-panel); | ||
| --color-surface-page: var(--surface-page); | ||
| --color-surface-shell: var(--surface-shell); | ||
|
|
||
| --color-line: var(--line); | ||
| --color-line-strong: var(--line-strong); | ||
| --color-line-dashed: var(--line-dashed); | ||
|
|
||
| --color-accent-blue: var(--accent-blue); | ||
| --color-indicator-green: var(--indicator-green); | ||
|
|
||
| --font-display: var(--font-hbset); | ||
| --font-sans: var(--font-pilat-book); | ||
| --font-mono: var(--font-jetbrains-mono); | ||
| } |
There was a problem hiding this comment.
should be leveraging vocs css variables for a lot of these, or deriving vocs css variables from these
| :where([data-theme="light"], [data-vocs-theme="light"]) [class~="hover:bg-white"]:hover { | ||
| background-color: var(--foreground); | ||
| } |
There was a problem hiding this comment.
as mentioned above, this should be done via changing a vocs css variable rather than dissecting css like this.
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
Co-authored-by: Liam Horne <1933029+snario@users.noreply.github.com> Co-authored-by: Tanishq <15674971+tanishqsh@users.noreply.github.com>
No description provided.