193 lines
9.4 KiB
CSS
193 lines
9.4 KiB
CSS
/*
|
||
Tasks: Compact
|
||
Colour-based priority status. Show dates on hover. Monochrome emojis.
|
||
|
||
Original credit to @sunb_mn on Obsidian's discord server for
|
||
the basis of these styles which saved me a bit of time:
|
||
https://discord.com/channels/686053708261228577/744933215063638183/1108617092137226320
|
||
|
||
https://github.com/replete/obsidian-minimal-theme-css-snippets
|
||
*/
|
||
|
||
/*!
|
||
Included icons were modified from https://lucide.dev
|
||
License reproduced from https://lucide.dev/license
|
||
|
||
ISC License
|
||
Copyright (c) for portions of Lucide are held by Cole Bemis 2013-2022 as part of Feather (MIT). All other copyright (c) for Lucide are held by Lucide Contributors 2022.
|
||
Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
|
||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
|
||
*/
|
||
@font-face {
|
||
font-family: 'TasksMonoEmojis';
|
||
src: url('data:@file/octet-stream;base64,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') format('woff2');
|
||
unicode-range: U+1F4C5, U+1F501, U+1F517, U+1F53A, U+1F53C, U+1F53D, U+1F6EB, U+23EB, U+23EC, U+23F3, U+2705, U+2795;
|
||
/* 📅, 🔁, 🔗, 🔺, 🔼, 🔽, 🛫, ⏫, ⏬, ⏳, ✅, ➕ */
|
||
/*! Generator: obsidian-tasks-custom-icons v1.0.3 https://github.com/replete/obsidian-tasks-custom-icons */
|
||
}
|
||
|
||
span.tasks-list-text,
|
||
.cm-line:has(.task-list-label) [class^=cm-list-] {
|
||
font-family: 'TasksMonoEmojis', var(--font-text);
|
||
}
|
||
|
||
span.tasks-list-text,
|
||
.cm-line:has(.task-list-label) [class^=cm-list-] {
|
||
font-family: 'TasksMonoEmojis', var(--font-text);
|
||
}
|
||
|
||
/* Priority as colour */
|
||
.task-list-item[data-task-priority=highest] input[type=checkbox] {
|
||
box-shadow: 0px 0px 1px 1px var(--color-red);
|
||
border-color: var(--color-red);
|
||
}
|
||
.task-list-item[data-task-priority=high] input[type=checkbox] {
|
||
box-shadow: 0px 0px 1px 1px var(--color-orange);
|
||
border-color: var(--color-orange);
|
||
}
|
||
.task-list-item[data-task-priority=medium] input[type=checkbox] {
|
||
box-shadow: 0px 0px 1px 1px var(--color-yellow);
|
||
border-color: var(--color-yellow);
|
||
}
|
||
.task-list-item[data-task-priority=low] input[type=checkbox] {
|
||
box-shadow: 0px 0px 1px 1px var(--color-cyan);
|
||
border-color: var(--color-cyan);
|
||
}
|
||
.task-list-item[data-task-priority=lowest] input[type=checkbox] {
|
||
box-shadow: 0px 0px 1px 1px var(--color-cyan);
|
||
border-color: var(--color-cyan);
|
||
opacity:0.6
|
||
}
|
||
.task-list-item[data-task-priority=lowest] .task-description {
|
||
opacity:0.6
|
||
}
|
||
.task-priority {
|
||
display: none;
|
||
}
|
||
input[type=checkbox]:checked {
|
||
box-shadow: none !important;
|
||
border-color: var(--checkbox-border-color) !important;
|
||
}
|
||
|
||
.task-description {
|
||
margin-right:3px;
|
||
}
|
||
|
||
/* Show dates hover */
|
||
:is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created, .task-due) {
|
||
font-size: 1px;
|
||
letter-spacing: -1px;
|
||
color: transparent;
|
||
background-color: transparent;
|
||
}
|
||
:is(.task-recurring, .task-start, .task-scheduled,.task-done, .task-created, .task-due)::after {
|
||
letter-spacing: 0px;
|
||
font-size: var(--font-adaptive-normal, 1rem);
|
||
line-height: var(--line-height);
|
||
color: var(--tx1, var(--text-normal));
|
||
margin-left: 3px;
|
||
}
|
||
.task-recurring::after {
|
||
content: "🔁";
|
||
}
|
||
.task-start::after {
|
||
content: "🛫";
|
||
}
|
||
.task-scheduled::after {
|
||
content: "⏳";
|
||
}
|
||
.task-done::after {
|
||
content: "✅";
|
||
}
|
||
.task-created::after {
|
||
content: "➕";
|
||
}
|
||
.task-due::after {
|
||
content: "📅";
|
||
}
|
||
|
||
.plugin-tasks-query-result [class^=task-]::after {
|
||
cursor: default !important;
|
||
opacity:0.6
|
||
}
|
||
|
||
:is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created, .task-due):hover::after {
|
||
opacity:1;
|
||
}
|
||
|
||
:is(.task-recurring, .task-start, .task-scheduled, .task-done, .task-created, .task-due):hover span {
|
||
position:absolute;
|
||
display:inline-block;
|
||
flex-grow:1;
|
||
letter-spacing: 0px;
|
||
font-size: var(--font-adaptive-small, 0.8rem);
|
||
line-height: var(--line-height, 20px);
|
||
color: var(--tx1, var(--text-normal));
|
||
background:var(--bg2, var(--background-primary));
|
||
border-radius:4px;
|
||
outline:1px solid var(--tx3, var(--text-faint));
|
||
margin-left:10px;
|
||
padding-left:2px;
|
||
padding-right:4px;
|
||
min-width:7rem;
|
||
width: fit-content;
|
||
pointer-events:none;
|
||
z-index:1000;
|
||
box-shadow:2px 2px 3px var(--bg2, var(--background-primary)), 0 0 7px var(--bg2, var(--background-primary));
|
||
line-height:1.2em;
|
||
margin-top:1.5rem;
|
||
margin-left:2px;
|
||
}
|
||
|
||
/* File backlink */
|
||
.plugin-tasks-query-result .tasks-backlink {
|
||
font-size: 1px;
|
||
letter-spacing: -1px;
|
||
color: transparent;
|
||
background-color: transparent;
|
||
width:1.5rem;
|
||
height: 1.5rem;
|
||
align-self:baseline;
|
||
}
|
||
|
||
.plugin-tasks-query-result .tasks-backlink::before {
|
||
content:'... ';
|
||
font-size: var(--font-adaptive-normal, 1rem);
|
||
line-height: var(--line-height, 1rem);
|
||
color: var(--tx1, var(--text-faint));
|
||
transform: translateX(6px);
|
||
display:inline-flex;
|
||
opacity:0.6;
|
||
}
|
||
|
||
.plugin-tasks-query-result .tasks-backlink:hover {
|
||
font-size: var(--font-adaptive-normal, 0.8rem);
|
||
line-height: var(--line-height, 1rem);
|
||
letter-spacing:0;
|
||
width:inherit;
|
||
}
|
||
|
||
.plugin-tasks-query-result .tasks-backlink:hover::before {
|
||
content:''
|
||
}
|
||
|
||
/* Edit button */
|
||
.tasks-edit {
|
||
background-color: var(--tx1, var(--text-normal));
|
||
/* https://caniuse.com/?search=mask-image */
|
||
-webkit-mask-image: url('data:image/svg+xml,<svg enable-background="new 0 0 24 28" viewBox="0 0 24 28" xmlns="http://www.w3.org/2000/svg"><path d="m22 12c-.3 0-.5-.1-.7-.3l-4-4c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l4 4c.4.4.4 1 0 1.4-.2.2-.4.3-.7.3z"/><path d="m2 28c-.3 0-.5-.1-.7-.3-.3-.3-.4-.6-.3-1l1.5-5.5c0-.2.1-.3.3-.4l11.5-11.5c.4-.4 1-.4 1.4 0l4 4c.4.4.4 1 0 1.4l-11.5 11.5c-.1.1-.3.2-.4.3l-5.5 1.5c-.1 0-.2 0-.3 0zm2.4-6-1 3.6 3.6-1 10.6-10.6-2.6-2.6z"/></svg>');
|
||
-webkit-mask-size: 85%;
|
||
-webkit-mask-position: 0 -3px;
|
||
-webkit-mask-repeat: no-repeat;
|
||
transform: translate(0,-1px);
|
||
opacity:0.6;
|
||
margin-left:5px;
|
||
}
|
||
|
||
.tasks-edit:hover {
|
||
opacity: 1;
|
||
}
|
||
|
||
.plugin-tasks-query-result .tasks-backlink {
|
||
float:right;
|
||
} |