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

Implement boxes.

Browse Source 
Co-authored-by: dudleycu <dudleyc.twitch@gmail.com>
This commit is contained in:
Joshua Sigona 2021-08-05 23:46:34 +09:00
parent 8b8366343f
commit 14346dabad
4 changed files with 279 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/App.js
View File

@ -559,6 +559,8 @@ function AdminPanel(p) {
<Link to={process.env.PUBLIC_URL+"/admin/class"}>Class</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/class"}>Class</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/classdata"}>Class Data</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/classdata"}>Class Data</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/classweaponcompatibility"}>Class-Weapon Compatibility</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/classweaponcompatibility"}>Class-Weapon Compatibility</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/classskills"}>Class Skills</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/classskilldata"}>Class Skill Data</Link><br/>
<hr/> <hr/>
<Link to={process.env.PUBLIC_URL+"/admin/weapons"}>Weapons</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/weapons"}>Weapons</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/weaponexistencedata"}>Weapon Existence Data</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/weaponexistencedata"}>Weapon Existence Data</Link><br/>
@ -576,6 +578,8 @@ function AdminPanel(p) {
<Link to={process.env.PUBLIC_URL+"/admin/skilltypes"}>Skill Types</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/skilltypes"}>Skill Types</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/skilldata"}>Skill Data</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/skilldata"}>Skill Data</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/photonarts"}>Photon Arts</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/photonarts"}>Photon Arts</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/classskills"}>Class Skills</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/classskilldata"}>Class Skill Data</Link><br/>
<hr/> <hr/>
<Link to={process.env.PUBLIC_URL+"/admin/augments"}>Augments</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/augments"}>Augments</Link><br/>
<Link to={process.env.PUBLIC_URL+"/admin/augmenttypes"}>Augment Types</Link><br/> <Link to={process.env.PUBLIC_URL+"/admin/augmenttypes"}>Augment Types</Link><br/>
@ -632,6 +636,12 @@ function AdminPanel(p) {
<Route path={process.env.PUBLIC_URL+"/admin/skilldata"}> <Route path={process.env.PUBLIC_URL+"/admin/skilldata"}>
<TableEditor path="/skill_data"/> <TableEditor path="/skill_data"/>
</Route> </Route>
<Route path={process.env.PUBLIC_URL+"/admin/classskills"}>
<TableEditor path="/class_skill"/>
</Route>
<Route path={process.env.PUBLIC_URL+"/admin/classskilldata"}>
<TableEditor path="/class_skill_data"/>
</Route>
<Route path={process.env.PUBLIC_URL+"/admin/augments"}> <Route path={process.env.PUBLIC_URL+"/admin/augments"}>
<TableEditor path="/augment"/> <TableEditor path="/augment"/>
</Route> </Route>
@ -723,7 +733,7 @@ function DamageCalculator(p) {
const [weaponEnhanceLvl,setWeaponEnhanceLvl] = useState(1) const [weaponEnhanceLvl,setWeaponEnhanceLvl] = useState(1)
useEffect(()=>{ useEffect(()=>{
setWeaponTotalAtk(weaponBaseAtk+weaponEnhanceLvl) setWeaponTotalAtk(Number(weaponBaseAtk)+Number(weaponEnhanceLvl))
},[weaponBaseAtk,weaponEnhanceLvl]) },[weaponBaseAtk,weaponEnhanceLvl])
const [dmgVariance,setDmgVariance] = useState(1) const [dmgVariance,setDmgVariance] = useState(1)
@ -732,7 +742,7 @@ function DamageCalculator(p) {
const [augDmgVariance,setAugDmgVariance] = useState(1) const [augDmgVariance,setAugDmgVariance] = useState(1)
useEffect(()=>{ useEffect(()=>{
setDmgVariance(weaponDmgVariance+augDmgVariance) setDmgVariance(Number(weaponDmgVariance)+Number(augDmgVariance))
},[weaponDmgVariance,augDmgVariance]) },[weaponDmgVariance,augDmgVariance])
const [baseAtk,setBaseAtk] = useState(100) const [baseAtk,setBaseAtk] = useState(100)
@ -740,7 +750,7 @@ function DamageCalculator(p) {
const [multipliers,setMultipliers] = useState(1) const [multipliers,setMultipliers] = useState(1)
useEffect(()=>{ useEffect(()=>{
setRawDmg(((weaponTotalAtk*dmgVariance)+baseAtk-enemyDef)*multipliers/5) setRawDmg(((Number(weaponTotalAtk)*Number(dmgVariance))+Number(baseAtk)-Number(enemyDef))*Number(multipliers)/5)
},[weaponTotalAtk,dmgVariance,baseAtk,enemyDef,multipliers]) },[weaponTotalAtk,dmgVariance,baseAtk,enemyDef,multipliers])
const [atkmult,setAtkMult] = useState(1); const [atkmult,setAtkMult] = useState(1);
@ -766,7 +776,7 @@ function DamageCalculator(p) {
const [highLevelEnemy,setHighLevelEnemy] = useState(1) const [highLevelEnemy,setHighLevelEnemy] = useState(1)
useEffect(()=>{ useEffect(()=>{
setMultipliers(atkmult*partmult*elementalWeaknessMult*mainClassWeaponBoost*classSkillMult*equipMult*augmentEquipMult*potencyFloorEquipMult*elementalWeaponEquipMult*critMult*appropriateDistance*foodBoost*fieldEffects*statusAilments*enemyCorrectionMult*highLevelEnemy) setMultipliers(Number(atkmult)*Number(partmult)*Number(elementalWeaknessMult)*Number(mainClassWeaponBoost)*Number(classSkillMult)*Number(equipMult)*Number(augmentEquipMult)*Number(potencyFloorEquipMult)*Number(elementalWeaponEquipMult)*Number(critMult)*Number(appropriateDistance)*Number(foodBoost)*Number(fieldEffects)*Number(statusAilments)*Number(enemyCorrectionMult)*Number(highLevelEnemy))
},[atkmult,partmult,elementalWeaknessMult,mainClassWeaponBoost,classSkillMult,equipMult,augmentEquipMult,potencyFloorEquipMult,elementalWeaponEquipMult,critMult,appropriateDistance,foodBoost,fieldEffects,statusAilments,enemyCorrectionMult,highLevelEnemy]) },[atkmult,partmult,elementalWeaknessMult,mainClassWeaponBoost,classSkillMult,equipMult,augmentEquipMult,potencyFloorEquipMult,elementalWeaponEquipMult,critMult,appropriateDistance,foodBoost,fieldEffects,statusAilments,enemyCorrectionMult,highLevelEnemy])
return <> return <>
@ -786,6 +796,28 @@ function DamageCalculator(p) {
Base Attack:<EditStatBox value={baseAtk} callback={(val)=>{setBaseAtk(val)}}/> Base Attack:<EditStatBox value={baseAtk} callback={(val)=>{setBaseAtk(val)}}/>
Enemy Defense:<EditStatBox value={enemyDef} callback={(val)=>{setEnemyDef(val)}}/> Enemy Defense:<EditStatBox value={enemyDef} callback={(val)=>{setEnemyDef(val)}}/>
Multipliers:<EditStatBox value={multipliers} callback={(val)=>{setMultipliers(val)}}/> Multipliers:<EditStatBox value={multipliers} callback={(val)=>{setMultipliers(val)}}/>
<ul>
<li>●Atk Mult:<EditStatBox value={atkmult} callback={(val)=>{setAtkMult(val)}}/></li>
<li>●Part Mult:<EditStatBox value={partmult} callback={(val)=>{setPartMult(val)}}/></li>
<li>●Elemental Weakness Mult:<EditStatBox value={elementalWeaknessMult} callback={(val)=>{setElementalWeaknessMult(val)}}/></li>
<li>●Main Class Weapon Boost:<EditStatBox value={mainClassWeaponBoost} callback={(val)=>{setMainClassWeaponBoost(val)}}/></li>
<li>●Class Skill Mult:<EditStatBox value={classSkillMult} callback={(val)=>{setClassSkillMult(val)}}/></li>
<li>●Equip Mult:<EditStatBox value={equipMult} callback={(val)=>{setEquipMult(val)}}/></li>
<li>
<ul>
<li>●Augment Equip Mult:<EditStatBox value={augmentEquipMult} callback={(val)=>{setAugmentEquipMult(val)}}/></li>
<li>●Potency Floor Equip Mult:<EditStatBox value={potencyFloorEquipMult} callback={(val)=>{setPotencyFloorEquipMult(val)}}/></li>
<li>●Elemental Weapon Equip Mult:<EditStatBox value={elementalWeaponEquipMult} callback={(val)=>{setElementalWeaponEquipMult(val)}}/></li>
</ul>
</li>
<li>●Crit Mult:<EditStatBox value={critMult} callback={(val)=>{setCritMult(val)}}/></li>
<li>●Appropriate Distance:<EditStatBox value={appropriateDistance} callback={(val)=>{setAppropriateDistance(val)}}/></li>
<li>●Food Boost:<EditStatBox value={foodBoost} callback={(val)=>{setFoodBoost(val)}}/></li>
<li>●Field Effects:<EditStatBox value={fieldEffects} callback={(val)=>{setFieldEffects(val)}}/></li>
<li>●Status Ailments:<EditStatBox value={statusAilments} callback={(val)=>{setStatusAilments(val)}}/></li>
<li>●Enemy Correction Multiplier:<EditStatBox value={enemyCorrectionMult} callback={(val)=>{setEnemyCorrectionMult(val)}}/></li>
<li>●High Level Enemy:<EditStatBox value={highLevelEnemy} callback={(val)=>{setHighLevelEnemy(val)}}/></li>
</ul>
<br/><br/><br/> <br/><br/><br/>
Raw Dmg:{rawDmg} Raw Dmg:{rawDmg}
</div> </div>
@ -857,7 +889,7 @@ function App() {
</Route> </Route>
<Route path={process.env.PUBLIC_URL+"/test"}> <Route path={process.env.PUBLIC_URL+"/test"}>
<TestHeader/> <TestHeader/>
<div id="main"><TestPanel/></div> <TestPanel/>
</Route> </Route>
<Route path={process.env.PUBLIC_URL+"/formula"}> <Route path={process.env.PUBLIC_URL+"/formula"}>
<DamageCalculator/> <DamageCalculator/>

216
src/TestPanel.js
View File

@ -2,65 +2,197 @@ import React from 'react';
function TestPanel() { function TestPanel() {
return ( //Futasuke is a genius return ( //Futasuke is a genius
<div className="main">
<div className="container"> <div className="containerA">
<div className="box itembox"> <div className="box">
<div className="boxTitleBar"> <div className="boxTitleBar">
<h1>Weapon Select</h1> <h1>Basic Information</h1>
<div className="boxExit"></div>
</div>
<table className="basicInfo">
<tr>
<td>Author</td>
<td>&nbsp;</td>
<td>Dudley</td>
</tr>
<tr>
<td>Build Name</td>
<td>&nbsp;</td>
<td>Fatimah</td>
</tr>
<tr>
<td>Class</td>
<td><img alt="" src="Ra.png" /> Ranger</td>
<td><span className="ye">Lv.20</span></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><img alt="" src="Fo.png" /> Force</td>
<td>Lv.15</td>
</tr>
</table>
</div>
<div className="box">
<div className="boxTitleBar">
<h1>Current Effects</h1>
<div className="boxExit"></div> <div className="boxExit"></div>
</div> </div>
<ul className="boxmenu"> <ul className="boxmenu">
<li>Rifle</li> <li>1</li>
<li>Launcher</li> <li>2</li>
<li>Rod</li>
<li>Talis</li>
</ul> </ul>
<div className="itemBar"> <h3>Effect Name</h3>
<div className="itemBarSort"> <ul className="infoBuffs">
<select className="itemBarForm"> <li>Food Bost Effect
<option>Standard Sort</option> <ul>
<option>Rarity</option> <li><img alt="" src="https://i.imgur.com/TQ8EBW2.png" />&ensp;[Meat] Potency +10.0%</li>
<option>Attack</option> <li><img alt="" src="https://i.imgur.com/TQ8EBW2.png" />&ensp;[Crisp] Potency to Weak Point +5.0%</li>
<option>Potency</option> </ul>
</select> </li>
</div> <li>Shifta / Deband
<div className="itemBarFilter"> <ul>
<input className="itemBarForm" type="text" placeholder="Filter" /> <li><img alt="" src="https://i.imgur.com/VIYYNIm.png" />&ensp;Potency +5.0%</li>
</div> <li><img alt="" src="https://i.imgur.com/VIYYNIm.png" />&ensp;Damage Resistance +10.0%</li>
</div> </ul>
<div className="itemlistcontainer customScrollbar"> </li>
<ul className="itemlist"> <li>Region Mag Boost
<li className="itemwep r1"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemPrimmRifle.png"} /><em className="rifle">Primm Rifle</em><br /><span className="atk">177</span> <span className="pot tooltip">Recycler Unit<span>Lv.4: Potency +24%/<br />20% chance of Restasigne not being consumed on use. Effect starts 10 sec after equip</span></span></li> <ul>
<li className="itemwep r2"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemTzviaRifle.png"} /><em className="rifle">Tzvia Rifle</em><br /><span className="atk">195</span> <span className="pot tooltip">Indomitable Unit<span>Lv.4: Potency +26%/<br />All Down Resistances +20%</span></span></li> <li><img alt="" src="https://i.imgur.com/N6M74Qr.png" />&ensp;Potency +5.0%</li>
<li className="itemwep r3"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemTheseusRifle.png"} /><em className="rifle">Theseus Rifle</em><br /><span className="atk">223</span> <span className="pot tooltip">Defensive Formation<span>Lv.4: Potency +22%/<br />Critical Hit Rate increases based on Defense, up to a maximum of +18% at 1,000 Defense.</span></span></li> </ul>
<li className="itemwep r4"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemResurgirRifle.png"} /><em className="rifle">Resurgir Rifle</em><br /><span className="atk">240</span> <span className="pot tooltip">Dynamo Unit<span>Lv.4: Potency +21%/<br />Critical Hit Rate +18% for 30 seconds after a successful Sidestep.</span></span></li> </li>
<li className="itemwep r4"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemFoursisRifle.png"} /><em className="rifle">Foursis Rifle</em><br /><span className="atk">242</span> <span className="pot tooltip">Bastion Unit<span>Lv.4: Potency +24%/<br />Creates a barrier that provides Damage Resistance +50% when at Max HP.</span></span></li>
<li className="itemwep"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/logo_test.png"} /><em className="gb">Test</em><br /><span className="atk">999</span> <span className="pot tooltip" title="Test">Test<span>Test</span></span></li>
<li className="itemwep"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/logo_test.png"} /><em className="gb">Test</em><br /><span className="atk">999</span> <span className="pot tooltip" title="Test">Test<span>Test</span></span></li>
<li className="itemwep"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/logo_test.png"} /><em className="gb">Test</em><br /><span className="atk">999</span> <span className="pot tooltip" title="Test">Test<span>Test</span></span></li>
</ul> </ul>
</div> </div>
</div> </div>
<div className="box itembox"> <div className="containerB">
<div className="box">
<div className="boxTitleBar"> <div className="boxTitleBar">
<h1>Food List</h1> <h1>Equip</h1>
<div className="boxExit"></div> <div className="boxExit"></div>
</div> </div>
<div className="itemBar"> <div className="equipPalette">
<div className="itemBarSort"> <div className="equipPaletteSlot"><h3>Weapons</h3><div className="equipPaletteSlotWrapper"><span>1</span><img className="r4" alt="" src="./64px-NGSUIItemResurgirRifle.png" /></div></div>
</div> <div className="equipPaletteSlot"><h3>Armor 1</h3><div className="equipPaletteSlotWrapper"><img className="r3" alt="" src="./photon_barrier.png" /></div></div>
<div className="itemBarFilter"> <div className="equipPaletteSlot"><h3>Armor 2</h3><div className="equipPaletteSlotWrapper"><img className="r3" alt="" src="./photon_barrier.png" /></div></div>
<input className="itemBarForm" type="text" placeholder="Filter" /> <div className="equipPaletteSlot"><h3>Armor 3</h3><div className="equipPaletteSlotWrapper"><img className="r3" alt="" src="./photon_barrier.png" /></div></div>
</div> </div>
</div> </div>
<div className="itemlistcontainer customScrollbar"> <div className="box">
<ul className="itemlist"> <div className="boxTitleBar">
<li className="itemwep r1"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/food/rich_aelio_herb.png"} /><em className="vege">Rich Aelio Herb</em><br /><span className="atk">177</span> </li> <h1>Equipped Weapon</h1>
<div className="boxExit"></div>
</div>
<h2 className="rifle">Resurgir Rifle+40</h2>
<ul className="boxmenu">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
<div className="equipDetails">
<div className="equipAugs">
<h3>Abilitiy Details</h3>
<ul>
<li><div className="equipAugsExpand tooltip"><img alt="" src="./icons/aug_plus.png" /><span>Potency +20%/<br />Critical Hit Rage +15% for 30 seconds after a successful sidestep</span></div><span className="pot">Dynamo Unit Lv.3</span></li>
<li><div className="equipAugsExpand tooltip"><img alt="" src="./icons/aug_plus.png" /><span>Potency +4%</span></div><span className="fixa">Fixa Attack Lv.3</span></li>
<li><div className="equipAugsExpand tooltip"><img alt="" src="./icons/aug_plus.png" /><span>PP +5<br />Ranged Weapon Potency +2.0%</span></div><span className="aug">Pettas Soul II</span></li>
<li><div className="equipAugsExpand tooltip"><img alt="" src="./icons/aug_plus.png" /><span>HP -10, Potency +1.5%,<br />Potency Floor Increase +1.5%<br />Damage Resistance -1.5%</span></div><span className="aug">Alts Secreta II</span></li>
<li><div className="equipAugsExpand tooltip"><img alt="" src="./icons/aug_plus.png" /><span>HP +10<br />Ranged Weapon Potency +2.0%</span></div><span className="aug">Gigas Precision II</span></li>
<li><div className="equipAugsExpand tooltip"><img alt="" src="./icons/aug_plus.png" /><span>Ranged Weapon Potency +2.0%</span></div><span className="aug">Precision III</span></li>
<li><img alt="" src="./icons/aug_plus.png" /></li>
</ul>
</div>
<div className="pr">
<h3>Properties</h3>
<ul>
<li>Enhancement Lv.&emsp;<span>+35</span></li>
<li>Multi-Weapon&emsp;<span>-</span></li>
<li>Element&emsp;<span>-</span></li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
</div>
<div className="containerC">
<div className="box">
<div className="boxTitleBar">
<h1>Basic Stats</h1>
<div className="boxExit"></div>
</div>
<table className="statsInfo">
<tr>
<td>Battle Power</td>
<td className="ri">1344</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>HP</td>
<td>289</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>PP</td>
<td>100</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Defense</td>
<td>402</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Weapon Up</td>
<td className="statsMelWeaponUp"><span className="ye">+34%</span></td>
<td className="statsRngWeaponUp"><span className="ye">+34%</span></td>
</tr>
<tr>
<td></td>
<td className="statsTecWeaponUp"><span className="ye">+34%</span></td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Damage Resist.</td>
<td>18%</td>
<td>&nbsp;</td>
</tr>
</table>
</div>
<div className="box">
<div className="boxTitleBar">
<h1>Damage Stats</h1>
<div className="boxExit"></div>
</div>
<ul className="boxmenu">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<table className="basicInfo">
<tr>
<td>Critical Hit Rate</td>
<td>5%</td>
</tr>
<tr>
<td>Critical Multiplier</td>
<td>120%</td>
</tr>
<tr>
<td>Midrange</td>
<td>126</td>
</tr>
<tr>
<td>Critcal</td>
<td>152</td>
</tr>
<tr>
<td>Effective</td>
<td><span className="ye">127</span></td>
</tr>
</table>
</div>
</div>
</div>
) )
} }

67
src/search.js Normal file
View File

@ -0,0 +1,67 @@
import React from 'react';
function TestPanel() {
return ( //Futasuke is a genius
<div className="container">
<div className="box itembox">
<div className="boxTitleBar">
<h1>Weapon Select</h1>
<div className="boxExit"></div>
</div>
<ul className="boxmenu">
<li>Rifle</li>
<li>Launcher</li>
<li>Rod</li>
<li>Talis</li>
</ul>
<div className="itemBar">
<div className="itemBarSort">
<select className="itemBarForm">
<option>Standard Sort</option>
<option>Rarity</option>
<option>Attack</option>
<option>Potency</option>
</select>
</div>
<div className="itemBarFilter">
<input className="itemBarForm" type="text" placeholder="Filter" />
</div>
</div>
<div className="itemlistcontainer customScrollbar">
<ul className="itemlist">
<li className="itemwep r1"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemPrimmRifle.png"} /><em className="rifle">Primm Rifle</em><br /><span className="atk">177</span> <span className="pot tooltip">Recycler Unit<span>Lv.4: Potency +24%/<br />20% chance of Restasigne not being consumed on use. Effect starts 10 sec after equip</span></span></li>
<li className="itemwep r2"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemTzviaRifle.png"} /><em className="rifle">Tzvia Rifle</em><br /><span className="atk">195</span> <span className="pot tooltip">Indomitable Unit<span>Lv.4: Potency +26%/<br />All Down Resistances +20%</span></span></li>
<li className="itemwep r3"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemTheseusRifle.png"} /><em className="rifle">Theseus Rifle</em><br /><span className="atk">223</span> <span className="pot tooltip">Defensive Formation<span>Lv.4: Potency +22%/<br />Critical Hit Rate increases based on Defense, up to a maximum of +18% at 1,000 Defense.</span></span></li>
<li className="itemwep r4"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemResurgirRifle.png"} /><em className="rifle">Resurgir Rifle</em><br /><span className="atk">240</span> <span className="pot tooltip">Dynamo Unit<span>Lv.4: Potency +21%/<br />Critical Hit Rate +18% for 30 seconds after a successful Sidestep.</span></span></li>
<li className="itemwep r4"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/64px-NGSUIItemFoursisRifle.png"} /><em className="rifle">Foursis Rifle</em><br /><span className="atk">242</span> <span className="pot tooltip">Bastion Unit<span>Lv.4: Potency +24%/<br />Creates a barrier that provides Damage Resistance +50% when at Max HP.</span></span></li>
<li className="itemwep"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/logo_test.png"} /><em className="gb">Test</em><br /><span className="atk">999</span> <span className="pot tooltip" title="Test">Test<span>Test</span></span></li>
<li className="itemwep"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/logo_test.png"} /><em className="gb">Test</em><br /><span className="atk">999</span> <span className="pot tooltip" title="Test">Test<span>Test</span></span></li>
<li className="itemwep"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/logo_test.png"} /><em className="gb">Test</em><br /><span className="atk">999</span> <span className="pot tooltip" title="Test">Test<span>Test</span></span></li>
</ul>
</div>
</div>
<div className="box itembox">
<div className="boxTitleBar">
<h1>Food List</h1>
<div className="boxExit"></div>
</div>
<div className="itemBar">
<div className="itemBarSort">
</div>
<div className="itemBarFilter">
<input className="itemBarForm" type="text" placeholder="Filter" />
</div>
</div>
<div className="itemlistcontainer customScrollbar">
<ul className="itemlist">
<li className="itemwep r1"><img className="itemimg" alt="" src={process.env.PUBLIC_URL+"/icons/food/rich_aelio_herb.png"} /><em className="vege">Rich Aelio Herb</em><br /><span className="atk">177</span> </li>
</ul>
</div>
</div>
</div>
)
}
export default TestPanel;

2
src/style.css
View File

@ -111,7 +111,7 @@ em {
display:none; display:none;
} }
} }
#main { .main {
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
justify-content: center; justify-content: center;