refactor(frontend): prefix css variables (UI) (#14739)
* refactor(frontend): prefix css variables * `MI_UI` -> `MI` * fix * `stickyBottom` * stickyTop
This commit is contained in:
@@ -31,10 +31,10 @@ defineProps<{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: var(--margin);
|
||||
padding: var(--MI-margin);
|
||||
margin-top: 4px;
|
||||
border: 1px solid var(--MI_THEME-inputBorder);
|
||||
border-radius: var(--radius);
|
||||
border-radius: var(--MI-radius);
|
||||
background-color: var(--MI_THEME-panel);
|
||||
transition: background-color .1s, border-color .1s;
|
||||
|
||||
|
@@ -29,9 +29,9 @@ defineProps<{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: 16 / 9;
|
||||
padding: var(--margin);
|
||||
padding: var(--MI-margin);
|
||||
border: 1px solid var(--MI_THEME-divider);
|
||||
border-radius: var(--radius);
|
||||
border-radius: var(--MI-radius);
|
||||
background-color: #000;
|
||||
|
||||
&:hover {
|
||||
|
@@ -190,7 +190,7 @@ const isDeleted = ref(false);
|
||||
width: calc(100% - 8px);
|
||||
height: calc(100% - 8px);
|
||||
border: dashed 2px var(--MI_THEME-focus);
|
||||
border-radius: var(--radius);
|
||||
border-radius: var(--MI-radius);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
@@ -356,7 +356,7 @@ const isDeleted = ref(false);
|
||||
width: 58px;
|
||||
height: 58px;
|
||||
position: sticky !important;
|
||||
top: calc(22px + var(--stickyTop, 0px));
|
||||
top: calc(22px + var(--MI-stickyTop, 0px));
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@@ -377,7 +377,7 @@ const isDeleted = ref(false);
|
||||
width: 100%;
|
||||
margin-top: 14px;
|
||||
position: sticky;
|
||||
bottom: calc(var(--stickyBottom, 0px) + 14px);
|
||||
bottom: calc(var(--MI-stickyBottom, 0px) + 14px);
|
||||
}
|
||||
|
||||
.showLessLabel {
|
||||
@@ -430,7 +430,7 @@ const isDeleted = ref(false);
|
||||
|
||||
.translation {
|
||||
border: solid 0.5px var(--MI_THEME-divider);
|
||||
border-radius: var(--radius);
|
||||
border-radius: var(--MI-radius);
|
||||
padding: 12px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
@@ -550,7 +550,7 @@ const isDeleted = ref(false);
|
||||
margin: 0 10px 0 0;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
top: calc(14px + var(--stickyTop, 0px));
|
||||
top: calc(14px + var(--MI-stickyTop, 0px));
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -364,7 +364,7 @@ const collapsed = ref(appearNote.value.cw == null && isLong);
|
||||
width: 100%;
|
||||
margin-top: 14px;
|
||||
position: sticky;
|
||||
bottom: calc(var(--stickyBottom, 0px) + 14px);
|
||||
bottom: calc(var(--MI-stickyBottom, 0px) + 14px);
|
||||
}
|
||||
|
||||
.showLessLabel {
|
||||
|
@@ -53,7 +53,7 @@ const showContent = ref(false);
|
||||
height: 34px;
|
||||
border-radius: 8px;
|
||||
position: sticky !important;
|
||||
top: calc(16px + var(--stickyTop, 0px));
|
||||
top: calc(16px + var(--MI-stickyTop, 0px));
|
||||
left: 0;
|
||||
}
|
||||
|
||||
|
@@ -100,7 +100,7 @@ const collapsed = ref(isLong);
|
||||
width: 100%;
|
||||
margin-top: 14px;
|
||||
position: sticky;
|
||||
bottom: calc(var(--stickyBottom, 0px) + 14px);
|
||||
bottom: calc(var(--MI-stickyBottom, 0px) + 14px);
|
||||
}
|
||||
|
||||
.showLessLabel {
|
||||
|
Reference in New Issue
Block a user