sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(frontend): prefix css variables (#14725)

Browse Source 
* wip

* Update index.d.ts

* remove unnecessary codes
This commit is contained in:
syuilo
2024-10-09 18:08:14 +09:00
committed by GitHub
parent 0ad31bd5d4
commit 4a356f1ba7
280 changed files with 1076 additions and 1093 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/frontend/src/components/global/MkAd.vue
View File

@@ -191,7 +191,7 @@ function reduceFrequency(): void {
right: 1px;
display: grid;
place-content: center;
background: var(--panel);
background: var(--MI_THEME-panel);
border-radius: 100%;
padding: 2px;
}
@@ -210,7 +210,7 @@ function reduceFrequency(): void {
padding: 8px;
margin: 0 auto;
max-width: 400px;
border: solid 1px var(--divider);
border: solid 1px var(--MI_THEME-divider);
}
.menuButton {

2
packages/frontend/src/components/global/MkLoading.vue
View File

@@ -56,7 +56,7 @@ const props = withDefaults(defineProps<{
--size: 38px;
&.colored {
color: var(--accent);
color: var(--MI_THEME-accent);
}
&.inline {

10
packages/frontend/src/components/global/MkMfm.ts
View File

@@ -31,8 +31,8 @@ const QUOTE_STYLE = `
display: block;
margin: 8px;
padding: 6px 0 6px 12px;
color: var(--fg);
border-left: solid 3px var(--fg);
color: var(--MI_THEME-fg);
border-left: solid 3px var(--MI_THEME-fg);
opacity: 0.7;
`.split('\n').join(' ');
@@ -270,7 +270,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
}
case 'border': {
let color = validColor(token.props.args.color);
color = color ? `#${color}` : 'var(--accent)';
color = color ? `#${color}` : 'var(--MI_THEME-accent)';
let b_style = token.props.args.style;
if (
typeof b_style !== 'string' ||
@@ -303,7 +303,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
const child = token.children[0];
const unixtime = parseInt(child.type === 'text' ? child.props.text : '');
return h('span', {
style: 'display: inline-block; font-size: 90%; border: solid 1px var(--divider); border-radius: 999px; padding: 4px 10px 4px 6px;',
style: 'display: inline-block; font-size: 90%; border: solid 1px var(--MI_THEME-divider); border-radius: 999px; padding: 4px 10px 4px 6px;',
}, [
h('i', {
class: 'ti ti-clock',
@@ -377,7 +377,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
return [h(MkA, {
key: Math.random(),
to: isNote ? `/tags/${encodeURIComponent(token.props.hashtag)}` : `/user-tags/${encodeURIComponent(token.props.hashtag)}`,
style: 'color:var(--hashtag);',
style: 'color:var(--MI_THEME-hashtag);',
behavior: props.linkNavigationBehavior,
}, `#${token.props.hashtag}`)];
}

2
packages/frontend/src/components/global/MkPageHeader.tabs.vue
View File

@@ -247,7 +247,7 @@ onUnmounted(() => {
position: absolute;
bottom: 0;
height: 3px;
background: var(--accent);
background: var(--MI_THEME-accent);
border-radius: 999px;
transition: none;
pointer-events: none;

6
packages/frontend/src/components/global/MkPageHeader.vue
View File

@@ -99,7 +99,7 @@ function onTabClick(): void {
}
const calcBg = () => {
const rawBg = 'var(--bg)';
const rawBg = 'var(--MI_THEME-bg)';
const tinyBg = tinycolor(rawBg.startsWith('var(') ? getComputedStyle(document.documentElement).getPropertyValue(rawBg.slice(4, -1)) : rawBg);
tinyBg.setAlpha(0.85);
bg.value = tinyBg.toRgbString();
@@ -132,7 +132,7 @@ onUnmounted(() => {
.root {
-webkit-backdrop-filter: var(--blur, blur(15px));
backdrop-filter: var(--blur, blur(15px));
border-bottom: solid 0.5px var(--divider);
border-bottom: solid 0.5px var(--MI_THEME-divider);
width: 100%;
}
@@ -230,7 +230,7 @@ onUnmounted(() => {
}
&.highlighted {
color: var(--accent);
color: var(--MI_THEME-accent);
}
}

4
packages/frontend/src/components/global/MkTime.vue
View File

@@ -99,10 +99,10 @@ if (!invalid && props.origin === null && (props.mode === 'relative' || props.mod
<style lang="scss" module>
.old1 {
color: var(--warn);
color: var(--MI_THEME-warn);
}
.old1.old2 {
color: var(--error);
color: var(--MI_THEME-error);
}
</style>