diff options
| author | HJ <30-hj@users.noreply.git.pleroma.social> | 2024-07-31 16:31:06 +0000 |
|---|---|---|
| committer | HJ <30-hj@users.noreply.git.pleroma.social> | 2024-07-31 16:31:06 +0000 |
| commit | 6bc020c733047d7033e508a2b4dffc581d703170 (patch) | |
| tree | fe52d41d57c827e8872da21e5ac10d412058f43e /src/components/menu_item.style.js | |
| parent | 83acbf953a4f50a017e3e857ecbd0b008f0b3be0 (diff) | |
| parent | 9d51eccf5dd0b4b773db5ec146d818b6c8fe18ac (diff) | |
Merge branch 'release/2.7.x' into 'master'
Release 2.7.0
See merge request pleroma/pleroma-fe!1928
Diffstat (limited to 'src/components/menu_item.style.js')
| -rw-r--r-- | src/components/menu_item.style.js | 90 |
1 files changed, 90 insertions, 0 deletions
diff --git a/src/components/menu_item.style.js b/src/components/menu_item.style.js new file mode 100644 index 00000000..51388155 --- /dev/null +++ b/src/components/menu_item.style.js @@ -0,0 +1,90 @@ +export default { + name: 'MenuItem', + selector: '.menu-item', + validInnerComponents: [ + 'Text', + 'Icon', + 'Input', + 'Border', + 'ButtonUnstyled', + 'Badge', + 'Avatar' + ], + states: { + hover: ':hover', + active: '.-active' + }, + defaultRules: [ + { + directives: { + background: '--bg', + opacity: 0 + } + }, + { + state: ['hover'], + directives: { + background: '$mod(--bg, 5)', + opacity: 1 + } + }, + { + state: ['active'], + directives: { + background: '$mod(--bg, 10)', + opacity: 1 + } + }, + { + state: ['active', 'hover'], + directives: { + background: '$mod(--bg, 15)', + opacity: 1 + } + }, + { + component: 'Text', + parent: { + component: 'MenuItem', + state: ['hover'] + }, + directives: { + textColor: '--link', + textAuto: 'no-preserve' + } + }, + { + component: 'Text', + parent: { + component: 'MenuItem', + state: ['active'] + }, + directives: { + textColor: '--link', + textAuto: 'no-preserve' + } + }, + { + component: 'Icon', + parent: { + component: 'MenuItem', + state: ['active'] + }, + directives: { + textColor: '--link', + textAuto: 'no-preserve' + } + }, + { + component: 'Icon', + parent: { + component: 'MenuItem', + state: ['hover'] + }, + directives: { + textColor: '--link', + textAuto: 'no-preserve' + } + } + ] +} |
