eightequal/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Update Servers marketing page (#3535)

Browse Source 
* Update Servers marketing page

* Add burst FAQ

* Updated phrasing again

* Fix servers page when not logged in

* Update changelog
This commit is contained in:
Prospector
2025-04-18 22:23:30 -07:00
committed by GitHub
parent 84a28e045b
commit 1903980b71
8 changed files with 393 additions and 256 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
packages/ui/src/components/base/ButtonStyled.vue
View File

@@ -6,7 +6,7 @@ const props = withDefaults(
color?: 'standard' | 'brand' | 'red' | 'orange' | 'green' | 'blue' | 'purple'
size?: 'standard' | 'large'
circular?: boolean
type?: 'standard' | 'outlined' | 'transparent' | 'highlight'
type?: 'standard' | 'outlined' | 'transparent' | 'highlight' | 'highlight-colored-text'
colorFill?: 'auto' | 'background' | 'text' | 'none'
hoverColorFill?: 'auto' | 'background' | 'text' | 'none'
highlightedStyle?: 'main-nav-primary' | 'main-nav-secondary'
@@ -24,20 +24,40 @@ const props = withDefaults(
},
)
const highlightedColorVar = computed(() => {
switch (props.color) {
case 'brand':
return 'var(--color-brand-highlight)'
case 'red':
return 'var(--color-red-highlight)'
case 'orange':
return 'var(--color-orange-highlight)'
case 'green':
return 'var(--color-green-highlight)'
case 'blue':
return 'var(--color-blue-highlight)'
case 'purple':
return 'var(--color-purple-highlight)'
case 'standard':
default:
return null
}
})
const colorVar = computed(() => {
switch (props.color) {
case 'brand':
return props.type === 'highlight' ? 'var(--color-brand-highlight)' : 'var(--color-brand)'
return 'var(--color-brand)'
case 'red':
return props.type === 'highlight' ? 'var(--color-red-highlight)' : 'var(--color-red)'
return 'var(--color-red)'
case 'orange':
return props.type === 'highlight' ? 'var(--color-orange-highlight)' : 'var(--color-orange)'
return 'var(--color-orange)'
case 'green':
return props.type === 'highlight' ? 'var(--color-green-highlight)' : 'var(--color-green)'
return 'var(--color-green)'
case 'blue':
return props.type === 'highlight' ? 'var(--color-blue-highlight)' : 'var(--color-blue)'
return 'var(--color-blue)'
case 'purple':
return props.type === 'highlight' ? 'var(--color-purple-highlight)' : 'var(--color-purple)'
return 'var(--color-purple)'
case 'standard':
default:
return null
@@ -111,10 +131,14 @@ function setColorFill(
): { bg: string; text: string } {
if (colorVar.value) {
if (fill === 'background') {
colors.bg = colorVar.value
if (props.type === 'highlight') {
if (props.type === 'highlight' && highlightedColorVar.value) {
colors.bg = highlightedColorVar.value
colors.text = 'var(--color-contrast)'
} else if (props.type === 'highlight-colored-text' && highlightedColorVar.value) {
colors.bg = highlightedColorVar.value
colors.text = colorVar.value
} else {
colors.bg = colorVar.value
colors.text = 'var(--color-accent-contrast)'
}
} else if (fill === 'text') {