UniqAI/bolt.new-any-llm
1
0
Fork 0
mirror of https://github.com/coleam00/bolt.new-any-llm synced 2024-12-27 22:33:03 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

updated theme color

Browse Source
This commit is contained in:
Anirban Kar 2024-12-08 02:12:02 +05:30
parent 15bd5b24f3
commit a98b51e0ef
5 changed files with 27 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
app/components/chat/BaseChat.module.scss
View File

@ -18,82 +18,6 @@
opacity: 1;
}
.RayContainer {
--gradient-opacity: 0.85;
--ray-gradient: radial-gradient(rgba(83, 196, 255, var(--gradient-opacity)) 0%, rgba(43, 166, 255, 0) 100%);
transition: opacity 0.25s linear;
position: fixed;
inset: 0;
pointer-events: none;
user-select: none;
}
.LightRayOne {
width: 480px;
height: 680px;
transform: rotate(80deg);
top: -540px;
left: 250px;
filter: blur(110px);
position: absolute;
border-radius: 100%;
background: var(--ray-gradient);
}
.LightRayTwo {
width: 110px;
height: 400px;
transform: rotate(-20deg);
top: -280px;
left: 350px;
mix-blend-mode: overlay;
opacity: 0.6;
filter: blur(60px);
position: absolute;
border-radius: 100%;
background: var(--ray-gradient);
}
.LightRayThree {
width: 400px;
height: 370px;
top: -350px;
left: 200px;
mix-blend-mode: overlay;
opacity: 0.6;
filter: blur(21px);
position: absolute;
border-radius: 100%;
background: var(--ray-gradient);
}
.LightRayFour {
position: absolute;
width: 330px;
height: 370px;
top: -330px;
left: 50px;
mix-blend-mode: overlay;
opacity: 0.5;
filter: blur(21px);
border-radius: 100%;
background: var(--ray-gradient);
}
.LightRayFive {
position: absolute;
width: 110px;
height: 400px;
transform: rotate(-40deg);
top: -280px;
left: -10px;
mix-blend-mode: overlay;
opacity: 0.8;
filter: blur(60px);
border-radius: 100%;
background: var(--ray-gradient);
}
.PromptEffectContainer {
--prompt-container-offset: 50px;
--prompt-line-stroke-width: 1px;

19
app/components/chat/BaseChat.tsx
View File

@ -258,13 +258,6 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
className={classNames(styles.BaseChat, 'relative flex h-full w-full overflow-hidden')}
data-chat-visible={showChat}
>
<div className={classNames(styles.RayContainer)}>
<div className={classNames(styles.LightRayOne)}></div>
<div className={classNames(styles.LightRayTwo)}></div>
<div className={classNames(styles.LightRayThree)}></div>
<div className={classNames(styles.LightRayFour)}></div>
<div className={classNames(styles.LightRayFive)}></div>
</div>
<ClientOnly>{() => <Menu />}</ClientOnly>
<div ref={scrollRef} className="flex flex-col lg:flex-row overflow-y-auto w-full h-full">
<div className={classNames(styles.Chat, 'flex flex-col flex-grow lg:min-w-[var(--chat-min-width)] h-full')}>
@ -314,15 +307,15 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
gradientUnits="userSpaceOnUse"
gradientTransform="rotate(-45)"
>
<stop offset="0%" stopColor="#1488fc" stopOpacity="0%"></stop>
<stop offset="40%" stopColor="#1488fc" stopOpacity="80%"></stop>
<stop offset="50%" stopColor="#1488fc" stopOpacity="80%"></stop>
<stop offset="100%" stopColor="#1488fc" stopOpacity="0%"></stop>
<stop offset="0%" stopColor="#b44aff" stopOpacity="0%"></stop>
<stop offset="40%" stopColor="#b44aff" stopOpacity="80%"></stop>
<stop offset="50%" stopColor="#b44aff" stopOpacity="80%"></stop>
<stop offset="100%" stopColor="#b44aff" stopOpacity="0%"></stop>
</linearGradient>
<linearGradient id="shine-gradient">
<stop offset="0%" stopColor="white" stopOpacity="0%"></stop>
<stop offset="40%" stopColor="#8adaff" stopOpacity="80%"></stop>
<stop offset="50%" stopColor="#8adaff" stopOpacity="80%"></stop>
<stop offset="40%" stopColor="#ffffff" stopOpacity="80%"></stop>
<stop offset="50%" stopColor="#ffffff" stopOpacity="80%"></stop>
<stop offset="100%" stopColor="white" stopOpacity="0%"></stop>
</linearGradient>
</defs>

5
app/components/ui/BackgroundRays/styles.module.scss
View File

@ -1,9 +1,4 @@
.rayContainer {
--gradient-opacity: 0.8;
--primary-color: rgba(147, 112, 219, var(--gradient-opacity));
--secondary-color: rgba(138, 43, 226, var(--gradient-opacity));
--accent-color: rgba(180, 170, 220, var(--gradient-opacity));
// Theme-specific colors
--ray-color-primary: color-mix(in srgb, var(--primary-color), transparent 30%);
--ray-color-secondary: color-mix(in srgb, var(--secondary-color), transparent 30%);

10
app/styles/index.scss
View File

@ -12,3 +12,13 @@ body {
height: 100%;
width: 100%;
}
:root {
--gradient-opacity: 0.8;
--primary-color: rgba(158, 117, 240, var(--gradient-opacity));
--secondary-color: rgba(138, 43, 226, var(--gradient-opacity));
--accent-color: rgba(128, 59, 239, var(--gradient-opacity));
// --primary-color: rgba(147, 112, 219, var(--gradient-opacity));
// --secondary-color: rgba(138, 43, 226, var(--gradient-opacity));
// --accent-color: rgba(180, 170, 220, var(--gradient-opacity));
}

22
uno.config.ts
View File

@ -35,17 +35,17 @@ const BASE_COLORS = {
950: '#0A0A0A',
},
accent: {
50: '#EEF9FF',
100: '#D8F1FF',
200: '#BAE7FF',
300: '#8ADAFF',
400: '#53C4FF',
500: '#2BA6FF',
600: '#1488FC',
700: '#0D6FE8',
800: '#1259BB',
900: '#154E93',
950: '#122F59',
50: '#F8F5FF',
100: '#F0EBFF',
200: '#E1D6FF',
300: '#CEBEFF',
400: '#B69EFF',
500: '#9C7DFF',
600: '#8A5FFF',
700: '#7645E8',
800: '#6234BB',
900: '#502D93',
950: '#2D1959',
},
green: {
50: '#F0FDF4',