smedmunds/TriggerFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

Theme changes

Browse Source
This commit is contained in:
Sean Edmunds
2025-04-28 15:59:56 -05:00
parent 19b793fbf9
commit 416c8611ec
53 changed files with 392 additions and 428 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/WeatherModal/WeatherGraphs.tsx
View File

@@ -20,7 +20,7 @@ export default function WeatherGraphs({
return (
<Stack
style={{
backgroundColor: 'var(--color-background)',
backgroundColor: 'var(--mantine-color-background-0)',
padding: '1rem',
borderRadius: '8px',
}}
@@ -41,7 +41,7 @@ export default function WeatherGraphs({
return (
<Stack
style={{
background: 'var(--color-search-background)',
background: 'var(--mantine-color-search-0)',
padding: '.5rem',
borderRadius: '.5rem',
}}
@@ -50,7 +50,7 @@ export default function WeatherGraphs({
<ComposedChart data={hourlyForecast}>
<XAxis
type='category'
stroke={'var(--color-text-pri)'}
stroke={'var(--mantine-color-primary-0)'}
dataKey={(data: HourlyForecast) => {
return new Date(data.startTime).toLocaleTimeString('en-US', {
hour: 'numeric',
@@ -59,7 +59,7 @@ export default function WeatherGraphs({
}}
/>
<YAxis
stroke={'var(--color-text-pri)'}
stroke={'var(--mantine-color-primary-0)'}
unit={'°F'}
domain={['dataMin', 'dataMax']}
/>
@@ -70,8 +70,8 @@ export default function WeatherGraphs({
type='monotone'
name='Temperature'
dataKey='temperature'
stroke={'var(--color-text-pri)'}
dot={{ stroke: 'var(--color-text-pri)', strokeWidth: 1 }}
stroke={'var(--mantine-color-primary-0)'}
dot={{ stroke: 'var(--mantine-color-primary-0)', strokeWidth: 1 }}
/>
<Line
unit={'°F'}
@@ -80,17 +80,17 @@ export default function WeatherGraphs({
dataKey={(data: HourlyForecast) => {
return (data.dewpoint.value * 9) / 5 + 32;
}}
stroke={'var(--color-text-acc)'}
dot={{ stroke: 'var(--color-text-pri)', strokeWidth: 1 }}
stroke={'var(--mantine-color-accent-0)'}
dot={{ stroke: 'var(--mantine-color-primary-0)', strokeWidth: 1 }}
/>
<Legend style={{ background: 'var(--color-search-background)' }} />
<Legend style={{ background: 'var(--mantine-color-search-0)' }} />
</ComposedChart>
</ResponsiveContainer>
<ResponsiveContainer width={'100%'} height={150}>
<ComposedChart data={hourlyForecast}>
<XAxis
type='category'
stroke={'var(--color-text-pri)'}
stroke={'var(--mantine-color-primary-0)'}
dataKey={(data: HourlyForecast) => {
return new Date(data.startTime).toLocaleTimeString('en-US', {
hour: 'numeric',
@@ -98,7 +98,7 @@ export default function WeatherGraphs({
});
}}
/>
<YAxis stroke={'var(--color-text-pri)'} unit={'%'} domain={[0, 100]} />
<YAxis stroke={'var(--mantine-color-primary-0)'} unit={'%'} domain={[0, 100]} />
<CartesianGrid stroke='#f5f5f522' />
<Tooltip content={<CustomTooltip />} />
<Area
@@ -108,9 +108,9 @@ export default function WeatherGraphs({
dataKey={(data: HourlyForecast) => {
return data.probabilityOfPrecipitation.value;
}}
stroke={'var(--color-text-pri)'}
fill={'var(--color-text-pri)'}
dot={{ stroke: 'var(--color-text-pri)', strokeWidth: 1 }}
stroke={'var(--mantine-color-primary-0)'}
fill={'var(--mantine-color-primary-0)'}
dot={{ stroke: 'var(--mantine-color-primary-0)', strokeWidth: 1 }}
/>
<Area
unit={'%'}
@@ -119,11 +119,11 @@ export default function WeatherGraphs({
dataKey={(data: HourlyForecast) => {
return data.relativeHumidity.value;
}}
stroke={'var(--color-text-acc)'}
fill={'var(--color-text-acc)'}
dot={{ stroke: 'var(--color-text-pri)', strokeWidth: 1 }}
stroke={'var(--mantine-color-accent-0)'}
fill={'var(--mantine-color-accent-0)'}
dot={{ stroke: 'var(--mantine-color-primary-0)', strokeWidth: 1 }}
/>
<Legend style={{ background: 'var(--color-search-background)' }} />
<Legend style={{ background: 'var(--mantine-color-search-0)' }} />
</ComposedChart>
</ResponsiveContainer>
</Stack>