commit: da2c016ab42f2cfbc8926e816fb842ce2293d1a0
parent 7e684ea3ff67803e4dd419f9db561fc52fd9893f
Author: Henry Jameson <me@hjkos.com>
Date: Sun, 6 Oct 2024 14:10:19 +0300
better vars nomenclature
Diffstat:
3 files changed, 24 insertions(+), 24 deletions(-)
diff --git a/src/components/button.style.js b/src/components/button.style.js
@@ -35,11 +35,11 @@ export default {
{
component: 'Root',
directives: {
- '--defaultButtonHoverGlow': 'shadow | 0 0 4 --text / 0.5',
- '--defaultButtonFocusGlow': 'shadow | 0 0 4 4 --link / 0.5',
- '--defaultButtonShadow': 'shadow | 0 0 2 #000000',
- '--defaultButtonBevel': 'shadow | $borderSide(#FFFFFF top 0.2 2), $borderSide(#000000 bottom 0.2 2)',
- '--pressedButtonBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2 2), $borderSide(#000000 top 0.2 2)'
+ '--buttonDefaultHoverGlow': 'shadow | 0 0 4 --text / 0.5',
+ '--buttonDefaultFocusGlow': 'shadow | 0 0 4 4 --link / 0.5',
+ '--buttonDefaultShadow': 'shadow | 0 0 2 #000000',
+ '--buttonDefaultBevel': 'shadow | $borderSide(#FFFFFF top 0.2 2), $borderSide(#000000 bottom 0.2 2)',
+ '--buttonPressedBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2 2), $borderSide(#000000 top 0.2 2)'
}
},
{
@@ -47,53 +47,53 @@ export default {
// like within it
directives: {
background: '--fg',
- shadow: ['--defaultButtonShadow', '--defaultButtonBevel'],
+ shadow: ['--buttonDefaultShadow', '--buttonDefaultBevel'],
roundness: 3
}
},
{
state: ['hover'],
directives: {
- shadow: ['--defaultButtonHoverGlow', '--defaultButtonBevel']
+ shadow: ['--buttonDefaultHoverGlow', '--buttonDefaultBevel']
}
},
{
state: ['focused'],
directives: {
- shadow: ['--defaultButtonFocusGlow', '--defaultButtonBevel']
+ shadow: ['--buttonDefaultFocusGlow', '--buttonDefaultBevel']
}
},
{
state: ['pressed'],
directives: {
- shadow: ['--defaultButtonShadow', '--pressedButtonBevel']
+ shadow: ['--buttonDefaultShadow', '--buttonPressedBevel']
}
},
{
state: ['pressed', 'hover'],
directives: {
- shadow: ['--pressedButtonBevel', '--defaultButtonHoverGlow']
+ shadow: ['--buttonPressedBevel', '--buttonDefaultHoverGlow']
}
},
{
state: ['toggled'],
directives: {
background: '--inheritedBackground,-14.2',
- shadow: ['--defaultButtonShadow', '--pressedButtonBevel']
+ shadow: ['--buttonDefaultShadow', '--buttonPressedBevel']
}
},
{
state: ['toggled', 'hover'],
directives: {
background: '--inheritedBackground,-14.2',
- shadow: ['--defaultButtonHoverGlow', '--pressedButtonBevel']
+ shadow: ['--buttonDefaultHoverGlow', '--buttonPressedBevel']
}
},
{
state: ['disabled'],
directives: {
background: '$blend(--inheritedBackground 0.25 --parent)',
- shadow: ['--defaultButtonBevel']
+ shadow: ['--buttonDefaultBevel']
}
},
{
diff --git a/src/components/input.style.js b/src/components/input.style.js
@@ -18,9 +18,9 @@ export default {
{
component: 'Root',
directives: {
- '--defaultInputBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2), $borderSide(#000000 top 0.2)',
- '--defaultInputHoverGlow': 'shadow | 0 0 4 --text / 0.5',
- '--defaultInputFocusGlow': 'shadow | 0 0 4 4 --link / 0.5'
+ '--inputDefaultBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2), $borderSide(#000000 top 0.2)',
+ '--inputDefaultHoverGlow': 'shadow | 0 0 4 --text / 0.5',
+ '--inputDefaultFocusGlow': 'shadow | 0 0 4 4 --link / 0.5'
}
},
{
@@ -41,25 +41,25 @@ export default {
spread: 0,
color: '#000000',
alpha: 1
- }, '--defaultInputBevel']
+ }, '--inputDefaultBevel']
}
},
{
state: ['hover'],
directives: {
- shadow: ['--defaultInputHoverGlow', '--defaultInputBevel']
+ shadow: ['--inputDefaultHoverGlow', '--inputDefaultBevel']
}
},
{
state: ['focused'],
directives: {
- shadow: ['--defaultInputFocusGlow', '--defaultInputBevel']
+ shadow: ['--inputDefaultFocusGlow', '--inputDefaultBevel']
}
},
{
state: ['focused', 'hover'],
directives: {
- shadow: ['--defaultInputFocusGlow', '--defaultInputHoverGlow', '--defaultInputBevel']
+ shadow: ['--inputDefaultFocusGlow', '--inputDefaultHoverGlow', '--inputDefaultBevel']
}
},
{
diff --git a/src/components/tab_switcher/tab.style.js b/src/components/tab_switcher/tab.style.js
@@ -14,14 +14,14 @@ export default {
{
directives: {
background: '--fg',
- shadow: ['--defaultButtonShadow', '--defaultButtonBevel'],
+ shadow: ['--buttonDefaultShadow', '--buttonDefaultBevel'],
roundness: 3
}
},
{
state: ['hover'],
directives: {
- shadow: ['--defaultButtonHoverGlow', '--defaultButtonBevel']
+ shadow: ['--buttonDefaultHoverGlow', '--buttonDefaultBevel']
}
},
{
@@ -33,14 +33,14 @@ export default {
{
state: ['hover', 'active'],
directives: {
- shadow: ['--defaultButtonShadow', '--defaultButtonBevel']
+ shadow: ['--buttonDefaultShadow', '--buttonDefaultBevel']
}
},
{
state: ['disabled'],
directives: {
background: '$blend(--inheritedBackground 0.25 --parent)',
- shadow: ['--defaultButtonBevel']
+ shadow: ['--buttonDefaultBevel']
}
},
{