Skip to content

Commit f232343

Browse files
Gerome-ElassaadGerome-Elassaad
committed
update theme classes in header editor and deploy
1 parent add647d commit f232343

4 files changed

Lines changed: 45 additions & 43 deletions

File tree

‎app/components/deploy/DeployAlert.tsx‎

Lines changed: 27 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
2121
animate={{ opacity: 1, y: 0 }}
2222
exit={{ opacity: 0, y: -20 }}
2323
transition={{ duration: 0.3 }}
24-
className={`rounded-lg border border-bolt-elements-borderColor bg-bolt-elements-background-depth-2 p-4 mb-2`}
24+
className={`rounded-lg border border-codinit-elements-borderColor bg-codinit-elements-background-depth-2 p-4 mb-2`}
2525
>
2626
<div className="flex items-start">
2727
{/* Icon */}
@@ -35,10 +35,10 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
3535
className={classNames(
3636
'text-xl',
3737
type === 'success'
38-
? 'i-ph:check-circle-duotone text-bolt-elements-icon-success'
38+
? 'i-ph:check-circle-duotone text-codinit-elements-icon-success'
3939
: type === 'error'
40-
? 'i-ph:warning-duotone text-bolt-elements-button-danger-text'
41-
: 'i-ph:info-duotone text-bolt-elements-loader-progress',
40+
? 'i-ph:warning-duotone text-codinit-elements-button-danger-text'
41+
: 'i-ph:info-duotone text-codinit-elements-loader-progress',
4242
)}
4343
></div>
4444
</motion.div>
@@ -48,15 +48,15 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
4848
initial={{ opacity: 0 }}
4949
animate={{ opacity: 1 }}
5050
transition={{ delay: 0.1 }}
51-
className={`text-sm font-medium text-bolt-elements-textPrimary`}
51+
className={`text-sm font-medium text-codinit-elements-textPrimary`}
5252
>
5353
{title}
5454
</motion.h3>
5555
<motion.div
5656
initial={{ opacity: 0 }}
5757
animate={{ opacity: 1 }}
5858
transition={{ delay: 0.2 }}
59-
className={`mt-2 text-sm text-bolt-elements-textSecondary`}
59+
className={`mt-2 text-sm text-codinit-elements-textSecondary`}
6060
>
6161
<p>{description}</p>
6262

