mirrors/barkey
1
0
Fork 0
mirror of https://codeberg.org/yeentown/barkey.git synced 2025-07-07 20:44:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

merge: apply more styles to our icons - fixes #1081 (!1069)

Browse source 
View MR for information: https://activitypub.software/TransFem-org/Sharkey/-/merge_requests/1069

Closes #1081

Approved-by: Hazelnoot <acomputerdog@gmail.com>
Approved-by: Marie <github@yuugi.dev>
This commit is contained in:
Marie 2025-05-30 17:55:25 +00:00
commit 9637e1b82b
4 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
CONTRIBUTING.md
View file

@ -690,7 +690,7 @@ seems to do a decent job)
* re-generate locales (`pnpm run build-assets`) and commit * re-generate locales (`pnpm run build-assets`) and commit
* build the frontend: `rm -rf built/; NODE_ENV=development pnpm --filter=frontend --filter=frontend-embed --filter=frontend-shared build` (the `development` tells it to keep some of the original filenames in the built files) * build the frontend: `rm -rf built/; NODE_ENV=development pnpm --filter=frontend --filter=frontend-embed --filter=frontend-shared build` (the `development` tells it to keep some of the original filenames in the built files)
* make sure there aren't any new `ti-*` classes (Tabler Icons), and replace them with appropriate `ph-*` ones (Phosphor Icons) in [`vite.replaceicons.ts`](packages/frontend/vite.replaceIcons.ts). * make sure there aren't any new `ti-*` classes (Tabler Icons), and replace them with appropriate `ph-*` ones (Phosphor Icons) in [`vite.replaceicons.ts`](packages/frontend/vite.replaceIcons.ts).
* This command should show you want to change: `grep -ohrP '(?<=["'\'']ti )(ti-(?!fw)[\w\-]+)' --exclude \*.map -- built/ | sort -u`. * This command should show you want to change: `grep -ohrP '(?<=["'\''](ti )?)(ti-(?!fw)[\w\-]+)' --exclude \*.map -- built/ | sort -u`.
* NOTE: `ti-fw` is a special class that's defined by Misskey, leave it alone. * NOTE: `ti-fw` is a special class that's defined by Misskey, leave it alone.
* After every change, re-build the frontend and check again, until there are no more `ti-*` classes in the built files. * After every change, re-build the frontend and check again, until there are no more `ti-*` classes in the built files.
* Commit! * Commit!

2
packages/frontend-embed/src/style.scss
View file

