Skip to content

Commit

Permalink
frsfew
Browse files Browse the repository at this point in the history
  • Loading branch information
M1dnight-ofcl committed Nov 13, 2024
1 parent 46444e5 commit 9643bd4
Show file tree
Hide file tree
Showing 17 changed files with 205 additions and 59 deletions.
Binary file modified .yarn/install-state.gz
Binary file not shown.
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@
"react-redux": "^9.1.2",
"react-toastify": "^10.0.6",
"redux": "^5.0.1",
"redux-persist": "^6.0.0",
"vite": "^5.4.8"
},
"packageManager": "yarn@4.5.0"
Expand Down
Binary file added public/logo.ico
Binary file not shown.
4 changes: 4 additions & 0 deletions src/App/App.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -121,6 +121,10 @@ const App=(prop)=>{
}
const HomeTab=({})=>{
return(<>
<Helmet>
<title>Todura V2</title>
<link rel="icon" type="image/x-icon" href="/logo.ico"/>
</Helmet>
<ContextMenu/>
<LoadingScreen/>
<div id="taskWrapper" onScroll={(e)=>{
Expand Down
124 changes: 86 additions & 38 deletions src/App/modules/Settings.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -53,39 +53,54 @@ export const SettingsTab=({})=>{
<div id="settingsWrapper">
<div id="settingsSidebar">
<h1>Settings</h1>
<button
<motion.button
id="settingsSidebar_general"
transition={{ delay:0,duration:.05 }}
initial={{x:-5,opacity:0,}}
animate={{x:0,opacity:1,}}
onClick={(e)=>{
e.preventDefault();
scrollToHeader("settingsheader_general");
}}><FontAwesomeIcon className='i' icon={faHouse}/> General</button>
<button
}}><FontAwesomeIcon className='i' icon={faHouse}/> General</motion.button>
<motion.button
id="settingsSidebar_appearance"
transition={{ delay:.15,duration:.05 }}
initial={{x:-5,opacity:0,}}
animate={{x:0,opacity:1,}}
onClick={(e)=>{
e.preventDefault();
scrollToHeader("settingsheader_appearance");
}}><FontAwesomeIcon className='i' icon={faPaintBrush}/> Appearance</button>
}}><FontAwesomeIcon className='i' icon={faPaintBrush}/> Appearance</motion.button>
{settings.advanced_settings?<>
<button
<motion.button
id="settingsSidebar_advancedsettings"
transition={{ delay:.25,duration:.05 }}
initial={{x:-5,opacity:0,}}
animate={{x:0,opacity:1,}}
onClick={(e)=>{
e.preventDefault();
scrollToHeader("settingsheader_advancedsettings");
}}><FontAwesomeIcon className='i' icon={faScrewdriverWrench}/> Advanced</button>
}}><FontAwesomeIcon className='i' icon={faScrewdriverWrench}/> Advanced</motion.button>
</>:null}
{window.toduraApi?toduraApi.desktop?<button
{/* {window.toduraApi?toduraApi.desktop? */}<motion.button
id="settingsSidebar_backup"
transition={{ delay:.35,duration:.05 }}
initial={{x:-5,opacity:0,}}
animate={{x:0,opacity:1,}}
onClick={(e)=>{
e.preventDefault();
scrollToHeader("settingsheader_backup");
}}><FontAwesomeIcon className='i' icon={faClockRotateLeft}/> Backup</button>
:null:null}
<button
}}><FontAwesomeIcon className='i' icon={faClockRotateLeft}/> Backup</motion.button>
{/* :null:null} */}
<motion.button
id="settingsSidebar_info"
transition={{ delay:.5,duration:.05 }}
initial={{x:-5,opacity:0,scale:.985,}}
animate={{x:0,opacity:1,scale:1,}}
onClick={(e)=>{
e.preventDefault();
scrollToHeader("settingsheader_info");
}}><FontAwesomeIcon className='i' icon={faInfoCircle}/> Info</button>
}}><FontAwesomeIcon className='i' icon={faInfoCircle}/> Info</motion.button>
</div>
<div id="settingsContent" onScroll={(e)=>{
document.getElementById("taskScrollShadeTop").style.opacity=
Expand Down Expand Up @@ -161,36 +176,45 @@ export const SettingsTab=({})=>{
Nothing yet... (tried custom css vars but OH. MY. GOD. (I hate js sometimes))
</p> */}
<motion.div
transition={{ delay:.1,duration:.15 }}
initial={{
opacity:0,
y:-5,}}
whileInView={{
opacity:1,
y:0,}}
className="experimental_settingswrapper">
<h3>Custom Theme Variables</h3>
transition={{ delay:.1,duration:.15 }}
initial={{
opacity:0,
y:-5,}}
whileInView={{
opacity:1,
y:0,}}
className="experimental_settingswrapper">
<h3>Custom Theme Variables</h3>
{Object.keys(settings.customCssVar)
.map((cssvar,index)=>
settings.customCssVar[cssvar].type=="color"?
<React.Fragment key={generateId(10)}>
{/* <form id={`${cssvar}_form`}/> */}
<label className='clrinput' htmlFor={`${cssvar.slice(2)}_tvs`}>{settings.customCssVar[cssvar].title} &nbsp;
<code>{cssvar}
<span className="clrinput_tooltip">This is the css variable in the code. If you want to make a custom theme, these is the variabe you would set</span></code>&nbsp;
<input
type="color"
id={`${cssvar.slice(2)}_tvs`}
defaultValue={GetCssVar(cssvar)}
onBlur={(e)=>{
// document.getElementById(`${cssvar}_form`).submit();
dispatch(setCustomCssVar({
name:cssvar,
new:e.target.value,
}));
}}
/>
</label>
<motion.label
transition={{ delay:.1,duration:.15 }}
initial={{
opacity:0,
y:-5,}}
whileInView={{
opacity:1,
y:0,}}
className='clrinput'
htmlFor={`${cssvar.slice(2)}_tvs`}>{settings.customCssVar[cssvar].title} &nbsp;
<code>{cssvar}
<span className="clrinput_tooltip">This is the css variable in the code. If you want to make a custom theme, these is the variabe you would set</span></code>&nbsp;
<input
type="color"
id={`${cssvar.slice(2)}_tvs`}
defaultValue={GetCssVar(cssvar)}
onBlur={(e)=>{
// document.getElementById(`${cssvar}_form`).submit();
dispatch(setCustomCssVar({
name:cssvar,
new:e.target.value,
}));
}}
/>
</motion.label>
{/* <form/> */}
</React.Fragment>:null)}
</motion.div>
Expand All @@ -204,7 +228,7 @@ export const SettingsTab=({})=>{
opacity:1,
y:0,}}
id="settingsheader_backup">Backup</motion.h2>
{window.toduraApi?toduraApi.desktop?<motion.button
{window.toduraApi?toduraApi.desktop?<><motion.button
transition={{ delay:.1,duration:.15 }}
initial={{
opacity:0,
Expand All @@ -219,7 +243,31 @@ export const SettingsTab=({})=>{
setTimeout(()=>toduraApi.saveToFile(saveObj),200);
toast.update(saveStatusToastId.current,{render:"Saved File to 'Downloads'",autoClose:5000})
}}>Save to File
<span className="tooltip">Just save all your data to a custom <code>.tsf</code> file</span></motion.button>:null:null}
<span className="tooltip">Just save all your data to a custom <code>.tsf</code> file</span></motion.button><br/></>:null:null}

<motion.div
transition={{ delay:.1,duration:.15 }}
initial={{
opacity:0,
y:-5,}}
whileInView={{
opacity:1,
y:0,}}
className="danger_settingswrapper"><br/>
<motion.button
transition={{ delay:.1,duration:.15 }}
initial={{
opacity:0,
y:-5,}}
whileInView={{
opacity:1,
y:0,}}
onClick={(e)=>{
e.preventDefault();
localStorage.clear();
location.reload();
}}>Reset Data</motion.button>
</motion.div>
<br/><motion.h2
transition={{ delay:.1,duration:.15 }}
initial={{
Expand Down
33 changes: 33 additions & 0 deletions src/App/modules/assets/settings.scss
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,39 @@
color: $clr1;
}
}
.danger_settingswrapper {
padding: 2vmin;
// padding-right: 8.5vmin;
width: 100%;
border: 1px solid $clr1;
border-radius: $border-rad;
position: relative;
// &,& *,*,:not(&::after){z-index: 90 !important;}
&::after {
content: "";
height: 100%;
width: 100%;
position: absolute;
border-radius: $border-rad;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: -10 !important;
background-image: linear-gradient(115deg,$clr1,transparent);
opacity: .25;
pointer-events: none;
}
padding-top: 5vmin;
&::before {
content: "Dangerous Settings! These probably do something major or will result in data loss";
position: absolute;
text-wrap: wrap;
top: 2vmin;
left: 2vmin;
font-size: 2vmin;
color: $clr1;
}
}
.caption {
width: 100%;
text-wrap: wrap;
Expand Down
33 changes: 32 additions & 1 deletion src/App/modules/assets/style/settings.css
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,37 @@
font-size: 2vmin;
color: var(--clr1);
}
#settingsWrapper #settingsContent .danger_settingswrapper {
padding: 2vmin;
width: 100%;
border: 1px solid var(--clr1);
border-radius: var(--border-rad);
position: relative;
padding-top: 5vmin;
}
#settingsWrapper #settingsContent .danger_settingswrapper::after {
content: "";
height: 100%;
width: 100%;
position: absolute;
border-radius: var(--border-rad);
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: -10 !important;
background-image: linear-gradient(115deg, var(--clr1), transparent);
opacity: 0.25;
pointer-events: none;
}
#settingsWrapper #settingsContent .danger_settingswrapper::before {
content: "Dangerous Settings! These probably do something major or will result in data loss";
position: absolute;
text-wrap: wrap;
top: 2vmin;
left: 2vmin;
font-size: 2vmin;
color: var(--clr1);
}
#settingsWrapper #settingsContent .caption {
width: 100%;
text-wrap: wrap;
Expand Down Expand Up @@ -187,7 +218,7 @@
border-radius: calc(var(--border-rad) / 4 * 3);
background: transparent;
transition: 0.35s;
color-scheme: var(--color-shceme);
color-scheme: var(--color-scheme);
position: absolute;
left: calc(100% - 4.5vmin - 2vmin);
}
Expand Down
2 changes: 1 addition & 1 deletion src/App/modules/assets/style/settings.css.map

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