@@ -70,12 +70,12 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
7070
className={classNames(
7171
'w-6 h-6 rounded-full flex items-center justify-center',
7272
buildStatus === 'running'
73-
? 'bg-bolt-elements-loader-progress'
73+
? 'bg-codinit-elements-loader-progress'
7474
: buildStatus === 'complete'
75-
? 'bg-bolt-elements-icon-success'
75+
? 'bg-codinit-elements-icon-success'
7676
: buildStatus === 'failed'
77-
? 'bg-bolt-elements-button-danger-background'
78-
: 'bg-bolt-elements-textTertiary',
77+
? 'bg-codinit-elements-button-danger-background'
78+
: 'bg-codinit-elements-textTertiary',
7979
)}
8080
>
8181
{buildStatus === 'running' ? (
@@ -95,7 +95,9 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
9595
<div
9696
className={classNames(
9797
'h-0.5 w-8',
98-
buildStatus === 'complete' ? 'bg-bolt-elements-icon-success' : 'bg-bolt-elements-textTertiary',
98+
buildStatus === 'complete'
99+
? 'bg-codinit-elements-icon-success'
100+
: 'bg-codinit-elements-textTertiary',
99101
)}
100102
></div>
101103

@@ -105,12 +107,12 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
105107
className={classNames(
106108
'w-6 h-6 rounded-full flex items-center justify-center',
107109
deployStatus === 'running'
108-
? 'bg-bolt-elements-loader-progress'
110+
? 'bg-codinit-elements-loader-progress'
109111
: deployStatus === 'complete'
110-
? 'bg-bolt-elements-icon-success'
112+
? 'bg-codinit-elements-icon-success'
111113
: deployStatus === 'failed'
112-
? 'bg-bolt-elements-button-danger-background'
113-
: 'bg-bolt-elements-textTertiary',
114+
? 'bg-codinit-elements-button-danger-background'
115+
: 'bg-codinit-elements-textTertiary',
114116
)}
115117
>
116118
{deployStatus === 'running' ? (
@@ -130,7 +132,7 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
130132
)}
131133

132134
{content && (
133-
<div className="text-xs text-bolt-elements-textSecondary p-2 bg-bolt-elements-background-depth-3 rounded mt-4 mb-4">
135+
<div className="text-xs text-codinit-elements-textSecondary p-2 bg-codinit-elements-background-depth-3 rounded mt-4 mb-4">
134136
{content}
135137
</div>
136138
)}
@@ -140,7 +142,7 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
140142
href={url}
141143
target="_blank"
142144
rel="noopener noreferrer"
143-
className="text-bolt-elements-item-contentAccent hover:underline flex items-center"
145+
className="text-codinit-elements-item-contentAccent hover:underline flex items-center"
144146
>
145147
<span className="mr-1">View deployed site</span>
146148
<div className="i-ph:arrow-square-out"></div>
@@ -164,10 +166,10 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
164166
}
165167
className={classNames(
166168
`px-2 py-1.5 rounded-md text-sm font-medium`,
167-
'bg-bolt-elements-button-primary-background',
168-
'hover:bg-bolt-elements-button-primary-backgroundHover',
169-
'focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-bolt-elements-button-danger-background',
170-
'text-bolt-elements-button-primary-text',
169+
'bg-codinit-elements-button-primary-background',
170+
'hover:bg-codinit-elements-button-primary-backgroundHover',
171+
'focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-codinit-elements-button-danger-background',
172+
'text-codinit-elements-button-primary-text',
171173
'flex items-center gap-1.5',
172174
)}
173175
>
@@ -179,10 +181,10 @@ export default function DeployChatAlert({ alert, clearAlert, postMessage }: Depl
179181
onClick={clearAlert}
180182
className={classNames(
181183
`px-2 py-1.5 rounded-md text-sm font-medium`,
182-
'bg-bolt-elements-button-secondary-background',
183-
'hover:bg-bolt-elements-button-secondary-backgroundHover',
184-
'focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-bolt-elements-button-secondary-background',
185-
'text-bolt-elements-button-secondary-text',
184+
'bg-codinit-elements-button-secondary-background',
185+
'hover:bg-codinit-elements-button-secondary-backgroundHover',
186+
'focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-codinit-elements-button-secondary-background',
187+
'text-codinit-elements-button-secondary-text',
186188
)}
187189
>
188190
Dismiss

‎app/components/editor/codemirror/cm-theme.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -171,10 +171,10 @@ function getEditorTheme(settings: EditorSettings) {
171171
'.cm-tooltip.cm-readonly-tooltip': {
172172
padding: '4px',
173173
whiteSpace: 'nowrap',
174-
backgroundColor: 'var(--bolt-elements-bg-depth-2)',
175-
borderColor: 'var(--bolt-elements-borderColorActive)',
174+
backgroundColor: 'var(--codinit-elements-bg-depth-2)',
175+
borderColor: 'var(--codinit-elements-borderColorActive)',
176176
'& .cm-tooltip-arrow:before': {
177-
borderTopColor: 'var(--bolt-elements-borderColorActive)',
177+
borderTopColor: 'var(--codinit-elements-borderColorActive)',
178178
},
179179
'& .cm-tooltip-arrow:after': {
180180
borderTopColor: 'transparent',

‎app/components/header/Header.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,10 @@ export function Header() {
1212
<header
1313
className={classNames('flex items-center p-5 border-b h-[var(--header-height)]', {
1414
'border-transparent': !chat.started,
15-
'border-bolt-elements-borderColor': chat.started,
15+
'border-codinit-elements-borderColor': chat.started,
1616
})}
1717
>
18-
<div className="flex items-center gap-2 z-logo text-bolt-elements-textPrimary cursor-pointer">
18+
<div className="flex items-center gap-2 z-logo text-codinit-elements-textPrimary cursor-pointer">
1919
<div className="i-ph:sidebar-simple-duotone text-xl" />
2020
<a href="/" className="text-2xl font-semibold text-accent flex items-center">
2121
<img src="/logo-dark.png" alt="logo" className="w-[90px] inline-block dark:hidden" />
@@ -24,7 +24,7 @@ export function Header() {
2424
</div>
2525
{chat.started && ( // Display ChatDescription and HeaderActionButtons only when the chat has started.
2626
<>
27-
<span className="flex-1 px-4 truncate text-center text-bolt-elements-textPrimary">
27+
<span className="flex-1 px-4 truncate text-center text-codinit-elements-textPrimary">
2828
<ClientOnly>{() => <ChatDescription />}</ClientOnly>
2929
</span>
3030
<ClientOnly>

‎app/components/header/HeaderActionButtons.client.tsx‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export function HeaderActionButtons({}: HeaderActionButtonsProps) {
5353

5454
return (
5555
<div className="flex gap-2">
56-
<div className="flex border border-bolt-elements-borderColor rounded-md overflow-hidden">
56+
<div className="flex border border-codinit-elements-borderColor rounded-md overflow-hidden">
5757
<IconButton
5858
title={
5959
!netlifyConn.user
@@ -80,7 +80,7 @@ export function HeaderActionButtons({}: HeaderActionButtonsProps) {
8080
)}
8181
{netlifyConn.user && <NetlifyDeploymentLink />}
8282
</IconButton>
83-
<div className="w-[1px] bg-bolt-elements-borderColor" />
83+
<div className="w-[1px] bg-codinit-elements-borderColor" />
8484
<IconButton
8585
title={
8686
!vercelConn.user ? 'Connect Vercel Account' : deployingTo === 'vercel' ? 'Deploying...' : 'Deploy to Vercel'
@@ -103,7 +103,7 @@ export function HeaderActionButtons({}: HeaderActionButtonsProps) {
103103
)}
104104
{vercelConn.user && <VercelDeploymentLink />}
105105
</IconButton>
106-
<div className="w-[1px] bg-bolt-elements-borderColor" />
106+
<div className="w-[1px] bg-codinit-elements-borderColor" />
107107
<IconButton title="Deploy to Cloudflare (Coming Soon)" disabled>
108108
<img
109109
className="w-5 h-5"
@@ -115,7 +115,7 @@ export function HeaderActionButtons({}: HeaderActionButtonsProps) {
115115
/>
116116
</IconButton>
117117
</div>
118-
<div className="flex border border-bolt-elements-borderColor rounded-md overflow-hidden">
118+
<div className="flex border border-codinit-elements-borderColor rounded-md overflow-hidden">
119119
<Button
120120
active={showChat}
121121
disabled={!canHideChat || isSmallViewport} // expand button is disabled on mobile as it's not needed
@@ -125,9 +125,9 @@ export function HeaderActionButtons({}: HeaderActionButtonsProps) {
125125
}
126126
}}
127127
>
128-
<div className="i-bolt:chat text-sm" />
128+
<div className="i-codinit:chat text-sm" />
129129
</Button>
130-
<div className="w-[1px] bg-bolt-elements-borderColor" />
130+
<div className="w-[1px] bg-codinit-elements-borderColor" />
131131
<Button
132132
active={showWorkbench}
133133
onClick={() => {
@@ -159,10 +159,10 @@ function Button({ active = false, disabled = false, children, onClick, className
159159
className={classNames(
160160
'flex items-center p-1.5',
161161
{
162-
'bg-bolt-elements-item-backgroundDefault hover:bg-bolt-elements-item-backgroundActive text-bolt-elements-textTertiary hover:text-bolt-elements-textPrimary':
162+
'bg-codinit-elements-item-backgroundDefault hover:bg-codinit-elements-item-backgroundActive text-codinit-elements-textTertiary hover:text-codinit-elements-textPrimary':
163163
!active,
164-
'bg-bolt-elements-item-backgroundAccent text-bolt-elements-item-contentAccent': active && !disabled,
165-
'bg-bolt-elements-item-backgroundDefault text-alpha-gray-20 dark:text-alpha-white-20 cursor-not-allowed':
164+
'bg-codinit-elements-item-backgroundAccent text-codinit-elements-item-contentAccent': active && !disabled,
165+
'bg-codinit-elements-item-backgroundDefault text-alpha-gray-20 dark:text-alpha-white-20 cursor-not-allowed':
166166
disabled,
167167
},
168168
className,
@@ -187,10 +187,10 @@ function IconButton({ active = false, disabled = false, children, onClick, title
187187
<button
188188
title={title}
189189
className={classNames('flex items-center justify-center p-1.5 relative', {
190-
'bg-bolt-elements-item-backgroundDefault hover:bg-bolt-elements-item-backgroundActive text-bolt-elements-textTertiary hover:text-bolt-elements-textPrimary':
190+
'bg-codinit-elements-item-backgroundDefault hover:bg-codinit-elements-item-backgroundActive text-codinit-elements-textTertiary hover:text-codinit-elements-textPrimary':
191191
!active,
192-
'bg-bolt-elements-item-backgroundAccent text-bolt-elements-item-contentAccent': active && !disabled,
193-
'bg-bolt-elements-item-backgroundDefault text-alpha-gray-20 dark:text-alpha-white-20 cursor-not-allowed':
192+
'bg-codinit-elements-item-backgroundAccent text-codinit-elements-item-contentAccent': active && !disabled,
193+
'bg-codinit-elements-item-backgroundDefault text-alpha-gray-20 dark:text-alpha-white-20 cursor-not-allowed':
194194
disabled,
195195
})}
196196
onClick={onClick}

0 commit comments

Comments
 (0)