@ -101,7 +101,7 @@ rt {
} }
} }
.ti { .ti, ph-lg {
width: 1.28em; width: 1.28em;
vertical-align: -12%; vertical-align: -12%;
line-height: 1em; line-height: 1em;

2
packages/frontend/src/pages/page.vue
View file

@ -347,7 +347,7 @@ definePage(() => ({
text-align: center; text-align: center;
border-radius: 99rem; border-radius: 99rem;
& :global(.ti) { & :global(.ti), & :global(.ph-lg) {
line-height: 2.5rem; line-height: 2.5rem;
} }

6
packages/frontend/vite.replaceIcons.ts
View file

@ -224,6 +224,7 @@ export function pluginReplaceIcons() {
'ti ti-dice-5': 'ph ph-dice-five ph-bold ph-lg', 'ti ti-dice-5': 'ph ph-dice-five ph-bold ph-lg',
'ti ti-dots': 'ph-dots-three ph-bold ph-lg', 'ti ti-dots': 'ph-dots-three ph-bold ph-lg',
'ti ti-download': 'ph-download ph-bold ph-lg', 'ti ti-download': 'ph-download ph-bold ph-lg',
'ti-download': 'ph-download ph-bold ph-lg', // in custom-emoji-manager.remote.list
'ti ti-edit': 'ph-pencil-simple-line ph-bold ph-lg', 'ti ti-edit': 'ph-pencil-simple-line ph-bold ph-lg',
'ti ti-equal-double': 'ph-equals ph-bold ph-lg', 'ti ti-equal-double': 'ph-equals ph-bold ph-lg',
'ti ti-equal-not': 'ph-prohibit ph-bold ph-lg', 'ti ti-equal-not': 'ph-prohibit ph-bold ph-lg',
@ -258,6 +259,7 @@ export function pluginReplaceIcons() {
'ti ti-home': 'ph-house ph-bold ph-lg', 'ti ti-home': 'ph-house ph-bold ph-lg',
'ti ti-hourglass-empty': 'ph-hourglass ph-bold ph-lg', 'ti ti-hourglass-empty': 'ph-hourglass ph-bold ph-lg',
'ti ti-icons': 'ph-squares-four ph-bold ph-lg', 'ti ti-icons': 'ph-squares-four ph-bold ph-lg',
'ti-icons': 'ph-squares-four ph-bold ph-lg', // in custom-emoji-manager.local.list
'ti ti-id': 'ph-identification-card ph-bold ph-lg', 'ti ti-id': 'ph-identification-card ph-bold ph-lg',
'ti ti-info-circle': 'ph-info ph-bold ph-lg', 'ti ti-info-circle': 'ph-info ph-bold ph-lg',
'ti ti-json': 'ph-brackets-curly ph-bold ph-lg', 'ti ti-json': 'ph-brackets-curly ph-bold ph-lg',
@ -275,6 +277,7 @@ export function pluginReplaceIcons() {
'ti ti-lock-star': 'ph-shield-star ph-bold ph-lg', 'ti ti-lock-star': 'ph-shield-star ph-bold ph-lg',
'ti ti-login-2': 'ph-sign-in ph-bold ph-lg', 'ti ti-login-2': 'ph-sign-in ph-bold ph-lg',
'ti ti-mail': 'ph-envelope ph-bold ph-lg', 'ti ti-mail': 'ph-envelope ph-bold ph-lg',
'ti-mail': 'ph-envelope ph-bold ph-lg', // in notification-recipient.item.vue
'ti ti-map-pin': 'ph-map-pin ph-bold ph-lg', 'ti ti-map-pin': 'ph-map-pin ph-bold ph-lg',
'ti ti-maximize': 'ph-frame-corners ph-bold ph-lg', 'ti ti-maximize': 'ph-frame-corners ph-bold ph-lg',
'ti ti-medal': 'ph-trophy ph-bold ph-lg', 'ti ti-medal': 'ph-trophy ph-bold ph-lg',
@ -359,6 +362,7 @@ export function pluginReplaceIcons() {
'ti ti-text-caption': 'ph-text-indent ph-bold ph-lg', 'ti ti-text-caption': 'ph-text-indent ph-bold ph-lg',
'ti ti-tool': 'ph-wrench ph-bold ph-lg', 'ti ti-tool': 'ph-wrench ph-bold ph-lg',
'ti ti-trash': 'ph-trash ph-bold ph-lg', 'ti ti-trash': 'ph-trash ph-bold ph-lg',
'ti-trash': 'ph-trash ph-bold ph-lg', // in custom-emoji-manager.local.list
'ti ti-trophy': 'ph-trophy ph-bold ph-lg', 'ti ti-trophy': 'ph-trophy ph-bold ph-lg',
'ti ti-universe': 'ph-rocket-launch ph-bold ph-lg', 'ti ti-universe': 'ph-rocket-launch ph-bold ph-lg',
'ti ti-upload': 'ph-upload ph-bold ph-lg', 'ti ti-upload': 'ph-upload ph-bold ph-lg',
@ -379,6 +383,7 @@ export function pluginReplaceIcons() {
'ti ti-volume': 'ph-speaker-high ph-bold ph-lg', 'ti ti-volume': 'ph-speaker-high ph-bold ph-lg',
'ti ti-volume-3': 'ph-speaker-x ph-bold ph-lg', 'ti ti-volume-3': 'ph-speaker-x ph-bold ph-lg',
'ti ti-webhook': 'ph-webhooks-logo ph-bold ph-lg', 'ti ti-webhook': 'ph-webhooks-logo ph-bold ph-lg',
'ti-webhook': 'ph-webhooks-logo ph-bold ph-lg', // in notification-recipient.item.vue
'ti ti-whirl': 'ph-globe-hemisphere-west ph-bold ph-lg', 'ti ti-whirl': 'ph-globe-hemisphere-west ph-bold ph-lg',
'ti ti-window-maximize': 'ph-frame-corners ph-bold ph-lg', 'ti ti-window-maximize': 'ph-frame-corners ph-bold ph-lg',
'ti ti-world': 'ph-globe-hemisphere-west ph-bold ph-lg', 'ti ti-world': 'ph-globe-hemisphere-west ph-bold ph-lg',
@ -389,6 +394,7 @@ export function pluginReplaceIcons() {
'ti ti-world-x': 'ph-planet ph-bold ph-lg', 'ti ti-world-x': 'ph-planet ph-bold ph-lg',
'ti ti-x': 'ph-x ph-bold ph-lg', 'ti ti-x': 'ph-x ph-bold ph-lg',
'ti ti-help': 'ph-question ph-bold ph-lg', 'ti ti-help': 'ph-question ph-bold ph-lg',
'ti-help': 'ph-question ph-bold ph-lg', // in notification-recipient.item.vue
'ti ti ti-caret-down': 'ph-caret-down ph-bold ph-lg', 'ti ti ti-caret-down': 'ph-caret-down ph-bold ph-lg',
'ti ti-chevron-down': 'ph-caret-down ph-bold ph-lg', 'ti ti-chevron-down': 'ph-caret-down ph-bold ph-lg',
'ti ti-accessible': 'ph-person-simple-circle ph-bold ph-lg', 'ti ti-accessible': 'ph-person-simple-circle ph-bold ph-lg',