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

UI Changes

Browse Source
This commit is contained in:
dudleycu 2021-08-20 06:01:18 +00:00
parent 6df1cfde7e
commit f689dfa9a2
4 changed files with 79 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/App.js
View File

@ -382,9 +382,9 @@ function AdminPanel(p) {
{!verified?
<div className="modalOverlay">
<div className="modal">
<div className="box boxModal" style={{textAlign:"center"}}>
<div className="box boxAdmin">
<div className="boxTitleBar"><h1>Admin</h1></div>
<img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/>
<img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/><p></p>
<input type="password" value={password} onChange={(f)=>{setPassword(f.currentTarget.value)}} onKeyDown={(e)=>{
if (e.key==="Enter") {
axios.post(GetBackendURL(p)+"/passwordcheck",{
@ -885,9 +885,9 @@ function App() {
</Helmet>
<div className="modalOverlay">
<div className="modal">
<div className="box boxModal" style={{textAlign:"center"}}>
<div className="boxTitleBar"><h1>Under Construction</h1></div><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/>
{GetData("site_data")[0]?.data??""}
<div className="box boxMisc">
<div className="boxTitleBar"><h1>Under Construction</h1></div><p><img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/>
{GetData("site_data")[0]?.data??""}</p>
</div>
</div>
</div>

18
src/TestPanel.js
View File

@ -511,14 +511,16 @@ AUGMENT
<div className="box">
<div className="boxTitleBar">
<h1>To Do List</h1></div>
<ul className="toDoList">
<li className="half">Grids. Grids everywhere.</li>
<li>Finish "Item Details" for Weapons/Armor</li>
<li className="half">Class Skill Window</li>
<li>PA Select Window</li>
<li>Food/Buffs Menu</li>
<li className="check">Get all the fckn icons</li>
</ul>
<dl className="toDoList">
<dt>UI</dt>
<dd className="half">Grids. Grids everywhere.</dd>
<dd>Finish "Item Details" for Weapons/Armor</dd>
<dd className="half">Class Skill Window</dd>
<dd>PA Select Window</dd>
<dd>Food/Buffs Menu</dd>
<dd className="check">Get all the fckn icons</dd>
<dt>test</dt>
</dl>
</div>

BIN
src/spinner.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.6 KiB

104
src/style.css
View File

@ -3,6 +3,7 @@
margin: 0;
padding: 0;
box-sizing: border-box;
cursor: default;
}
@font-face {
font-family: "ngs";
@ -119,7 +120,13 @@ em {
padding-bottom:10px;
backdrop-filter: blur(10px);
}
.box h3, dt {
font-size: 12pt;
font-weight: normal;
padding: 0 5px;
margin: 5px;
border-bottom: 1px solid rgba(128,128,128,0.5);
}
.box table {
border-spacing: 0;
color: white;
@ -187,12 +194,6 @@ em {
margin-right: 10px;
padding: 13px 13px 7px 13px;
}
.boxTitleBar img {
float: left;
}
.boxTitleBar p:after {
clear: both;
}
.boxTitleBar h1:before {
font-family: "Segoe UI Symbol";
content: ' \25C6';
@ -259,15 +260,9 @@ em {
}
.box p {
padding: 10px 10px 0 10px;
color: white;
}
.box h3 {
font-size: 12pt;
font-weight: normal;
padding: 0 5px;
margin: 5px;
border-bottom: 1px solid rgba(128,128,128,0.5);
}
.equipPalette {
margin: 10px 10px 0 10px;
display: flex;
@ -278,7 +273,7 @@ em {
}
.equipPaletteSlotWrapper {
background-color: rgba(128,128,128,0.50);
cursor:pointer;
cursor:pointer !important;
padding: 10px;
}
.equipPaletteSlotWrapper span {
@ -327,7 +322,7 @@ em {
color: white;
margin: 0 0 5px 10px;
padding: 12px 10px 7px 10px;
cursor: pointer;
cursor:pointer !important;
}
.equipAugs li:hover {
background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66));
@ -531,7 +526,7 @@ li.r4 {
text-align: center;
flex-basis: 27px;
white-space: nowrap;
cursor: pointer;
cursor:pointer !important;
}
.boxmenu img {
vertical-align: middle;
@ -809,7 +804,7 @@ width: 171px;
height: 148px;
left: 0;
top: 0;
cursor: pointer;
cursor:pointer !important;
}
.skillButtons > span:hover {
background-image: url("./icons/skilltree_div_overlay.png");
@ -866,7 +861,7 @@ cursor: pointer;
}
.editBox:hover{
background-color:rgba(0,0,0,0.5);
cursor:pointer;
cursor:pointer !important;
outline: 2px solid #30cdef;
}
.editBoxActive {
@ -874,7 +869,7 @@ cursor: pointer;
width: 100%;
}
.editBoxActive:hover {
cursor:pointer;
cursor:pointer !important;
}
input#editBoxInput {
position: absolute;
@ -882,7 +877,7 @@ input#editBoxInput {
text-align: right;
background-color: #101317;
color: white;
cursor:pointer;
cursor:pointer !important;
font-family: ngs,sans-serif;
font-size: 11pt;
height: 28px;
@ -898,7 +893,7 @@ input#editBoxInput {
}
.editClass:hover{
background-color:rgba(0,0,0,0.5);
cursor:pointer;
cursor:pointer !important;
outline: 2px solid #30cdef;
}
.popup{
@ -988,20 +983,43 @@ button{
100% {opacity:1;margin-bottom:0;}
}
.boxAdmin {
height: 200px;
outline: 1px solid rgba(54,255,255,1);
width: 450px;
animation: fadeIn 0.15s;
width: 580px;
box-shadow: 0 10px 16px 0 rgba(0,0,0,0.5), 0 6px 20px 0 rgba(0,0,0,0.5) !important;
outline: 1px solid rgba(54,255,255,1);
text-align:center;
}
.boxAdmin img {
margin: 20px;
background: linear-gradient(white,#bca9f5);
}
.boxAdmin input {
outline: 1px solid silver;
font-size: 36px;
height: 72px;
background-image: url("spinner.gif");
}
.boxMisc {
animation: fadeIn 0.15s;
max-width: 580px;
margin: 0 auto;
box-shadow: 0 10px 16px 0 rgba(0,0,0,0.5), 0 6px 20px 0 rgba(0,0,0,0.5) !important;
outline: 1px solid rgba(54,255,255,1);
text-align:center;
}
.boxMisc img {
background: linear-gradient(white,#bca9f5);
margin-Top: 10px;
vertical-align: top;
margin-right: 10px;
}
.boxMisc {
margin-top: 10px;
}
.boxMisc p:after {
clear: both;
}
.boxMisc input {
outline: 1px solid silver;
}
.boxModal .boxTitleBar, .boxModalClassSelect .boxTitleBar, .boxMisc .boxTitleBar {
.boxModal .boxTitleBar, .boxModalClassSelect .boxTitleBar, .boxMisc .boxTitleBar, .boxAdmin .boxTitleBar {
background: linear-gradient(45deg, rgba(47,153,193,0.66),rgba(46,94,137,0.66) 30%,rgba(46,94,137,0.66) 70%, rgba(47,153,193,1));
}
.modalItemListContainer {
@ -1016,10 +1034,10 @@ button{
}
.webicon:hover{
color:rgba(200,0,0,1);
cursor:pointer;
cursor:pointer !important;
}
.basichover:hover{
cursor:pointer;
cursor:pointer !important;
}
.modalCloseButton{
float:right;
@ -1027,7 +1045,7 @@ button{
}
.modalCloseButton:hover{
color:rgba(200,0,0,1);
cursor:pointer;
cursor:pointer !important;
}
.failedInput{
border: 1px solid rgba(200,0,0,1);
@ -1054,7 +1072,7 @@ button{
}
.submitbutton:hover{
color:rgba(0,200,0,1);
cursor:pointer;
cursor:pointer !important;
}
/* Admin Panel */
@ -1115,7 +1133,7 @@ p.adminNav hr {
display: inline-block;
position: relative;
cursor: pointer;
cursor:pointer !important;
background-color: transparent;
border: 0;
padding: 0;
@ -1308,10 +1326,13 @@ p.adminNav hr {
.toDoList {
padding: 0 10px;
}
.toDoList li {
padding-top: 10px;
dt {
margin: 10px 0 0 0;
}
.toDoList li:before {
dd, dl {
padding: 10px 0 0 15px;
}
dd:before {
content: "\2610";
padding-right: 10px;
}
@ -1319,7 +1340,10 @@ p.adminNav hr {
content: "\25E7" !important;
}
.check {
opacity: 33%;
opacity: 25%;
}
.check:hover {
opacity: 100%;
}
.check:before {
font-family: "Segoe UI Symbol";