diff --git a/workflowy-helper/main.js b/workflowy-helper/main.js index 8a49ada..b4659b8 100644 --- a/workflowy-helper/main.js +++ b/workflowy-helper/main.js @@ -37,8 +37,10 @@ ret.push('today'); } else if (dayDifference === 1) { ret.push('tomorrow'); + ret.push('future'); } else if (dayDifference === -1) { ret.push('yesterday'); + ret.push('late'); } else { if (dayDifference < 0) { ret.push('late'); diff --git a/workflowy-helper/style.css b/workflowy-helper/style.css index 9921e9a..1fd2229 100644 --- a/workflowy-helper/style.css +++ b/workflowy-helper/style.css @@ -115,69 +115,83 @@ body::-webkit-scrollbar { content: "→"; } -.linked-xGOAL > .name .innerContentContainer, -.linked-xGOAL > .notes .innerContentContainer { +.tagged-GOAL > .name .innerContentContainer, +.tagged-GOAL > .notes .innerContentContainer { color: var(--yellow); } -.linked-xGOAL > .name .innerContentContainer { +.tagged-GOAL > .name .innerContentContainer { font-weight: bold; } -.linked-xVISUALISATION > .name .innerContentContainer, -.linked-xVISUALISATION > .notes .innerContentContainer { +.tagged-RESPONSIBILITY > .name .innerContentContainer, +.tagged-RESPONSIBILITY > .notes .innerContentContainer { color: var(--red); } -.linked-xPROJECT > .name .innerContentContainer { +.tagged-RESPONSIBILITY > .name .innerContentContainer { font-weight: bold; } -.linked-xPROJECT.tagged-ACTIVE > .name .innerContentContainer, -.linked-xPROJECT.tagged-ACTIVE > .notes .innerContentContainer { + +.tagged-VISUALISATION > .name .innerContentContainer, +.tagged-VISUALISATION > .notes .innerContentContainer { + color: var(--green); +} + +.tagged-VISUALISATION > .name .innerContentContainer { + font-weight: bold; +} + + +.tagged-PROJECT > .name .innerContentContainer { + font-weight: bold; +} +.tagged-PROJECT.tagged-ACTIVE > .name .innerContentContainer, +.tagged-PROJECT.tagged-ACTIVE > .notes .innerContentContainer { color: var(--magenta); } -.linked-xPROJECT.tagged-PLANT > .name .innerContentContainer, -.linked-xPROJECT.tagged-PLANT > .notes .innerContentContainer { +.tagged-PROJECT.tagged-PLANT > .name .innerContentContainer, +.tagged-PROJECT.tagged-PLANT > .notes .innerContentContainer { color: var(--orange); } -.linked-xPROJECT.tagged-STALLED > .name .innerContentContainer, -.linked-xPROJECT.tagged-STALLED > .notes .innerContentContainer { +.tagged-PROJECT.tagged-STALLED > .name .innerContentContainer, +.tagged-PROJECT.tagged-STALLED > .notes .innerContentContainer { color: var(--cyan); } -.linked-xPROJECT.tagged-SOMEDAY > .name .innerContentContainer, -.linked-xPROJECT.tagged-SOMEDAY > .notes .innerContentContainer { +.tagged-PROJECT.tagged-SOMEDAY > .name .innerContentContainer, +.tagged-PROJECT.tagged-SOMEDAY > .notes .innerContentContainer { color: var(--violet); } -.linked-xHABIT > .name .innerContentContainer, -.linked-xHABIT > .notes .innerContentContainer { +.tagged-HABIT > .name .innerContentContainer, +.tagged-HABIT > .notes .innerContentContainer { color: var(--orange); } -.linked-xTASK.tagged-READY > .name .innerContentContainer, -.linked-xTASK.tagged-READY > .notes .innerContentContainer { +.tagged-TASK.tagged-READY > .name .innerContentContainer, +.tagged-TASK.tagged-READY > .notes .innerContentContainer { color: var(--blue); } -.linked-xTASK.tagged-DAILY > .name .innerContentContainer, -.linked-xTASK.tagged-DAILY > .notes .innerContentContainer, -.linked-xTASK.tagged-WEEKLY > .name .innerContentContainer, -.linked-xTASK.tagged-WEEKLY > .notes .innerContentContainer, -.linked-xTASK.tagged-MONTHLY > .name .innerContentContainer, -.linked-xTASK.tagged-MONTHLY > .notes .innerContentContainer, -.linked-xTASK.tagged-IRREGULAR > .name .innerContentContainer, -.linked-xTASK.tagged-IRREGULAR > .notes .innerContentContainer { +.tagged-TASK.tagged-DAILY > .name .innerContentContainer, +.tagged-TASK.tagged-DAILY > .notes .innerContentContainer, +.tagged-TASK.tagged-WEEKLY > .name .innerContentContainer, +.tagged-TASK.tagged-WEEKLY > .notes .innerContentContainer, +.tagged-TASK.tagged-MONTHLY > .name .innerContentContainer, +.tagged-TASK.tagged-MONTHLY > .notes .innerContentContainer, +.tagged-TASK.tagged-IRREGULAR > .name .innerContentContainer, +.tagged-TASK.tagged-IRREGULAR > .notes .innerContentContainer { color: var(--green); } -.linked-xTASK.tagged-WAITING > .name .innerContentContainer, -.linked-xTASK.tagged-WAITING > .notes .innerContentContainer { +.tagged-TASK.tagged-WAITING > .name .innerContentContainer, +.tagged-TASK.tagged-WAITING > .notes .innerContentContainer { color: var(--cyan); } -.linked-xTASK.tagged-BLOCKED > .name .innerContentContainer, -.linked-xTASK.tagged-BLOCKED > .notes .innerContentContainer { +.tagged-TASK.tagged-BLOCKED > .name .innerContentContainer, +.tagged-TASK.tagged-BLOCKED > .notes .innerContentContainer { color: var(--red); } -.linked-xTASK.tagged-MAYBE > .name .innerContentContainer, -.linked-xTASK.tagged-MAYBE > .notes .innerContentContainer { +.tagged-TASK.tagged-MAYBE > .name .innerContentContainer, +.tagged-TASK.tagged-MAYBE > .notes .innerContentContainer { color: var(--violet); } @@ -202,25 +216,25 @@ body::-webkit-scrollbar { color: var(--yellow) !important; } -.linked > .name .time > .content-wrapper { +.name .time > .content-wrapper { color: var(--grey) !important; } -.linked > .name .time-today > .content-wrapper { +.name .time-today > .content-wrapper { color: var(--yellow) !important; } -.project:not(.linked) > .notes .time-today > .content-wrapper { +.notes .time-today > .content-wrapper { background-color: var(--white) !important; color: var(--black); } -.linked > .name .time-tomorrow > .content-wrapper { +.name .time-tomorrow > .content-wrapper { color: var(--violet) !important; } -.linked > .name .time-late > .content-wrapper, -.linked > .name .time-yesterday > .content-wrapper { +.name .time-late > .content-wrapper, +.name .time-yesterday > .content-wrapper { color: var(--red) !important; } @@ -228,8 +242,8 @@ body::-webkit-scrollbar { display: none !important; } -.project.collapsed:not(.linked) > .name, -.project.open:not(.linked) > .name, +.project.collapsed > .name, +.project.open > .name, .root > .name { color: var(--white) !important; } @@ -286,10 +300,17 @@ body::-webkit-scrollbar { color: var(--black) !important; } +.tagged-meeting > .name > .content > .innerContentContainer, +.tagged-meeting > .name > .content > .innerContentContainer > .contentTag { + background-color: var(--magenta) !important; + color: var(--black) !important; +} + .tagged-work > .name > .content > .innerContentContainer { - color: var(--magenta) !important; + color: var(--red) !important; } + .tagged-plan > .name > .content > .innerContentContainer { color: var(--green) !important; } @@ -318,3 +339,8 @@ body::-webkit-scrollbar { color: var(--violet) !important; } +.timed-late > .name, +.timed-late > .notes, +.timed-late > .children > .project:not(.timed) { + opacity: .5 !important; +} diff --git a/workflowy-helper/~~style.css b/workflowy-helper/~~style.css new file mode 100644 index 0000000..3e9db7f --- /dev/null +++ b/workflowy-helper/~~style.css @@ -0,0 +1,346 @@ +:root { + --grey: rgb(158, 161, 162); + --white: rgb(255, 255, 255); + --dark-grey: rgb(92, 96, 98); + --black: rgb(42, 49, 53); + --highlight: rgb(47, 55, 60); + --yellow: rgb(227, 160, 8); + --orange: rgb(255, 138, 76); + --red: #F74E5D; /* rgb(249, 128, 128); */ + --magenta: rgb(244, 114, 182); + --violet: rgb(172, 148, 250); + --blue: rgb(56, 189, 248); + --cyan: rgb(45, 212, 191); + --green: rgb(49, 196, 141); +} + +body { + --wf-tag-text-gray: var(--white) !important; + --wf-tag-background-gray: var(--white) !important; + --wf-tag-text-red: var(--red) !important; + --wf-tag-background-red: var(--red) !important; + --wf-tag-text-orange: var(--orange) !important; + --wf-tag-background-orange: var(--orange) !important; + --wf-tag-text-yellow: var(--yellow) !important; + --wf-tag-background-yellow: var(--yellow) !important; + --wf-tag-text-green: var(--green) !important; + --wf-tag-background-green: var(--green) !important; + --wf-tag-text-blue: var(--dark-grey) !important; + --wf-tag-background-blue: var(--dark-grey) !important; + --wf-tag-text-purple: var(--violet) !important; + --wf-tag-background-purple: var(--violet) !important; + --wf-tag-text-teal: var(--cyan) !important; + --wf-tag-background-teal: var(--cyan) !important; + --wf-tag-text-sky: var(--blue) !important; + --wf-tag-background-sky: var(--blue) !important; + --wf-tag-text-pink: var(--magenta) !important; + --wf-tag-background-pink: var(--magenta) !important; + --wf-tag-text: var(--black) !important; + --wf-color-bullet: var(--white) !important; + color: var(--grey) !important; +} + +/* .root:not(.board) > .children, */ +/* .root:not(.board) > .name { */ +/* /1* max-width: 800px; *1/ */ +/* } */ + +body::-webkit-scrollbar { + display: none; +} + +.pageContainer { + max-width: 100vw !important; + overflow-x: hidden; +} +.page { + margin-right: 0 !important; + margin-left: 0 !important; +} + +.mainTreeRoot > .name { + height: 0 !important; +} + +.name > .content > .innerContentContainer { + overflow: hidden; + text-overflow: ellipsis; +} + +.link, +.contentTag { + color: var(--dark-grey) !important; + font-weight: normal !important; +} + +.homeButton > svg { + display: none; +} +.homeButton::after { + content: "✞"; + font-size: 2em; +} + +.header > :first-child { + display: none !important; +} + + +.metaMatches * .innerContentContainer, +.contentMatch { + background: none !important; +} + +.project > .text-sm, +.paragraph { + margin: 0 !important; +} +.project .breadcrumbs { + position: absolute; + z-index: 20; + left: 25px; + top: -3px; +} +.project .breadcrumbs > a, +.project .breadcrumbs > svg, +.project .breadcrumbs > .menu { + display: none; +} +.project * .breadcrumbs > a:last-child { + font-size: 0; + display: initial !important; +} +.project * .breadcrumbs > a:last-child::after { + font-size: 12px; + content: "→"; +} + +.linked-xGOAL > .name .innerContentContainer, +.linked-xGOAL > .notes .innerContentContainer { + color: var(--yellow); +} + +.linked-xGOAL > .name .innerContentContainer { + font-weight: bold; +} + +.linked-xRESPONSIBILITY > .name .innerContentContainer, +.linked-xRESPONSIBILITY > .notes .innerContentContainer { + color: var(--red); +} + +.linked-xRESPONSIBILITY > .name .innerContentContainer { + font-weight: bold; +} + +.linked-xVISUALISATION > .name .innerContentContainer, +.linked-xVISUALISATION > .notes .innerContentContainer { + color: var(--green); +} + +.linked-xVISUALISATION > .name .innerContentContainer { + font-weight: bold; +} + + +.linked-xPROJECT > .name .innerContentContainer { + font-weight: bold; +} +.linked-xPROJECT.tagged-ACTIVE > .name .innerContentContainer, +.linked-xPROJECT.tagged-ACTIVE > .notes .innerContentContainer { + color: var(--magenta); +} +.linked-xPROJECT.tagged-PLANT > .name .innerContentContainer, +.linked-xPROJECT.tagged-PLANT > .notes .innerContentContainer { + color: var(--orange); +} +.linked-xPROJECT.tagged-STALLED > .name .innerContentContainer, +.linked-xPROJECT.tagged-STALLED > .notes .innerContentContainer { + color: var(--cyan); +} +.linked-xPROJECT.tagged-SOMEDAY > .name .innerContentContainer, +.linked-xPROJECT.tagged-SOMEDAY > .notes .innerContentContainer { + color: var(--violet); +} + +.linked-xHABIT > .name .innerContentContainer, +.linked-xHABIT > .notes .innerContentContainer { + color: var(--orange); +} + +.linked-xTASK.tagged-READY > .name .innerContentContainer, +.linked-xTASK.tagged-READY > .notes .innerContentContainer { + color: var(--blue); +} +.linked-xTASK.tagged-DAILY > .name .innerContentContainer, +.linked-xTASK.tagged-DAILY > .notes .innerContentContainer, +.linked-xTASK.tagged-WEEKLY > .name .innerContentContainer, +.linked-xTASK.tagged-WEEKLY > .notes .innerContentContainer, +.linked-xTASK.tagged-MONTHLY > .name .innerContentContainer, +.linked-xTASK.tagged-MONTHLY > .notes .innerContentContainer, +.linked-xTASK.tagged-IRREGULAR > .name .innerContentContainer, +.linked-xTASK.tagged-IRREGULAR > .notes .innerContentContainer { + color: var(--green); +} +.linked-xTASK.tagged-WAITING > .name .innerContentContainer, +.linked-xTASK.tagged-WAITING > .notes .innerContentContainer { + color: var(--cyan); +} +.linked-xTASK.tagged-BLOCKED > .name .innerContentContainer, +.linked-xTASK.tagged-BLOCKED > .notes .innerContentContainer { + color: var(--red); +} +.linked-xTASK.tagged-MAYBE > .name .innerContentContainer, +.linked-xTASK.tagged-MAYBE > .notes .innerContentContainer { + color: var(--violet); +} + +.tag-DAILY { + color: var(--blue) !important; +} +.tag-WEEKLY { + color: var(--green) !important; +} +.tag-MONTHLY { + color: var(--green) !important; +} +.tag-IRREGULAR { + color: var(--green) !important; +} + +.tag-WORK { + color: var(--red) !important; +} + +.tag-RELAX { + color: var(--yellow) !important; +} + +.linked > .name .time > .content-wrapper { + color: var(--grey) !important; +} + +.linked > .name .time-today > .content-wrapper { + color: var(--yellow) !important; +} + +.project:not(.linked) > .notes .time-today > .content-wrapper { + background-color: var(--white) !important; + color: var(--black); +} + +.linked > .name .time-tomorrow > .content-wrapper { + color: var(--violet) !important; +} + +.linked > .name .time-late > .content-wrapper, +.linked > .name .time-yesterday > .content-wrapper { + color: var(--red) !important; +} + +.matching-node { + display: none !important; +} + +.project.collapsed:not(.linked) > .name, +.project.open:not(.linked) > .name, +.root > .name { + color: var(--white) !important; +} + +.tagged-done > .name > .content, +.tagged-done > .notes > .content, +.tagged-done > .name time > span, +.tagged-missed > .name > .content, +.tagged-missed > .notes > .content, +.tagged-missed > .name time > span, +.tagged-na > .name > .content, +.tagged-na > .notes > .content, +.tagged-na > .name time > span { + /* opacity: 0.5 !important; */ + /* text-decoration: none !important; */ + text-decoration: line-through !important; + text-decoration-thickness: 2px !important; +} + +.tagged-done > .name > .content, +.tagged-done > .name time > span { + text-decoration-color: var(--green) !important; +} + +.tagged-missed > .name > .content, +.tagged-missed > .name time > span { + text-decoration-color: var(--red) !important; +} + +.tagged-na > .name > .content, +.tagged-na > .name time > span { + text-decoration-color: var(--blue) !important; +} + +.tag-new { + color: var(--blue) !important; +} + +.tagged-event > .name > .content > .innerContentContainer, +.tagged-event > .name > .content > .innerContentContainer > .contentTag { + background-color: var(--red) !important; + color: var(--black) !important; +} + +.tagged-reminder > .name > .content > .innerContentContainer, +.tagged-reminder > .name > .content > .innerContentContainer > .contentTag { + background-color: var(--blue) !important; + color: var(--black) !important; +} + +.tagged-gym > .name > .content > .innerContentContainer, +.tagged-gym > .name > .content > .innerContentContainer > .contentTag { + background-color: var(--yellow) !important; + color: var(--black) !important; +} + +.tagged-meeting > .name > .content > .innerContentContainer, +.tagged-meeting > .name > .content > .innerContentContainer > .contentTag { + background-color: var(--magenta) !important; + color: var(--black) !important; +} + +.tagged-work > .name > .content > .innerContentContainer { + color: var(--red) !important; +} + + +.tagged-plan > .name > .content > .innerContentContainer { + color: var(--green) !important; +} + +.half-open.tagged-a > .name > .bullet, +.collapsed.tagged-a > .name > .bullet, +.tagged-a > .name > .bullet { + color: var(--red) !important; +} + +.half-open.tagged-b > .name > .bullet, +.collapsed.tagged-b > .name > .bullet, +.tagged-b > .name > .bullet { + color: var(--blue) !important; +} + +.half-open.tagged-c > .name > .bullet, +.collapsed.tagged-c > .name > .bullet, +.tagged-c > .name > .bullet { + color: var(--green) !important; +} + +.half-open.tagged-d > .name > .bullet, +.collapsed.tagged-d > .name > .bullet, +.tagged-d > .name > .bullet { + color: var(--violet) !important; +} + +.timed-late:not(.linked) > .name, +.timed-late:not(.linked) > .notes, +.timed-late:not(.linked) > .children > .project:not(.timed) { + opacity: .5 !important; +}