rythondev/multi-task-widget-cross-platform
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

version 3.111

Browse source
This commit is contained in:
liyunze 2024-10-13 22:35:42 +11:00
parent 16899adee3
commit 1761913dbb
6 changed files with 233 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.gitignore vendored
View file

@ -1,5 +1,3 @@
.vscode/*
styles/taskList.css.map
styles/taskList.scss
to-do.md
updates

2
configs.js
View file

@ -11,7 +11,7 @@ const configs = (function () {
taskSeparator: [";", ","], // array of strings
openQuote: '"', // string
closeQuote: '"', // string
testTasks: false, // true or false
testTasks: true, // true or false
headerGoogleFont: true, // true: use google font, false: use system font
taskGoogleFont: true, // true: use google font, false: use system font
displayTaskCount: true, // true or false

3
scripts/taskList.js
View file

@ -2698,11 +2698,12 @@ function cancelAnimation() {
DBHandler.open()
.then(async () => {
await setupDB();
importStyles();
if (getSetting("testTasks")) {
await resetDB();
await tests();
}
importStyles();
await renderTaskListToDOM();
})
.catch((error) => {

6
styles/taskList.css
View file

@ -78,7 +78,11 @@
#main-container .header .task-count {
margin-right: var(--task-count-margin-right);
}
#main-container .task-wrapper, #main-container .task-container {
transition: height 0.5s ease-out;
}
#main-container .task-wrapper {
animation: scrollTasks 20s linear infinite;
width: 100%;
height: 100%;
overflow: hidden;
@ -102,6 +106,7 @@
margin-left: auto;
margin-right: auto;
margin-top: var(--body-margin-top);
transition: transform 0.4s ease-in-out;
}
#main-container .task-wrapper .task-container .task {
padding: var(--task-vertical-padding) var(--task-horizontal-padding);
@ -128,6 +133,7 @@
}
#main-container .task-wrapper .task-container .task .user-tasks .todo .content {
display: -webkit-box;
line-clamp: var(--number-of-lines);
-webkit-line-clamp: var(--number-of-lines);
-webkit-box-orient: vertical;
overflow: hidden;

1
styles/taskList.css.map Normal file
View file

@ -0,0 +1 @@
{"version":3,"sources":["taskList.scss","taskList.css"],"names":[],"mappings":"AAAA;EACC,uBAAA;EACA,yBAAA;EAEA,gDAAA;EAEA,6BAAA;EACA,+BAAA;EACA,8BAAA;EAEA,mCAAA;EACA,iCAAA;EAEA,iCAAA;EACA,+BAAA;EAEA,6CAAA;EAEA,0BAAA;EACA,4BAAA;EACA,2BAAA;EAEA,wBAAA;EACA,gCAAA;EACA,0BAAA;EACA,0BAAA;EAEA,8BAAA;EAEA,2CAAA;EAEA,wBAAA;EACA,0BAAA;EACA,yBAAA;EAEA,sBAAA;EAEA,oBAAA;EACA,kBAAA;EACA,4BAAA;EAEA,2CAAA;EAEA,8BAAA;EACA,sBAAA;EACA,wBAAA;EAEA,0BAAA;EACA,wBAAA;EACA,yBAAA;EAEA,8BAAA;EACA,4BAAA;EAEA,yBAAA;EACA,8BAAA;EACA,4BAAA;AChBD;;ADmBA;EACC,SAAA;EACA,UAAA;EACA,sBAAA;AChBD;;ADoBA;EACC,WAAA;EACA,aAAA;EAEA,aAAA;EACA,sBAAA;EAEA,8EAAA;EAGA,mDAAA;EAEA,yEAAA;EACA,6CAAA;EAEA,oCAAA;ACvBD;ADyBC;EACC,aAAA;EACA,8BAAA;EAEA,wEAAA;EAEA,mEAAA;EACA,0CAAA;EAEA,+BAAA;EACA,0CAAA;EAEA,sCAAA;EACA,kCAAA;EACA,sCAAA;AC3BF;AD6BE;EACC,6BAAA;AC3BH;AD6BE;EACC,UAAA;AC3BH;AD8BE;EACC,4CAAA;AC5BH;ADgCC;EACC,gCAAA;AC9BF;ADiCC;EACC,0CAAA;EAEA,WAAA;EACA,YAAA;EAEA,gBAAA;EAEA,kBAAA;EAEA,wCAAA;EAEA,6BAAA;EACA,oCAAA;EACA,gCAAA;EAEA,+BAAA;EAEA,+DAAA;EACA,wCAAA;EAEA,UAAA;ACvCF;ADyCE;EACC,kBAAA;EACA,cAAA;EAEA,OAAA;EAEA,aAAA;EACA,sBAAA;EAEA,mBAAA;EAEA,iBAAA;EACA,kBAAA;EAEA,kCAAA;EAEA,sCAAA;AC7CH;ADgDG;EACC,oEAAA;EAEA,wCAAA;EAEA,wCAAA;EAEA,wBAAA;EAEA,+DAAA;EACA,wCAAA;AClDJ;ADoDI;EACC,wCAAA;EACA,oCAAA;AClDL;ADqDI;EACC,mBAAA;ACnDL;ADqDK;EACC,aAAA;ACnDN;ADqDM;EACC,uBAAA;EACA,iCAAA;EACA,iBAAA;ACnDP;ADsDM;EACC,oBAAA;EACA,kCAAA;EACA,0CAAA;EACA,4BAAA;EACA,gBAAA;ACpDP;ADwDK;EACC,kCAAA;ACtDN;ADwDM;EACC,6BAAA;EACA,kCAAA;ACtDP;AD2DK;EACC,8CAAA;EACA,mCAAA;EAEA,gFAAA;EAGA,8CAAA;EAEA,uBAAA;EAAA,kBAAA;EAEA,4DAAA;AC9DN","file":"taskList.css"}

223
styles/taskList.scss Normal file
View file

@ -0,0 +1,223 @@
:root {
--task-list-width: 100%;
--task-list-height: 100vh;
--task-list-background-color: rgba(0, 0, 0, 0.8);
--task-list-border-width: 2px;
--task-list-border-color: white;
--task-list-border-radius: 5px;
--task-list-horizontal-padding: 0px;
--task-list-vertical-padding: 0px;
--header-horizontal-padding: 10px;
--header-vertical-padding: 10px;
--header-background-color: rgba(0, 0, 0, 0.8);
--header-border-width: 2px;
--header-border-color: white;
--header-border-radius: 5px;
--header-font-size: 20px;
--header-font-family: sans-serif;
--header-font-color: white;
--header-font-weight: bold;
--task-count-margin-right: 0px;
--body-background-color: rgba(0, 0, 0, 0.7);
--body-border-width: 5px;
--body-border-color: white;
--body-border-radius: 5px;
--body-margin-top: 0px;
--number-of-lines: 1;
--line-height: 1.5;
--username-font-weight: bold;
--task-background-color: rgba(0, 0, 0, 0.7);
--task-font-family: sans-serif;
--task-font-size: 25px;
--task-font-color: white;
--task-border-color: black;
--task-border-width: 0px;
--task-border-radius: 5px;
--task-horizontal-padding: 0px;
--task-vertical-padding: 0px;
--task-margin-bottom: 5px;
--task-horizontal-padding: 5px;
--task-vertical-padding: 5px;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
#main-container {
width: 100%;
height: 100vh;
display: flex;
flex-direction: column;
padding: var(--task-list-vertical-padding)
var(--task-list-horizontal-padding);
background-color: var(--task-list-background-color);
border: solid var(--task-list-border-width) var(--task-list-border-color);
border-radius: var(--task-list-border-radius);
transition: opacity 0.5s ease-in-out;
.header {
display: flex;
justify-content: space-between;
padding: var(--header-vertical-padding) var(--header-horizontal-padding);
border: solid var(--header-border-width) var(--header-border-color);
border-radius: var(--header-border-radius);
color: var(--header-font-color);
background: var(--header-background-color);
font-family: var(--header-font-family);
font-size: var(--header-font-size);
font-weight: var(--header-font-weight);
.title {
transition: opacity 0.5s ease;
}
.fade {
opacity: 0;
}
.task-count {
margin-right: var(--task-count-margin-right);
}
}
.task-wrapper, .task-container {
transition: height 0.5s ease-out;
}
.task-wrapper {
animation: scrollTasks 20s linear infinite;
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
background: var(--body-background-color);
color: var(--task-font-color);
font-family: var(--task-font-family);
font-size: var(--task-font-size);
line-height: var(--line-height);
border: var(--body-border-width) solid var(--body-border-color);
border-radius: var(--body-border-radius);
z-index: 1;
.task-container {
position: absolute;
width: inherit;
left: 0;
display: flex;
flex-direction: column;
align-items: center;
margin-left: auto;
margin-right: auto;
margin-top: var(--body-margin-top);
transition: transform 0.4s ease-in-out;
.task {
padding: var(--task-vertical-padding)
var(--task-horizontal-padding);
background: var(--task-background-color);
margin-bottom: var(--task-margin-bottom);
width: var(--task-width);
border: solid var(--task-border-width) var(--task-border-color);
border-radius: var(--task-border-radius);
.username {
font-weight: var(--username-font-weight);
font-size: var(--username-font-size);
}
.user-tasks {
counter-reset: item;
.todo {
display: flex;
&:before {
counter-increment: item;
content: counters(item, ".") ". ";
margin-right: 5px;
}
.content {
display: -webkit-box;
line-clamp: var(--number-of-lines);
-webkit-line-clamp: var(--number-of-lines); // change this to the number of lines you want
-webkit-box-orient: vertical;
overflow: hidden;
}
}
.done {
color: var(--done-task-font-color);
.content {
text-decoration: line-through;
color: var(--done-task-font-color);
}
}
.focus {
background: var(--focus-task-background-color);
color: var(--focus-task-font-color);
padding: var(--focus-task-vertical-padding)
var(--focus-task-horizontal-padding);
border-radius: var(--focus-task-border-radius);
width:fit-content;
margin-left: calc(var(--focus-task-horizontal-padding) * -1);
}
}
}
}
}
}