selfhosted
/
zer0bin
mirror of https://github.com/zer0bin-dev/zer0bin
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: ✨ Add keybinds to tooltips

This commit is contained in:
ThatOneCalculator 2022-03-21 17:56:28 -07:00
parent 44700e686e
commit 868b9c45be
3 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/icons.ts
View File

@ -34,25 +34,29 @@ githubButton.innerHTML += renderIconDefinitionToSVGElement(GithubOutlined, {
})
tippy("#save-button", {
content: "Save paste",
content: "Save paste<br><span class='keybind'>Ctrl + S</span>",
animation: "scale",
theme: "rosepine",
allowHTML: true,
})
tippy("#new-button", {
content: "New paste",
content: "New paste<br><span class='keybind'>Ctrl + N</span>",
animation: "scale",
theme: "rosepine",
allowHTML: true,
})
tippy("#copy-button", {
content: "Duplicate paste",
content: "Save paste<br><span class='keybind'>Ctrl + D</span>",
animation: "scale",
theme: "rosepine",
allowHTML: true,
})
tippy("#github-button", {
content: "GitHub",
animation: "scale",
theme: "rosepine",
allowHTML: true,
})

5
frontend/style/style.scss
View File

@ -175,6 +175,11 @@ a {
color: $muted;
cursor: auto;
}
.keybind {
color: $subtle;
font-size: 11px;
font-family: $font-mono;
}
.logo {
font-size: 1.8rem;
font-weight: 700;

3
frontend/style/tooltip.scss
View File

@ -6,9 +6,6 @@ $bg: #26233a;
@import "./font.scss";
.tippy-box[data-theme~="rosepine"] {
color: $color_1;
box-shadow: 0 0 20px 4px rgba(82, 79, 103, 0.15),
0 4px 80px -8px rgba(64, 61, 82, 0.25),
0 4px 4px -2px rgba(33, 32, 46, 0.15);
background-color: $bg;
opacity: 0.8;
margin-top: 10px;