Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-22 17:40:13 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

♻️ chip

Browse source
This commit is contained in:
Vanessa 2023-03-23 11:59:35 +08:00 • committed by Liang Ding
parent 469ba75332
commit 0a8c69001a
No known key found for this signature in database
GPG key ID: 136F30F901A2231D
6 changed files with 30 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

7
app/src/assets/scss/business/_history.scss
View file

@ -17,13 +17,6 @@
box-sizing: border-box; box-sizing: border-box;
border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
overflow: hidden; overflow: hidden;
.b3-chip--secondary {
padding: 0 8px;
font-size: 12px;
line-height: 16px;
margin-right: 8px;
}
} }
&__repoheader { &__repoheader {

28
app/src/assets/scss/component/_chip.scss
View file

@ -3,18 +3,34 @@ a.b3-chip:hover {
background-color: #ea4aaa; background-color: #ea4aaa;
} }
.b3-chips {
display: flex;
padding: 4px;
.b3-chip {
margin: 4px;
}
}
.b3-chip { .b3-chip {
background-color: var(--b3-list-hover); background-color: var(--b3-list-hover);
color: var(--b3-theme-on-background); color: var(--b3-theme-on-background);
line-height: 32px; line-height: 16px;
font-weight: 400; font-weight: 400;
font-size: 0.8125rem;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
box-sizing: border-box; box-sizing: border-box;
padding: 0 16px; padding: 8px 12px;
border-radius: 16px; border-radius: 16px;
transition: var(--b3-transition); transition: var(--b3-transition);
&--small {
padding: 0 8px;
font-size: 12px;
line-height: 16px;
}
&--secondary { &--secondary {
background-color: var(--b3-theme-secondary); background-color: var(--b3-theme-secondary);
color: var(--b3-theme-on-secondary); color: var(--b3-theme-on-secondary);
@ -26,9 +42,9 @@ a.b3-chip:hover {
} }
svg { svg {
margin-right: 4px; margin-right: 6px;
margin-left: -4px; margin-left: -5px;
height: 14px; height: 16px;
width: 14px; width: 16px;
} }
} }

4
app/src/assets/scss/component/_select.scss
View file

@ -1,9 +1,9 @@
.b3-select { .b3-select {
border: 0; border: 0;
border-radius: 4px; border-radius: 4px;
padding: 4px 8px; padding: 4px 26px 4px 8px;
line-height: 20px;
box-sizing: border-box; box-sizing: border-box;
line-height: 20px;
color: var(--b3-theme-on-background); color: var(--b3-theme-on-background);
transition: box-shadow 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color .2s cubic-bezier(0, 0, .2, 1) 0ms; transition: box-shadow 120ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color .2s cubic-bezier(0, 0, .2, 1) 0ms;
min-width: 200px; min-width: 200px;

4
app/src/config/account.ts
View file

@ -45,9 +45,9 @@ ${window.siyuan.languages.account2}
if (window.siyuan.user) { if (window.siyuan.user) {
let userTitlesHTML = ""; let userTitlesHTML = "";
if (window.siyuan.user.userTitles.length > 0) { if (window.siyuan.user.userTitles.length > 0) {
userTitlesHTML = '<div class="fn__hr--b"></div><div class="fn__flex" style="position: absolute"><span class="fn__space"></span>'; userTitlesHTML = '<div class="b3-chips" style="position: absolute">';
window.siyuan.user.userTitles.forEach((item) => { window.siyuan.user.userTitles.forEach((item) => {
userTitlesHTML += `<div class="b3-chip">${item.icon} ${item.name}</div><span class="fn__space"></span>`; userTitlesHTML += `<div class="b3-chip">${item.icon} ${item.name}</div>`;
}); });
userTitlesHTML += "</div>"; userTitlesHTML += "</div>";
} }

4
app/src/history/history.ts
View file

@ -102,7 +102,7 @@ const renderRepoItem = (response: IWebSocketData, element: Element, type: string
repoHTML += `<li class="b3-list-item b3-list-item--two" data-type="repoitem"> repoHTML += `<li class="b3-list-item b3-list-item--two" data-type="repoitem">
<div class="b3-list-item__first"> <div class="b3-list-item__first">
<span class="b3-list-item__text">${escapeHtml(item.memo)}</span> <span class="b3-list-item__text">${escapeHtml(item.memo)}</span>
<span class="b3-chip b3-chip--secondary${item.tag ? "" : " fn__none"}">${item.tag}</span> <span class="b3-chip b3-chip--secondary b3-chip--small${item.tag ? "" : " fn__none"}">${item.tag}</span>
</div> </div>
<div> <div>
<span class="ft__smaller ft__on-surface">${item.hCreated}</span> <span class="ft__smaller ft__on-surface">${item.hCreated}</span>
@ -116,7 +116,7 @@ const renderRepoItem = (response: IWebSocketData, element: Element, type: string
<div class="fn__flex-1"> <div class="fn__flex-1">
<div class="b3-list-item__text"> <div class="b3-list-item__text">
${escapeHtml(item.memo)} ${escapeHtml(item.memo)}
<span class="b3-chip b3-chip--secondary${item.tag ? "" : " fn__none"}">${item.tag}</span> <span class="b3-chip b3-chip--secondary b3-chip--small${item.tag ? "" : " fn__none"}">${item.tag}</span>
</div> </div>
<div> <div>
<span class="ft__smaller ft__on-surface">${item.hCreated}</span> <span class="ft__smaller ft__on-surface">${item.hCreated}</span>

4
app/src/mobile/util/menu.ts
View file

@ -21,9 +21,9 @@ import {activeBlur, hideKeyboardToolbar} from "./keyboardToolbar";
const showAccountInfo = (modelElement: HTMLElement, modelMainElement: Element) => { const showAccountInfo = (modelElement: HTMLElement, modelMainElement: Element) => {
let userTitlesHTML = ""; let userTitlesHTML = "";
if (window.siyuan.user.userTitles.length > 0) { if (window.siyuan.user.userTitles.length > 0) {
userTitlesHTML = '<div class="fn__hr--b"></div><div class="fn__flex" style="position: absolute"><span class="fn__space"></span>'; userTitlesHTML = '<div class="b3-chips" style="position: absolute">';
window.siyuan.user.userTitles.forEach((item) => { window.siyuan.user.userTitles.forEach((item) => {
userTitlesHTML += `<div class="b3-chip">${item.icon} ${item.name}</div><span class="fn__space"></span>`; userTitlesHTML += `<div class="b3-chip">${item.icon} ${item.name}</div>`;
}); });
userTitlesHTML += "</div>"; userTitlesHTML += "</div>";
} }