mirror of
https://github.com/siyuan-note/siyuan.git
synced 2025-12-22 17:40:13 +01:00
♻️ chip
This commit is contained in:
parent
469ba75332
commit
0a8c69001a
6 changed files with 30 additions and 21 deletions
|
|
@ -17,13 +17,6 @@
|
|||
box-sizing: border-box;
|
||||
border-radius: 0 0 4px 4px;
|
||||
overflow: hidden;
|
||||
|
||||
.b3-chip--secondary {
|
||||
padding: 0 8px;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
&__repoheader {
|
||||
|
|
|
|||
|
|
@ -3,18 +3,34 @@ a.b3-chip:hover {
|
|||
background-color: #ea4aaa;
|
||||
}
|
||||
|
||||
.b3-chips {
|
||||
display: flex;
|
||||
padding: 4px;
|
||||
|
||||
.b3-chip {
|
||||
margin: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.b3-chip {
|
||||
background-color: var(--b3-list-hover);
|
||||
color: var(--b3-theme-on-background);
|
||||
line-height: 32px;
|
||||
line-height: 16px;
|
||||
font-weight: 400;
|
||||
font-size: 0.8125rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding: 0 16px;
|
||||
padding: 8px 12px;
|
||||
border-radius: 16px;
|
||||
transition: var(--b3-transition);
|
||||
|
||||
&--small {
|
||||
padding: 0 8px;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
&--secondary {
|
||||
background-color: var(--b3-theme-secondary);
|
||||
color: var(--b3-theme-on-secondary);
|
||||
|
|
@ -26,9 +42,9 @@ a.b3-chip:hover {
|
|||
}
|
||||
|
||||
svg {
|
||||
margin-right: 4px;
|
||||
margin-left: -4px;
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
margin-right: 6px;
|
||||
margin-left: -5px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
.b3-select {
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
padding: 4px 8px;
|
||||
line-height: 20px;
|
||||
padding: 4px 26px 4px 8px;
|
||||
box-sizing: border-box;
|
||||
line-height: 20px;
|
||||
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;
|
||||
min-width: 200px;
|
||||
|
|
|
|||
|
|
@ -45,9 +45,9 @@ ${window.siyuan.languages.account2}
|
|||
if (window.siyuan.user) {
|
||||
let userTitlesHTML = "";
|
||||
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) => {
|
||||
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>";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
<div class="b3-list-item__first">
|
||||
<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>
|
||||
<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="b3-list-item__text">
|
||||
${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>
|
||||
<span class="ft__smaller ft__on-surface">${item.hCreated}</span>
|
||||
|
|
|
|||
|
|
@ -21,9 +21,9 @@ import {activeBlur, hideKeyboardToolbar} from "./keyboardToolbar";
|
|||
const showAccountInfo = (modelElement: HTMLElement, modelMainElement: Element) => {
|
||||
let userTitlesHTML = "";
|
||||
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) => {
|
||||
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>";
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue