sigonasr2/ngsplanner
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

made small bar big

Browse Source
This commit is contained in:
dudleycu 2021-08-25 23:54:08 +09:00
parent adeb2ff2d6
commit fb4d51697c
2 changed files with 35 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/App.js
View File

@ -209,10 +209,7 @@ function TableEditor(p) {
},[update,p.path,p.BACKENDURL,p.password]) },[update,p.path,p.BACKENDURL,p.password])
return <> return <>
{!loading? {!loading?<> {importAllowed&&<caption><label className="buttonLabel" htmlFor="uploads">Import CSV</label><input onChange={(f)=>{
<div>
<table>
{importAllowed&&<caption><label className="buttonLabel" htmlFor="uploads">Import CSV</label><input onChange={(f)=>{
const reader = new FileReader() const reader = new FileReader()
reader.onload=(ev)=>{ reader.onload=(ev)=>{
var promises=[] var promises=[]
@ -231,6 +228,8 @@ function TableEditor(p) {
} }
reader.readAsText(f.target.files[0]) reader.readAsText(f.target.files[0])
}} style={{opacity:0}} id="uploads" type="file" accept=".txt,.csv"/></caption>} }} style={{opacity:0}} id="uploads" type="file" accept=".txt,.csv"/></caption>}
<div>
<table>
<thead> <thead>
<tr> <tr>
<th className="table-padding"><TrashFill onClick={()=>{SubmitDeletion()}} className="trashButton"/></th> <th className="table-padding"><TrashFill onClick={()=>{SubmitDeletion()}} className="trashButton"/></th>
@ -245,7 +244,7 @@ function TableEditor(p) {
<InputBox lockSubmission={lockSubmission} data={dependencies[col.name]} callback={(value)=>patchValue(value,p,col,dat)} callback2={(f,value)=>{if (f.key==='Enter') {f.currentTarget.blur()} else {return 'Chill'}}} value={String(dat[col.name])}/></td>)}</tr>)} <InputBox lockSubmission={lockSubmission} data={dependencies[col.name]} callback={(value)=>patchValue(value,p,col,dat)} callback2={(f,value)=>{if (f.key==='Enter') {f.currentTarget.blur()} else {return 'Chill'}}} value={String(dat[col.name])}/></td>)}</tr>)}
</tbody> </tbody>
</table> </table>
</div>:<><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/></>} </div></>:<><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/></>}
</> </>
} }
@ -446,7 +445,7 @@ function AdminPanel(p) {
<div className="box boxAdminContent"> <div className="box boxAdminContent">
<div className="boxTitleBar"> <div className="boxTitleBar">
<h1>{nav.page}</h1></div> <h1>{nav.page}</h1></div>
<div className="adminContainer customScrollbar"> <div className="adminContainer adminScrollbar">
<Helmet> <Helmet>
<title>{APP_TITLE+" - Admin Panel: "+nav.page}</title> <title>{APP_TITLE+" - Admin Panel: "+nav.page}</title>
</Helmet> </Helmet>

41
src/style.css
View File

@ -462,7 +462,7 @@ border-bottom: 1px solid rgba(128,128,128,0.5);
"img properties controls controls"; "img properties controls controls";
} }
.itemWrapperActive { .itemWrapperActive {
background: linear-gradient(135deg,#60461b,#b0a34e); background-color: rgba(255,192,0,0.25);
border-bottom: 4px solid #ffd602; border-bottom: 4px solid #ffd602;
} }
.itemImgWrapper { .itemImgWrapper {
@ -608,6 +608,9 @@ li.selected:hover {
background-color: rgba(113,169,189,0.33); background-color: rgba(113,169,189,0.33);
outline: 2px solid rgba(54,255,255,0.66); outline: 2px solid rgba(54,255,255,0.66);
} }
.itemWrapperActive:hover {
outline: 2px solid rgba(54,255,255,0.66);
}
.boxmenu { .boxmenu {
font-size: 12pt; font-size: 12pt;
margin: 0 10px 0 10px; margin: 0 10px 0 10px;
@ -716,13 +719,17 @@ option {
width: 4px; width: 4px;
height: 4px; height: 4px;
} }
.adminScrollbar::-webkit-scrollbar {
width: 16px;
height: 16px;
}
/* Track */ /* Track */
.customScrollbar::-webkit-scrollbar-track { .customScrollbar::-webkit-scrollbar-track,.adminScrollbar::-webkit-scrollbar-track {
background: rgba(128,128,128,0.8); background: rgba(128,128,128,0.8);
} }
/* Handle */ /* Handle */
.customScrollbar::-webkit-scrollbar-thumb { .customScrollbar::-webkit-scrollbar-thumb, .adminScrollbar::-webkit-scrollbar-thumb {
background-color: rgba(245, 245, 245,0.66); background-color: rgba(245, 245, 245,0.66);
} }
.customScrollbar::-webkit-scrollbar-button { .customScrollbar::-webkit-scrollbar-button {
@ -730,7 +737,12 @@ option {
height:4px; height:4px;
width:4px; width:4px;
} }
.customScrollbar::-webkit-scrollbar-corner { adminScrollbar::-webkit-scrollbar-button {
background-color: rgba(162,162,162,0.8);
height:16px;
width:16px;
}
.customScrollbar::-webkit-scrollbar-corner,.adminScrollbar::-webkit-scrollbar-corner {
background-color: transparent; background-color: transparent;
} }
/* Handle on hover /* Handle on hover
@ -1007,16 +1019,16 @@ input#editBoxInput {
background-color:rgba(64,64,96,0.9); background-color:rgba(64,64,96,0.9);
color:rgba(210,210,210,1); color:rgba(210,210,210,1);
} }
button{ button {
cursor: pointer;
padding:0px 3px 0px 3px; padding:0px 3px 0px 3px;
border: 1px black solid; border: 1px black solid;
background-color:gray; background-color: rgba(128,128,128,0.5);
color:white; color:white;
font-family: ngs,sans-serif; font-family: ngs,sans-serif;
font-size: 16px; font-size: 16px;
font-weight: normal; font-weight: normal;
text-align: center; text-align: center;
-webkit-font-smoothing: antialiased;
text-shadow: -1px 1px 0 #000,1px 1px 0 #000,1px -1px 0 #000,-1px -1px 0 #000; text-shadow: -1px 1px 0 #000,1px 1px 0 #000,1px -1px 0 #000,-1px -1px 0 #000;
} }
.table-responsive{ .table-responsive{
@ -1268,9 +1280,16 @@ p.adminNav hr {
margin: 10px 0; margin: 10px 0;
} }
.buttonLabel{ .buttonLabel{
border: 2px solid black; cursor: pointer;
background:white; padding:5px 10px;
color:black;
background-color: rgba(128,128,128,0.5);
color:white;
font-family: ngs,sans-serif;
font-size: 16px;
font-weight: normal;
text-align: center;
text-shadow: -1px 1px 0 #000,1px 1px 0 #000,1px -1px 0 #000,-1px -1px 0 #000;
} }
.react-toggle { .react-toggle {
touch-action: pan-x; touch-action: pan-x;