8 changes: 4 additions & 4 deletions src/App/style/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
--outline: #45454595;
--outline-active: #6f27e4;
--sbicons: #95959595;
--color-shceme: dark;
--color-scheme: dark;
/*clrs*/
--clr0: #ffffff;
--clr1: #dc3939;
Expand Down Expand Up @@ -108,7 +108,7 @@
--outline: #a0a0a045;
--outline-active: #6f27e4;
--sbicons: #35353545;
--color-shceme: light;
--color-scheme: light;
/*clrs*/
--clr0: #303030;
--clr1: #dc3939;
Expand Down Expand Up @@ -183,7 +183,7 @@
--outline: #45454595;
--outline-active: #6f27e4;
--sbicons: #95959595;
--color-shceme: dark;
--color-scheme: dark;
/*clrs*/
--clr0: #ffffff;
--clr1: #dc3939;
Expand Down Expand Up @@ -937,7 +937,7 @@ body *::-webkit-scrollbar-thumb:hover {
background: var(--ui4);
border-radius: var(--border-rad);
border: var(--outline) solid 1px;
color-scheme: var(--color-shceme);
color-scheme: var(--color-scheme);
outline: none;
}
#content #taskWrapper .task .task_dataWrapper .task_optionsWapper {
Expand Down
2 changes: 1 addition & 1 deletion src/App/themes/style/default_dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
--outline: #45454595;
--outline-active: #6f27e4;
--sbicons: #95959595;
--color-shceme: dark;
--color-scheme: dark;
/*clrs*/
--clr0: #ffffff;
--clr1: #dc3939;
Expand Down
2 changes: 1 addition & 1 deletion src/App/themes/style/default_light.css
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
--outline: #a0a0a045;
--outline-active: #6f27e4;
--sbicons: #35353545;
--color-shceme: light;
--color-scheme: light;
/*clrs*/
--clr0: #303030;
--clr1: #dc3939;
Expand Down
2 changes: 1 addition & 1 deletion src/App/themes/style/sharp_dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
--outline: #45454595;
--outline-active: #6f27e4;
--sbicons: #95959595;
--color-shceme: dark;
--color-scheme: dark;
/*clrs*/
--clr0: #ffffff;
--clr1: #dc3939;
Expand Down
2 changes: 1 addition & 1 deletion src/App/themes/style/sharp_light.css
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
--outline: #a0a0a045;
--outline-active: #6f27e4;
--sbicons: #35353545;
--color-shceme: light;
--color-scheme: light;
/*clrs*/
--clr0: #303030;
--clr1: #dc3939;
Expand Down
Loading

0 comments on commit 9643bd4

Please sign in to comment.