glax/Tranga-Website
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Move MonitorList Entry Buttons to correct stylefile,

Browse Source 
replace buttons with clickable divs
This commit is contained in:
glax 2024-10-20 02:33:04 +02:00
parent eef819d140
commit 5cb638d9c1
3 changed files with 31 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
Website/modules/MonitorJobsList.tsx
View File

@ -45,7 +45,7 @@ export default function MonitorJobsList({onStartSearch, onJobsChanged} : {onStar
function StartSearchMangaEntry() : ReactElement { function StartSearchMangaEntry() : ReactElement {
return (<div key="monitorMangaEntry.StartSearch" className="monitorMangaEntry" onClick={onStartSearch}> return (<div key="monitorMangaEntry.StartSearch" className="monitorMangaEntry" onClick={onStartSearch}>
<div className="Manga" key="StartSearch.Manga"> <div className="Manga" key="StartSearch.Manga">
<img src="../media/blahaj.png"></img> <img src="../media/blahaj.png" alt="Blahaj"></img>
<div> <div>
<p style={{textAlign: "center", width: "100%"}} className="Manga-name">Add new Manga</p> <p style={{textAlign: "center", width: "100%"}} className="Manga-name">Add new Manga</p>
<p style={{fontSize: "42pt", textAlign: "center"}}>+</p> <p style={{fontSize: "42pt", textAlign: "center"}}>+</p>
@ -76,8 +76,8 @@ export default function MonitorJobsList({onStartSearch, onJobsChanged} : {onStar
return <div key={"monitorMangaEntry-" + manga.internalId} className="monitorMangaEntry"> return <div key={"monitorMangaEntry-" + manga.internalId} className="monitorMangaEntry">
{CoverCard(manga)} {CoverCard(manga)}
<div className="MangaActionButtons"> <div className="MangaActionButtons">
<button id={"Delete-"+job.id} className="DeleteJobButton" onClick={DeleteJob}><Icon path={mdiTrashCanOutline} size={1.5} /></button> <div id={"Delete-"+job.id} className="DeleteJobButton" onClick={DeleteJob}><Icon path={mdiTrashCanOutline} size={1.5} /></div>
<button id={"Start-"+job.id} className="StartJobNowButton" onClick={StartJob}><Icon path={mdiPlayBoxOutline} size={1.5} /></button> <div id={"Start-"+job.id} className="StartJobNowButton" onClick={StartJob}><Icon path={mdiPlayBoxOutline} size={1.5} /></div>
</div> </div>
</div>; </div>;
})} })}

27
Website/styles/MangaSearchResult.css
View File

@ -115,31 +115,4 @@
.monitorMangaEntry { .monitorMangaEntry {
position: relative; position: relative;
}
.MangaActionButtons {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.MangaActionButtons > button {
position: absolute;
margin: 10px;
border: 0;
background: none;
}
.DeleteJobButton {
bottom: 0;
left: 0;
filter: invert(21%) sepia(63%) saturate(7443%) hue-rotate(355deg) brightness(93%) contrast(118%);
}
.StartJobNowButton {
bottom: 0;
right: 0;
filter: invert(58%) sepia(16%) saturate(4393%) hue-rotate(103deg) brightness(102%) contrast(103%);
} }

28
Website/styles/monitorMangaList.css
View File

@ -8,4 +8,32 @@
overflow-y: scroll; overflow-y: scroll;
scrollbar-color: var(--accent-color) var(--primary-color); scrollbar-color: var(--accent-color) var(--primary-color);
scrollbar-width: thin; scrollbar-width: thin;
}
.MangaActionButtons {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.MangaActionButtons > div {
position: absolute;
margin: 10px;
border: 0;
background: none;
cursor: pointer;
}
.DeleteJobButton {
bottom: 0;
left: 0;
filter: invert(21%) sepia(63%) saturate(7443%) hue-rotate(355deg) brightness(93%) contrast(118%);
}
.StartJobNowButton {
bottom: 0;
right: 0;
filter: invert(58%) sepia(16%) saturate(4393%) hue-rotate(103deg) brightness(102%) contrast(103%);
} }