diff --git a/public/ngsp/1.woff b/public/ngsp/1.woff new file mode 100644 index 0000000..c272fe6 Binary files /dev/null and b/public/ngsp/1.woff differ diff --git a/public/ngsp/2.woff b/public/ngsp/2.woff new file mode 100644 index 0000000..dcc3a95 Binary files /dev/null and b/public/ngsp/2.woff differ diff --git a/public/ngsp/3.woff b/public/ngsp/3.woff new file mode 100644 index 0000000..8cf9165 Binary files /dev/null and b/public/ngsp/3.woff differ diff --git a/public/ngsp/4.woff b/public/ngsp/4.woff new file mode 100644 index 0000000..9ac33b7 Binary files /dev/null and b/public/ngsp/4.woff differ diff --git a/public/ngsp/64px-NGSUIItemFoursisRifle.png b/public/ngsp/64px-NGSUIItemFoursisRifle.png new file mode 100644 index 0000000..ff4a366 Binary files /dev/null and b/public/ngsp/64px-NGSUIItemFoursisRifle.png differ diff --git a/public/ngsp/64px-NGSUIItemPrimmRifle.png b/public/ngsp/64px-NGSUIItemPrimmRifle.png new file mode 100644 index 0000000..f3c0ef1 Binary files /dev/null and b/public/ngsp/64px-NGSUIItemPrimmRifle.png differ diff --git a/public/ngsp/64px-NGSUIItemResurgirRifle.png b/public/ngsp/64px-NGSUIItemResurgirRifle.png new file mode 100644 index 0000000..7b97c77 Binary files /dev/null and b/public/ngsp/64px-NGSUIItemResurgirRifle.png differ diff --git a/public/ngsp/64px-NGSUIItemTheseusRifle.png b/public/ngsp/64px-NGSUIItemTheseusRifle.png new file mode 100644 index 0000000..96d5421 Binary files /dev/null and b/public/ngsp/64px-NGSUIItemTheseusRifle.png differ diff --git a/public/ngsp/64px-NGSUIItemTzviaRifle.png b/public/ngsp/64px-NGSUIItemTzviaRifle.png new file mode 100644 index 0000000..a00a823 Binary files /dev/null and b/public/ngsp/64px-NGSUIItemTzviaRifle.png differ diff --git a/public/ngsp/Blight_Rounds.png b/public/ngsp/Blight_Rounds.png new file mode 100644 index 0000000..ba19590 Binary files /dev/null and b/public/ngsp/Blight_Rounds.png differ diff --git a/public/ngsp/NGSUIItemAssaultRifleMini.png b/public/ngsp/NGSUIItemAssaultRifleMini.png new file mode 100644 index 0000000..7c7b4e2 Binary files /dev/null and b/public/ngsp/NGSUIItemAssaultRifleMini.png differ diff --git a/public/ngsp/NGSUIItemGunbladeMini.png b/public/ngsp/NGSUIItemGunbladeMini.png new file mode 100644 index 0000000..7c32a01 Binary files /dev/null and b/public/ngsp/NGSUIItemGunbladeMini.png differ diff --git a/public/ngsp/NGSUIItemLauncherMini.png b/public/ngsp/NGSUIItemLauncherMini.png new file mode 100644 index 0000000..f0344ae Binary files /dev/null and b/public/ngsp/NGSUIItemLauncherMini.png differ diff --git a/public/ngsp/NGSUIItemPotentialAbility.png b/public/ngsp/NGSUIItemPotentialAbility.png new file mode 100644 index 0000000..e99246d Binary files /dev/null and b/public/ngsp/NGSUIItemPotentialAbility.png differ diff --git a/public/ngsp/NGSUIItemRodMini.png b/public/ngsp/NGSUIItemRodMini.png new file mode 100644 index 0000000..dc64704 Binary files /dev/null and b/public/ngsp/NGSUIItemRodMini.png differ diff --git a/public/ngsp/NGSUIItemTalisMini.png b/public/ngsp/NGSUIItemTalisMini.png new file mode 100644 index 0000000..bf916fc Binary files /dev/null and b/public/ngsp/NGSUIItemTalisMini.png differ diff --git a/public/ngsp/NGSUIRarity1Star.png b/public/ngsp/NGSUIRarity1Star.png new file mode 100644 index 0000000..c30b920 Binary files /dev/null and b/public/ngsp/NGSUIRarity1Star.png differ diff --git a/public/ngsp/NGSUIRarity2Star.png b/public/ngsp/NGSUIRarity2Star.png new file mode 100644 index 0000000..fda9a1f Binary files /dev/null and b/public/ngsp/NGSUIRarity2Star.png differ diff --git a/public/ngsp/NGSUIRarity3Star.png b/public/ngsp/NGSUIRarity3Star.png new file mode 100644 index 0000000..30fe5c2 Binary files /dev/null and b/public/ngsp/NGSUIRarity3Star.png differ diff --git a/public/ngsp/NGSUIRarity4Star.png b/public/ngsp/NGSUIRarity4Star.png new file mode 100644 index 0000000..0ade57c Binary files /dev/null and b/public/ngsp/NGSUIRarity4Star.png differ diff --git a/public/ngsp/NGSUIStatATKOutline.png b/public/ngsp/NGSUIStatATKOutline.png new file mode 100644 index 0000000..d65f98a Binary files /dev/null and b/public/ngsp/NGSUIStatATKOutline.png differ diff --git a/public/ngsp/UINGSItemPresetAbility.png b/public/ngsp/UINGSItemPresetAbility.png new file mode 100644 index 0000000..8a1b6de Binary files /dev/null and b/public/ngsp/UINGSItemPresetAbility.png differ diff --git a/public/ngsp/UINGSItemSpecialAbility.png b/public/ngsp/UINGSItemSpecialAbility.png new file mode 100644 index 0000000..6059003 Binary files /dev/null and b/public/ngsp/UINGSItemSpecialAbility.png differ diff --git a/public/ngsp/class.html b/public/ngsp/class.html new file mode 100644 index 0000000..a27d404 --- /dev/null +++ b/public/ngsp/class.html @@ -0,0 +1,75 @@ + + +NGS Planner UI Mock-Up + + + + + + +
+
+ + +
+
+

Class Skill Tree

+
+
+
+
    +
  • Hunter
    • +
  • Fighter
    • +
  • Ranger
    • +
  • Gunner
    • +
  • Force
    • +
  • Techter
    • +
+
+
+ + +
+
+ + +
+
+

Ranger01

+
+
+
+
+
1/5Blight Rounds
+
 1/1Blight Rounds Reinforce
+
0/10Bad Condition Ward
+
0/1Spread Shot
+
 0/1Spread Shot Quick Getaway
+
0/10Bad Condition Reduction
+
0/1Rifle Grenadier
+
0/1Slide Shot Advance
+
0/1Sticky Bomb Quick Reload
+
0/1Launcher Charge Grouping
+
0/1Slow Landing Attack-Ranger
+
0/1Slow Landing Charge-Ranger
+
+
+
Your Skill Points  6   SP    0
+
ConfirmCancel
+
+ + +
+
+ + \ No newline at end of file diff --git a/public/ngsp/class_old.html b/public/ngsp/class_old.html new file mode 100644 index 0000000..412d9af --- /dev/null +++ b/public/ngsp/class_old.html @@ -0,0 +1,79 @@ + + +NGS Planner UI Mock-Up + + + + + + +
+
+ + +
+

◆ Class Skill Tree✕

+
+
    +
  • Hunter
    • +
  • Fighter
    • +
  • Ranger
    • +
  • Gunner
    • +
  • Force
    • +
  • Techter
    • +
+
+
+ + +
+
+ + +
+

◆ Class Skill Tree✕

+
+
+
0/5Blight Rounds
+
0/1Blight Rounds Reinforce
+
+
+
0/10Bad Condition Ward
+
0/1Spread Shot
+
0/1Spread Shot Quick Getaway
+
+
+
0/10Bad Condition Reduction
+
0/1Rifle Grenadier
+
0/1Slide Shot Advance
+
+
+
 
+
0/1Sticky Bomb Quick Reload
+
0/1Launcher Charge Grouping
+
+
+
0/1Slow Landing Attack-Ranger
+
+
+
0/1Slow Landing Charge-Ranger
+
+
+ +
Your Skill Points  6   SP    0
+ +
+ +
+ + \ No newline at end of file diff --git a/public/ngsp/d_global_bg_header.png b/public/ngsp/d_global_bg_header.png new file mode 100644 index 0000000..c1cf3b5 Binary files /dev/null and b/public/ngsp/d_global_bg_header.png differ diff --git a/public/ngsp/fo.png b/public/ngsp/fo.png new file mode 100644 index 0000000..9adb257 Binary files /dev/null and b/public/ngsp/fo.png differ diff --git a/public/ngsp/gl_main_bg.jpg b/public/ngsp/gl_main_bg.jpg new file mode 100644 index 0000000..14f7cda Binary files /dev/null and b/public/ngsp/gl_main_bg.jpg differ diff --git a/public/ngsp/image0-14.png b/public/ngsp/image0-14.png new file mode 100644 index 0000000..da83ce1 Binary files /dev/null and b/public/ngsp/image0-14.png differ diff --git a/public/ngsp/index.html b/public/ngsp/index.html new file mode 100644 index 0000000..08a9c83 --- /dev/null +++ b/public/ngsp/index.html @@ -0,0 +1,212 @@ + + +NGS Planner UI Mock-Up + + + + + + +
+
+
+
+

Basic Information

+
+
+ + + + + + + + + + + + + + + + + + + + + +
Author Dudley
Build Name Fatimah
Class RangerLv.20
  ForceLv.15
+
+
+
+

Current Effects

+
+
+
    +
  • 1
    • +
  • 2
    • +
+

Effect Name

+
    +
  • Food Bost Effect +
      +
    •  [Meat] Potency +10.0%
      • +
    •  [Crisp] Potency to Weak Point +5.0%
      • +
    +
    • +
  • Shifta / Deband +
      +
    •  Potency +5.0%
      • +
    •  Damage Resistance +10.0%
      • +
    +
    • +
  • Region Mag Boost +
      +
    •  Potency +5.0%
      • +
    +
    • +
+
+
+
+
+
+

Equip

+
+
+
+

Weapons

1
+

Armor 1

+

Armor 2

+

Armor 3

+
+
+
+
+

Equipped Weapon

+
+
+

Resurgir Rifle+40

+
    +
  • 1
    • +
  • 2
    • +
  • 3
    • +
  • 4
    • +
  • 5
    • +
  • 6
    • +
+
+
+

Abilitiy Details

+
    +
  • Potency +20%/
    Critical Hit Rage +15% for 30 seconds after a successful sidestep
    Dynamo Unit Lv.3
    • +
  • Potency +4%
    Fixa Attack Lv.3
    • +
  • PP +5
    Ranged Weapon Potency +2.0%
    Pettas Soul II
    • +
  • HP -10, Potency +1.5%,
    Potency Floor Increase +1.5%
    Damage Resistance -1.5%
    Alts Secreta II
    • +
  • HP +10
    Ranged Weapon Potency +2.0%
    Gigas Precision II
    • +
  • Ranged Weapon Potency +2.0%
    Precision III
    • +
    • +
+
+
+

Properties

+
    +
  • Enhancement Lv. +35
    • +
  • Multi-Weapon -
    • +
  • Element -
    • +
+
+
+
+
+
+
+
+

Basic Stats

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Battle Power1344 
HP289 
PP100 
Defense402 
Weapon Up+34%+34%
+34% 
Damage Resist.18% 
+
+
+
+

Damage Stats

+
+
+
    +
  • 1
    • +
  • 2
    • +
  • 3
    • +
+ + + + + + + + + + + + + + + + + + + + + +
Critical Hit Rate5%
Critical Multiplier120%
Midrange126
Critcal152
Effective127
+
+
+
+ + \ No newline at end of file diff --git a/public/ngsp/logo.png b/public/ngsp/logo.png new file mode 100644 index 0000000..9e7bd75 Binary files /dev/null and b/public/ngsp/logo.png differ diff --git a/public/ngsp/logo_sm.png b/public/ngsp/logo_sm.png new file mode 100644 index 0000000..3203ce4 Binary files /dev/null and b/public/ngsp/logo_sm.png differ diff --git a/public/ngsp/logo_test.png b/public/ngsp/logo_test.png new file mode 100644 index 0000000..309cafa Binary files /dev/null and b/public/ngsp/logo_test.png differ diff --git a/public/ngsp/mel.png b/public/ngsp/mel.png new file mode 100644 index 0000000..ec0e19b Binary files /dev/null and b/public/ngsp/mel.png differ diff --git a/public/ngsp/photon_barrier.png b/public/ngsp/photon_barrier.png new file mode 100644 index 0000000..a36d77a Binary files /dev/null and b/public/ngsp/photon_barrier.png differ diff --git a/public/ngsp/ra.png b/public/ngsp/ra.png new file mode 100644 index 0000000..3c77778 Binary files /dev/null and b/public/ngsp/ra.png differ diff --git a/public/ngsp/reset.css b/public/ngsp/reset.css new file mode 100644 index 0000000..3d7bd69 --- /dev/null +++ b/public/ngsp/reset.css @@ -0,0 +1,50 @@ +the file to use and tweak as fits you best. If you're more of the copy-and-paste type, or just want an in-page preview of what you'll be getting, here it is. + +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} \ No newline at end of file diff --git a/public/ngsp/rifle_resurgir.png b/public/ngsp/rifle_resurgir.png new file mode 100644 index 0000000..0965e03 Binary files /dev/null and b/public/ngsp/rifle_resurgir.png differ diff --git a/public/ngsp/rng.png b/public/ngsp/rng.png new file mode 100644 index 0000000..a8e048f Binary files /dev/null and b/public/ngsp/rng.png differ diff --git a/public/ngsp/search.html b/public/ngsp/search.html new file mode 100644 index 0000000..1a353a2 --- /dev/null +++ b/public/ngsp/search.html @@ -0,0 +1,143 @@ + + +NGS Planner UI Mock-Up + + + + + + +
+
+ + +
+
+

Weapon Select

+
+
+
    +
  • Rifle
    • +
  • Launcher
    • +
  • Rod
    • +
  • Talis
    • +
+
+
+ +
+
+ +
+
+
+
    +
  • Primm Rifle
    177 Recycler UnitLv.4: Potency +24%/
    20% chance of Restasigne not being consumed on use. Effect starts 10 sec after equip
    • +
  • Tzvia Rifle
    195 Indomitable UnitLv.4: Potency +26%/
    All Down Resistances +20%
    • +
  • Theseus Rifle
    223 Defensive FormationLv.4: Potency +22%/
    Critical Hit Rate increases based on Defense, up to a maximum of +18% at 1,000 Defense.
    • +
  • Resurgir Rifle
    240 Dynamo UnitLv.4: Potency +21%/
    Critical Hit Rate +18% for 30 seconds after a successful Sidestep.
    • +
  • Foursis Rifle
    242 Bastion UnitLv.4: Potency +24%/
    Creates a barrier that provides Damage Resistance +50% when at Max HP.
    • +
  • Test
    999 TestTest
    • +
  • Test
    999 TestTest
    • +
  • Test
    999 TestTest
    • +
+
+
+ + + +
+
+

Food List

+
+
+
+
+ +
+
+ +
+
+
+
    +
  • Rich Aelio Herb
    177
    • +
+
+
+ + +
+
+ + +
+
+

Augment Select

+
+
+
    +
  • Potential
    • +
  • Preset Skill
    • +
  • Augment
    • +
+
+
+ +
+
+ +
+
+
+
    +
  • Potency +XX%/
    Critical Hit Rage +XX% for 30 seconds after a successful sidestep
    Dynamo Unit Lv.1
    • +
  • Potency +XX%/
    Critical Hit Rage +XX% for 30 seconds after a successful sidestep
    Dynamo Unit Lv.2
    • +
  • Potency +20%/
    Critical Hit Rage +15% for 30 seconds after a successful sidestep
    Dynamo Unit Lv.3
    • +
  • Potency +XX%/
    Critical Hit Rage +XX% for 30 seconds after a successful sidestep
    Dynamo Unit Lv.4
    • +
  • Potency +2%
    Fixa Attack Lv.1
    • +
  • Potency +3%
    Fixa Attack Lv.2
    • +
  • Potency +4%
    Fixa Attack Lv.3
    • +
  • Potency +4.5%
    Fixa Attack Lv.4
    • +
  • Potency +5%
    Fixa Attack Lv.5
    • +
  • HP -10, Potency +1.5%,
    Potency Floor Increase +1.5%
    Damage Resistance -1.5%
    Alts Secreta II
    • +
  • Testing
    Test
    • +
  • Testing
    Test
    • +
  • Testing
    Test
    • +
  • Testing
    Test
    • +
  • Testing
    Test
    • +
  • Testing
    Test
    • +
  • Testing
    Test
    • +
+
+
+ + +
+
+ + \ No newline at end of file diff --git a/public/ngsp/skilltree_div_overlay.png b/public/ngsp/skilltree_div_overlay.png new file mode 100644 index 0000000..3d6a368 Binary files /dev/null and b/public/ngsp/skilltree_div_overlay.png differ diff --git a/public/ngsp/skilltree_div_overlay2.png b/public/ngsp/skilltree_div_overlay2.png new file mode 100644 index 0000000..9d7432a Binary files /dev/null and b/public/ngsp/skilltree_div_overlay2.png differ diff --git a/public/ngsp/skilltree_req_lock.png b/public/ngsp/skilltree_req_lock.png new file mode 100644 index 0000000..8639544 Binary files /dev/null and b/public/ngsp/skilltree_req_lock.png differ diff --git a/public/ngsp/skilltree_req_unlock.png b/public/ngsp/skilltree_req_unlock.png new file mode 100644 index 0000000..5e425a0 Binary files /dev/null and b/public/ngsp/skilltree_req_unlock.png differ diff --git a/public/ngsp/style.css b/public/ngsp/style.css new file mode 100644 index 0000000..0a3cc52 --- /dev/null +++ b/public/ngsp/style.css @@ -0,0 +1,817 @@ +* { + border: 0; + margin: 0; + padding: 0; + box-sizing: border-box; +} +@font-face { + font-family: "ngs"; + src: url("4.woff") format("woff"); +} +@font-face { + font-family: "ngs2"; + src: url("3.woff") format("woff"); +} +@font-face { + font-family: "ngs3"; + src: url("2.woff") format("woff"); +} +@font-face { + font-family: "ngs4"; + src: url("1.woff") format("woff"); +} +img { + vertical-align: middle; +} +body { + background-image: url("./d_global_bg_header.png"),url("./gl_main_bg.jpg"); + background-size: 1903px,2560px; + background-color: #e8ecf4; + background-repeat: no-repeat,repeat-y; + background-position: center 40px; + color: black; + font-family: ngs,Arial,sans-serif; + font-size: 11pt; + font-weight: normal; + text-align: center; + -webkit-font-smoothing: antialiased; +} +ul { + list-style-type: none; + padding-inline-start: 0; +} +em { + font-style: normal; +} +#header { + background-color: white; + min-height: 50px; + padding: 20px; + text-align: left; + margin-bottom: 20px; +} +#header a { + color: #151f25; + text-decoration: none; +} +#header a:hover { + color: #454f85; + text-decoration: none; +} +#header div { + margin: 0 auto; + width: 80%; +} +#header ul { + display: flex; + flex-flow: row wrap; + align-items: center; + margin-left: -40px; + justify-content: flex-end; +} +#header ul li { + flex: 0 1; + color: black; + font-family: "ngs2"; + text-align: center; + white-space:nowrap; + +} +.headermenuitem { + font-size:14pt; + margin-left: 40px; +} +.logo { + margin-right: auto; + font-weight:bold; + font-size:20px; +} +.logo img { + height:28px; +} +@media screen and (min-width:390px) and (max-width:860px) { +.headermenuitem { + display:none; +} +} +@media screen and (max-width:390px) { +.headermenuitem { + display:none; +} +} +#main { + display: flex; + flex-flow: row wrap; + justify-content: center; + width: 100%; +} +.container { + flex-grow: 1; + flex-shrink: 1; + flex-basis: 200px; + max-width: 500px; + margin: 10px; +} +.containerA, .containerC { + flex-grow: 1; +/* flex-shrink: 1; + flex-basis: 200px;*/ + max-width: 360px; + margin: 10px; +} +.containerB { + flex-grow: 1; + flex-shrink: 1; + flex-basis: 200px; + max-width: 480px; + margin: 10px; +} +.box { + color: #97e2fc; + background-clip: padding-box; + background-color: rgba(38,53,63,0.80); + /*background-color: #151f25;*/ + margin: 10px auto; + text-align: left; + text-shadow: -1px -1px 0 rgba(0,0,0,0.66), 1px -1px 0 rgba(0,0,0,0.66), -1px 1px 0 rgba(0,0,0,0.66), 1px 1px 0 rgba(0,0,0,0.66); + /*min-width: 300px;*/ + /*max-width: 500px;*/ + padding-bottom:10px; +} +.box:hover { + outline: 1px solid rgba(54,255,255,1); +} +.box:hover .boxTitleBar { + background: linear-gradient(45deg, rgba(47,153,193,1),rgba(46,94,137,1) 30%,rgba(46,94,137,1) 70%, rgba(47,153,193,1)); +} +.box table { + border-spacing: 0; + color: white; + margin: 10px auto; + width: 95%; +} +.box tr { +/* background-image: url("tr_bg.png");*/ + background-repeat: no-repeat; + background-position: left bottom; + border-bottom: 1px solid rgba(128,128,128,0.5); +} +.box tr:last-child { + border-bottom: 0; +} +.box td { + padding: 0 5px; + white-space: nowrap; +} +.box td:first-child { + color: #97e2fc; +} +.box td:last-child { + text-align: right; +} +.statsInfo td:nth-child(2) { + text-align: right; +} +.statsInfo td:last-child { + width: 45%; +} +.statsInfo span { + +} +.statsMelWeaponUp:before { + content: url("./mel.png"); + margin-right: 5px; + vertical-align: middle; +} +.statsRngWeaponUp:before { + content: url("./rng.png"); + margin-right: 5px; + vertical-align: middle; +} +.statsTecWeaponUp:before { + content: url("./tec.png"); + margin-right: 5px; + vertical-align: middle; +} +.boxTitleBar { + /* background-color: #495a61; */ + background-color: rgba(128,128,128,0.50); + color: white; + font-weight: normal; + font-size: 13pt; + text-align: left; + white-space: nowrap; + display: flex; + flex-flow: row nowrap; + justify-content: space-between; + +} +.boxTitleBar h1 { + /* background-color: #495a61; */ + color: white; + font-weight: normal; + font-size: 13pt; + overflow: hidden; + text-overflow: ellipsis; + margin-right: 10px; + padding: 13px 13px 7px 13px; +} +.boxTitleBar h1:before { + content: ' \25C6'; + margin-right: 10px; +} +.box h2 { + color: white; + font-weight: normal; + font-size: 18px; + margin: 10px 10px 0 10px; + text-align: left; +} +.box h2 img { + margin-right: 5px; + vertical-align: top; +} +.box h2:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.da { + color: white; + text-align: right; +} +.da span { + background-color: rgba(20,29,40,0.66); + padding: 5px; +} +.da span:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.basicInfo tr:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.infoBuffs { + margin: 0 auto; + width: 90%; +} +.infoBuffs:last-child { + margin-bottom: 10px; +} +.infobuffs li { + margin: 5px 0; +} +.infoBuffs li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.infoBuffs li ul { + width: 100%; +} +.infoBuffs li ul li { + width: 100%; + padding-left: 20px; +} +.infoBuffs li ul li:hover { + background: transparent; +} +.box p { + padding: 10px 10px 0 10px; + color: white; +} +.box h3 { +/* background-image: url("tr_bg.png"); + background-repeat: no-repeat; + background-position: left bottom;*/ + 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; + justify-content: center; + flex-flow: row wrap; + white-space: nowrap; + +} +.equipPaletteSlotWrapper { + background-color: rgba(128,128,128,0.50); + padding: 10px; +} +.equipPaletteSlotWrapper span { + margin: 0 10px 0 0; + color: rgb(255,207,4); + font-size: 14pt; + font-family: ngs2,Arial,sans-serif; +} +.equipPaletteSlotWrapper img { + height: 48px; +} +.equipPaletteSlot { + text-align: center; + flex: 1 1; +} +.equipPaletteSlot:first-child { + padding-right: 10px; +} +.equipPaletteSlot:hover { + +} +.equipPaletteSlot:hover img { + outline: 2px solid rgba(54,255,255,0.66); +} +.equipPalette h3 { + color: #97e2fc; + font-size: 16px; + font-weight: normal; + white-space: nowrap; +} +.equipDetails { + display: flex; + justify-content: center; + flex-flow: row wrap; +} +.equipDetails { + margin: 10px 10px 0 0; + text-align: left; +} +.equipAugs { + flex: 1 1 auto; +} +.equipAugs ul { + position: relative; +} +.equipAugs li { + background-color: rgba(128,128,128,0.50); + color: white; + margin: 0 0 5px 10px; + padding: 12px 10px 7px 10px; +} +.equipAugs li img { +} +.equipAugs li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); + outline: 2px solid hsl(180, 78%, 50%); +} +.equipAugsExpand { + margin: 0 10px 0 0; + display: inline; +} +.tooltip { + cursor: help; +} +.tooltip span { + color: white; + font-size:10pt; + visibility: hidden; + width: 200px; + background-color: rgba(38,53,63,0.9); + text-align: left; + /*border-radius: 6px;*/ + padding: 5px; + /* Position the tooltip */ + position: absolute; + white-space: normal; + left: 1em; + +} +.tooltip:hover span { + visibility: visible; +} +.pr { + flex: 1 1 auto; + margin: 10px 10px 0 0; + text-align: left; +} +.pr li { + margin: 0 10px 2px 10px; + padding: 5px; +} +.pr li span { + color:white +} +/*.pr li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +}*/ +.ye { + color: #ffb74c; +} +.itemlist { + margin: 0 10px; + position: relative; +} +.itemlist li { + background-color: rgba(128,128,128,0.33); + color: white; + margin: 0 0 5px 0; + padding: 10px; + background-repeat: no-repeat; + background-position: right top; + background-origin: content-box; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.aug:before { + content:url("./UINGSItemSpecialAbility.png"); + margin-right: 5px; + vertical-align: middle; +} +.itemwep { + font-size: 10pt; +} +.itemwep em { + font-size: 12pt; + line-height: 28px; +} +.itemwep:after { + clear:both; +} +.rifle:before { + content: url("./NGSUIItemAssaultRifleMini.png"); + margin-right: 5px; + vertical-align: middle; +} +.gb:before { + content: url("./NGSUIItemGunbladeMini.png"); + margin-right: 5px; + vertical-align: middle; +} +.vege:before { + content: url("./icons/food/vege.png"); + margin-right: 5px; + vertical-align: middle; +} +.itemimg { + background: radial-gradient(rgb(196,196,196),rgb(128,128,128)); + border: 4px solid rgba(128,128,128,1); + float: left; + margin-right: 10px; + width: 48px; + box-sizing: content-box; +} +li.r1 { + background-image: url("./NGSUIRarity1Star.png"); +} +.r1 img { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); +} +li.r2 { + background-image: url("./NGSUIRarity2Star.png"); +} +.r2 img { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); +} +li.r3 { + background-image: url("./NGSUIRarity3Star.png"); +} +.r3 img { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); +} +li.r4 { + background-image: url("./NGSUIRarity4Star.png"); +} +.r4 img { + background: radial-gradient(rgb(101,178,77),rgb(83,146,63)); +} +.equipPaletteSlotWrapper img.r1 { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); + border: 1px solid rgb(64,150,183); +} +.equipPaletteSlotWrapper img.r2 { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); + border: 1px solid rgb(64,150,183); +} +.equipPaletteSlotWrapper img.r3 { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); + border: 1px solid rgb(64,150,183); +} +.equipPaletteSlotWrapper img.r4 { + background: radial-gradient(rgb(101,178,77),rgb(83,146,63)); + border: 1px solid rgb(101,178,77); +} +.itemlist li span { + background-repeat: no-repeat; + background-position: left center; + margin-right: 10px; +} +.atk:before { + content: url("./NGSUIStatATKOutline.png"); + margin-right: 5px; + vertical-align: middle; +} +.fixa { + color: rgb(255,135,80); +} +.fixa:before { + content: url("./UINGSItemPresetAbility.png"); + margin-right: 5px; + vertical-align: middle; +} +.pot { + color: rgb(255,255,0); +} +.pot:before { + content: url("./NGSUIItemPotentialAbility.png"); + margin-right: 5px; + vertical-align: middle; +} +.clear { + clear: both; +} +.itemlistcontainer { + max-height: 400px; + overflow-y: scroll; + overflow-x: hidden; + margin: 10px 5px 0 0; + padding: 2px; +} +@media screen and (min-width:390px) and (max-width:860px) { +.itemlistcontainer { + max-height: 300px; +} +} +.itemlist li:hover, .treeList li:hover { + background-color: rgba(113,169,189,0.33); + outline: 2px solid rgba(54,255,255,0.66); +} +.boxmenu { + font-size: 10pt; + margin: 0 10px 0 10px; + justify-content: flex-start; + display: flex; + flex-flow: row wrap; +} +.boxmenu li { + background-color: rgba(245, 245, 245,0.66); + color: white; + display: inline-block; + margin: 10px 5px 0 0; + padding: 5px; + text-align: center; + flex-basis: 57px; + white-space: nowrap; +} +.boxmenu img { + vertical-align: middle; +} +.boxmenu li:first-child { + background: linear-gradient(135deg,#60461b,#b0a34e); + border-bottom: 4px solid #ffd602; +} +.boxmenu li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); + border-bottom: 0; + padding-bottom: 9px; + outline: 2px solid hsl(180, 78%, 50%); +} +.itembar { + justify-content: center; + display: flex; + flex-flow: row nowrap; + margin: 10px 10px 0 10px; + padding: 0 2px; +} +.itemBarSort, .itemBarFilter { + flex: 1 1 100px; + margin-right: 10px; +} +input { + background-color: #101317; + color: white; + font-family: ngs,sans-serif; + font-size: 11pt; + height: 28px; + padding: 0 5px; + text-shadow: -1px -1px 0 rgba(0,0,0,0.66), 1px -1px 0 rgba(0,0,0,0.66), -1px 1px 0 rgba(0,0,0,0.66), 1px 1px 0 rgba(0,0,0,0.66); +} +input:hover { + outline: 2px solid #30cdef; +} +select{ + background-color: rgba(128,128,128,0.5); + color: white; + font-family: ngs,sans-serif; + font-size: 11pt; + height: 28px; + padding: 5px 10px; + text-shadow: -1px -1px 0 rgba(0,0,0,0.66), 1px -1px 0 rgba(0,0,0,0.66), -1px 1px 0 rgba(0,0,0,0.66), 1px 1px 0 rgba(0,0,0,0.66); +} +select.itemBarForm, input.itemBarForm { + width: 100%; +} +option { + background-color: rgb(128,128,128); +} +.boxExit { + padding: 9px 9px 3px 9px; + margin: 4px; +} +.boxExit:hover { + background-color: hsl(0, 100%, 33%); + outline: 2px solid hsl(0, 100%, 50%); +} +.boxExit:after { + content: ' \2573'; + font-size:9pt; +} +/*.itembox:hover { + border: 1px solid #36ffff; +}*/ +.exit { + color: white; +} +/* width */ +.customScrollbar::-webkit-scrollbar { + width: 4px; + height: 4px; +} +/* Track */ +.customScrollbar::-webkit-scrollbar-track { + background: rgba(128,128,128,0.8); +} + +/* Handle */ +.customScrollbar::-webkit-scrollbar-thumb { + background-color: rgba(245, 245, 245,0.66); +} +.customScrollbar::-webkit-scrollbar-button { + background-color: rgba(162,162,162,0.8); + height:4px; + width:4px; +} +.customScrollbar::-webkit-scrollbar-corner { + background-color: transparent; +} +/* Handle on hover +::-webkit-scrollbar-thumb:hover { + background: #555; +}*/ +.containerX { + margin: 10px; + min-width: 0; +} +.containerY { + margin: 10px; + min-width: 0; +} +.treeListContainer { + overflow-y: auto; + margin: 10px 10px 0 10px; +} +.treeSelectBox { + min-width: 150px; +} +.treeList { + padding: 0 2px; +} +.treelist li { + background-color: rgba(128,128,128,0.33); + color: white; + margin: 5px 0 0 0; + padding: 10px; + background-repeat: no-repeat; + background-position: right center; + background-origin: content-box; +} +li.treeListMain { + background-image: url("./icons/class_main.png"); +} +li.treeListSub { + background-image: url("./icons/class_sub.png"); +} +.treeList li img { + vertical-align: middle; + margin-right: 5px; +} +.skillTreeBox { + max-width: 1108px; +} +.skillTreeContainer { + max-height: 400px; + overflow-y: scroll; + margin: 10px 5px 0 10px; + padding: 2px; +} +@media screen and (min-width:390px) and (max-width:860px) { +.skillTreeContainer { + max-height: 300px; +} +} +.skillTreeGrid { + display: grid; + grid-template-columns: repeat(6, 171px); + gap: 10px; + grid-template-areas: + "a1 b1 c1 d1 e1 f1" + "a2 b2 c2 d2 e2 f2" + "a3 b3 c3 d3 e3 f3" + "a4 b4 c4 d4 e4 f4" + "a5 b5 c5 d5 e5 f5"; + margin-right: 10px; +} +.skillTreeGrid div { + background-color: rgba(128,128,128,0.33); + color: white; + padding: 6px; + /*background-repeat: no-repeat; + background-position: right top; + background-origin: content-box;*/ + text-align: center; + height: 148px; + position: relative; + margin: 0 0 37px 0; +} +.skillTreeGrid div:hover .skillButtons { + visibility: visible; +} +div.skillActive { + background-color: rgba(18,103,87,0.5); +} +div.skillMaxed { + background-color: rgba(18,103,87,0.5); +} +.skillTreeGrid div:hover { + outline: 2px solid rgba(54,255,255,0.66); + background-color: rgba(113,169,189,0.33); + background-image: url("./skilltree_div_overlay.png"); + background-repeat: no-repeat; +} +.skillTreeGrid div.skillActive:hover, .skillTreeGrid div.skillMaxed:hover { + outline: 2px solid rgba(54,255,255,0.66); + background-color: rgba(18,103,87,0.5); +} +div.skillLocked { + background-color: rgba(64,64,64,0.33); +} +div.skillLocked img, div.skillLocked span.skillAllocated, div.skillLocked em.skillName { + opacity: 0.33; +} +.skillIcon { + margin: 0 auto; +} +.skillAllocated { + display: block; + line-height: 40px; +} +div.skillActive .skillAllocated { + color: rgb(255,255,0) +} +div.skillMaxed .skillAllocated { + color: rgb(255,135,80); +} +.skillTreeReqUnlock { + position: absolute; + height: 22px; + width: 175px; + background-image: url("./skilltree_req_unlock.png"); + background-repeat: no-repeat; + background-position: center; + top: -34px; + left: -2px; + display: block; + opacity: 0.8; +} +.skillTreeReqLock { + position: absolute; + height: 22px; + width: 175px; + background-image: url("./skilltree_req_lock.png"); + background-repeat: no-repeat; + background-position: center; + top: -34px; + left: -2px; + display: block; + opacity: 0.8; +} +.skillName { + background-color: rgba(32,32,32,0.33); + display: block; + padding: 10px; + height: 48px; + text-align: left; +} + +.skillPoints { + background-color: rgba(64,64,64,0.5); + text-align: center; + margin: 10px 10px 0 10px; + padding: 16px 0 10px 0; + color: white; + font-size: 14pt; +} +.skillConfirm { + justify-content: center; + display: flex; + flex-flow: row wrap; +} +.skillConfirm span { + flex: 1 1 auto; + background-color: rgba(113,169,189,0.33); + display: inline-block; + text-align: center; + line-height: 48px; + color: white; + font-size: 13pt; + margin: 10px 6px 0 6px; + max-width: 292px; +} \ No newline at end of file diff --git a/public/ngsp/style_old.css b/public/ngsp/style_old.css new file mode 100644 index 0000000..d3569ef --- /dev/null +++ b/public/ngsp/style_old.css @@ -0,0 +1,634 @@ +* { + border: 0; + margin: 0; + padding: 0; + box-sizing: border-box; +} +@font-face { + font-family: "ngs"; + src: url("4.woff") format("woff"); +} +@font-face { + font-family: "ngs2"; + src: url("3.woff") format("woff"); +} +body { + background-image: url("./d_global_bg_header.png"),url("./gl_main_bg.jpg"); + background-size: 1903px,2560px; + background-color: #e8ecf4; + background-repeat: no-repeat,repeat-y; + background-position: center 40px; + color: black; + font-family: ngs,Arial,sans-serif; + font-size: 11pt; + font-weight: normal; + text-align: center; + -webkit-font-smoothing: antialiased; +} +ul { + list-style-type: none; + padding-inline-start: 0; +} +em { + font-style: normal; +} +#header { + background-color: white; + min-height: 50px; + padding: 20px; + text-align: left; + margin-bottom: 20px; +} +#header a { + color: #151f25; + text-decoration: none; +} +#header a:hover { + color: #454f85; + text-decoration: none; +} +#header div { + margin: 0 auto; + width: 80%; +} +#header ul { + display: flex; + flex-flow: row wrap; + align-items: center; + margin-left: -40px; + justify-content: flex-end; +} +#header ul li { + flex: 0 1; + color: black; + font-family: "ngs2"; + text-align: center; + white-space:nowrap; + +} +.headermenuitem { + font-size:14pt; + margin-left: 40px; +} +.logo { + margin-right: auto; + font-weight:bold; + font-size:20px; +} +.logo img { + height:28px; + vertical-align: middle; +} +@media screen and (min-width:960px) and (max-width:1280px) { +#header ul { + margin-left: -20; +} +.headermenuitem { + font-size:13pt; + margin-left: 20px; +} +} +@media screen and (min-width:760px) and (max-width:960px) { +#header ul { + margin-left: -10px; +} +.headermenuitem { + font-size:12pt; + margin-left: 10px; +} +} +@media screen and (min-width:380px) and (max-width:760px) { +.headermenuitem { + display:none; +} +} +@media screen and (max-width:380px) { +.headermenuitem { + display:none; +} +} + + +#main { + display: flex; + flex-flow: row wrap; + justify-content: center; + width:100%; +} +.container { + flex: 1 1 200px; + max-width: 500px; + margin: 10px; +} + +.box { + color: #97e2fc; + background-clip: padding-box; + background-color: rgba(38,53,63,0.80); + border: 1px solid transparent; + /*background-color: #151f25;*/ + margin: 10px auto; + text-align: left; + text-shadow: -1px -1px 0 rgba(0,0,0,0.66), 1px -1px 0 rgba(0,0,0,0.66), -1px 1px 0 rgba(0,0,0,0.66), 1px 1px 0 rgba(0,0,0,0.66); + /*min-width: 300px;*/ + /*max-width: 500px;*/ +} +.box:hover { + border: 1px solid #36ffff; +} +.box:hover h1 { + background: linear-gradient(45deg, rgba(47,153,193,1),rgba(46,94,137,1) 30%,rgba(46,94,137,1) 70%, rgba(47,153,193,1)); + +} +.box table { + border-spacing: 0; + color: white; + margin: 10px auto; + width: 95%; +} +.box tr { +/* background-image: url("tr_bg.png");*/ + background-repeat: no-repeat; + background-position: left bottom; + border-bottom: 1px solid rgba(128,128,128,0.5); +} +.box tr:last-child { + border-bottom: 0; +} +.box td { + padding: 0 5px; + +} +.box td:first-child { + color: #97e2fc; +} +.box td:last-child { + text-align: right; +} +.statsInfo td:nth-child(2) { + text-align: right; +} +.statsInfo td:last-child { + width: 45%; +} +.statsInfo span { + background-repeat: no-repeat; + background-position: left center; +} +.statsMelWeaponUp span { + background-image: url("./mel.png"); + padding: 0 0 0 21px; +} +.statsRngWeaponUp span { + background-image: url("./rng.png"); + padding: 0 0 0 21px; +} +.statsTecWeaponUp span { + background-image: url("./tec.png"); + padding: 0 0 0 21px; +} +.box h1 { + /* background-color: #495a61; */ + background-color: rgba(128,128,128,0.50); + color: white; + font-weight: normal; + font-size: 13pt; + margin-bottom: 10px; + padding: 13px 13px 7px 13px; + text-align: left; +} +.box h2 { + /* background-color: #495a61; */ + color: white; + font-weight: normal; + font-size: 18px; + /* margin-bottom: 20px; + padding: 10px; */ + margin: 0 auto 10px auto; + text-align: left; + width: 95%; +} +.box h2 img { + margin-right: 5px; + vertical-align: top; +} +.box h2:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.da { + color: white; + text-align: right; +} +.da span { + background-color: rgba(20,29,40,0.66); + padding: 5px; +} +.da span:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.basicInfo tr:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.infoBuffs { + margin: 0 auto; + width: 90%; +} +.infoBuffs:last-child { + margin-bottom: 10px; +} +.infobuffs li { + margin: 5px 0; +} +.infoBuffs li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.infoBuffs li ul { + width: 100%; +} +.infoBuffs li ul li { + width: 100%; + padding-left: 20px; +} +.infoBuffs li ul li:hover { + background: transparent; +} +.box p { + margin: 10px; +} +.box h3 { +/* background-image: url("tr_bg.png"); + background-repeat: no-repeat; + background-position: left bottom;*/ + font-size: 12pt; + font-weight: normal; + margin: 10px; + padding: 0 5px; + border-bottom: 1px solid rgba(128,128,128,0.5); +} +.we { + color: white; + display: flex; + flex-direction: row; + justify-content: center; + flex-wrap: wrap; +} +.we div { + background: linear-gradient(rgba(0,0,0,0) 15%,rgba(128,128,128,0.50) 15%); +/* background-image: url("we_bg.png"); + background-repeat:repeat-x; + background-position: left bottom;*/ + min-height: 128px; + max-width: 118px; + min-width: 100px; + width: 23%; + padding: 0 0 10px 0; + text-align: center; +} +.we div img { + margin-bottom: 10px; +} +.we div:hover { + background: linear-gradient(rgba(0,0,0,0) 15%,rgba(76,113,126,0.66) 15%,rgba(113,169,189,00.66)); +} +.we div h3 { + background-image: none; +/* background-image: url("tr_bg.png"); + background-repeat: no-repeat; + background-position: left bottom;*/ + color: #97e2fc; + font-size: 16px; + font-weight: normal; + margin: 0 0 10px 0; + padding: 0; +} +.de { + display: flex; + flex-direction: row; + justify-content: center; + flex-wrap: wrap; +} +.de div { +/* background: linear-gradient(rgba(0,0,0,0) 18%,rgba(128,128,128,0.50) 18%); + background-image: url("we_bg.png"); + background-repeat:repeat-x; + background-position: left bottom;*/ + max-width: 250px; + min-width: 100px; + width: 50%; + padding: 0; + margin: 0; + text-align: left; +} +.aug li { + background-color: rgba(128,128,128,0.50); + color: white; + margin: 0 0 5px 10px; + padding: 5px; +} +.aug li img { + vertical-align: middle; +} +.aug li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.pr li { + margin: 0 10px 2px 10px; + padding: 5px; +} +.pr li span { + color:white +} +.pr li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); +} +.ye { + color: #ffb74c; +} +.itemlist { + margin: 0 10px; +} +.itemlist li { + background-color: rgba(128,128,128,0.33); + color: white; + margin: 0 0 5px 0; + padding: 10px; + background-repeat: no-repeat; + background-position: right top; + background-origin: content-box;white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.itemlist li em { + /*background-color: rgba(38,53,63,0.33);*/ + + background-repeat: no-repeat; + background-position: left center; +} +.itemaug em { + background-image: url("./UINGSItemSpecialAbility.png"); + padding: 0 0 0 26px; +} +.itemwep { + font-size: 10pt; +} +.itemwep em { + font-size: 12pt; + line-height: 28px; + padding: 0 0 0 21px; +} +.rifle { + background-image: url("./NGSUIItemAssaultRifleMini.png"); +} +.gb { + background-image: url("./NGSUIItemGunbladeMini.png"); +} +.itemimg { + background: radial-gradient(rgb(196,196,196),rgb(128,128,128)); + border: 4px solid rgba(128,128,128,1); + float: left; + margin-right: 10px; + width: 48px; + box-sizing: content-box; +} +.r1 { + background-image: url("./NGSUIRarity1Star.png"); +} +.r1 .itemimg { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); +} +.r2 { + background-image: url("./NGSUIRarity2Star.png"); +} +.r2 .itemimg { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); +} +.r3 { + background-image: url("./NGSUIRarity3Star.png"); +} +.r3 .itemimg { + background: radial-gradient(rgb(64,150,183),rgb(52,123,150)); +} +.r4 { + background-image: url("./NGSUIRarity4Star.png"); +} +.r4 .itemimg { + background: radial-gradient(rgb(101,178,77),rgb(83,146,63)); +} +.itemlist li span { + background-repeat: no-repeat; + background-position: left center; + line-height: 28px; + padding: 0 23px; +} +.atk { + background-image: url("./NGSUIStatATKOutline.png"); + +} +.pot { + background-image: url("./NGSUIItemPotentialAbility.png"); + cursor: help; +} +.clear { + clear: both; +} +.itemlistcontainer { + height: 400px; + overflow-y: scroll; + margin: 0 5px 10px 0; +} +.itemlist li:hover, .treeList li:hover { + background-color: rgba(113,169,189,0.33); +} +.boxmenu { + font-size: 10pt; + margin: 10px; +} +.boxmenu li { + background-color: rgba(245, 245, 245,0.66); + color: white; + display: inline-block; + margin: 0; + min-width: 53px; + padding: 5px; + border-bottom: 4px solid rgba(245, 245, 245,0.66); + text-align: center; + background-clip: padding-box; +} +.boxmenu img { + vertical-align: middle; +} +.boxmenu li:first-child { + background: linear-gradient(135deg,#60461b,#b0a34e); + border-bottom: 4px solid #ffd602; +} +.boxmenu li:hover { + background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66)); + border-bottom: 0; + padding-bottom: 9px; +} +.itembar { + margin: 10px; +} +input { + background-color: #101317; + border: 2px solid transparent; + color: white; + font-family: ngs,sans-serif; + font-size: 11pt; + height: 28px; + padding: 0 5px; + text-shadow: -1px -1px 0 rgba(0,0,0,0.66), 1px -1px 0 rgba(0,0,0,0.66), -1px 1px 0 rgba(0,0,0,0.66), 1px 1px 0 rgba(0,0,0,0.66); +} +input:hover { + border: 2px solid #30cdef; +} +select{ + background-color: rgba(128,128,128,0.5); + color: white; + font-family: ngs,sans-serif; + font-size: 11pt; + height: 28px; + padding: 5px 10px; + text-shadow: -1px -1px 0 rgba(0,0,0,0.66), 1px -1px 0 rgba(0,0,0,0.66), -1px 1px 0 rgba(0,0,0,0.66), 1px 1px 0 rgba(0,0,0,0.66); +} +select.sortFilter { + width: 40%; + margin-right: 10px; +} +.sortFilter { + width: 40%; +} +option { + background-color: rgb(128,128,128); +} +.exitBox { + float: right; + cursor: pointer; +} +.exitBox:after { + clear: both; +} +/*.itembox:hover { + border: 1px solid #36ffff; +}*/ +.exit { + color: white; +} +/* width */ +.customScrollbar::-webkit-scrollbar { + width: 4px; +} + +/* Track */ +.customScrollbar::-webkit-scrollbar-track { + background: rgba(128,128,128,0.8); +} + +/* Handle */ +.customScrollbar::-webkit-scrollbar-thumb { + background-color: rgba(245, 245, 245,0.66); +} +.customScrollbar::-webkit-scrollbar-button { + background-color: rgba(162,162,162,0.8); + height:4px; + width:4px; +} +/* Handle on hover +::-webkit-scrollbar-thumb:hover { + background: #555; +}*/ +.containerB { + flex: 1 1 auto; + max-width: 250px; + margin: 10px; +} +.containerC { + flex: 1 1 auto; + min-width: 370px; + max-width: 1050px; + margin: 10px; +} +.treeListContainer { + max-height: 400px; + overflow-y: auto; + margin: 0 0 10px 0; +} +.treeList { + margin: 0 10px; +} +.treelist li { + background-color: rgba(128,128,128,0.33); + color: white; + margin: 0 0 5px 0; + padding: 10px; + background-repeat: no-repeat; + background-position: right top; + background-origin: content-box;white-space: nowrap; +} +.treeList li em { + +} +.skillTreeBox { + +} +.skillTreeContainer { + height: 650px; + overflow-y: scroll; + margin: 10px 5px 10px 10px; + display: flex; + flex-flow: row wrap; +} +.skillTreeColumn { + flex: 0 1 171px; +} +.skillItem:hover { + /*background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66));*/ + background-color: rgba(113,169,189,0.33); + +} +.skillBlank { + color: white; + padding: 6px; + margin-right: 10px; + margin-bottom: 96px; + text-align: center; + min-height: 148px; +} +.skillItem { + background-color: rgba(128,128,128,0.33); + color: white; + padding: 6px; + margin-right: 10px; + margin-bottom: 96px; + /*background-repeat: no-repeat; + background-position: right top; + background-origin: content-box;*/ + text-align: center; + min-height: 148px; +} +.skillPushRight { + margin-left: auto; +} +.skillIcon { + display: block; + margin: 0 auto; + width: +} +.skillAllocated { + line-height: 40px; +} +.skillName { + background-color: rgba(64,64,64,0.5); + display: block; + padding: 10px; + height: 48px; + text-align: left; +} +.skillPoints { + background-color: rgba(64,64,64,0.5); + text-align: center; + margin: 10px; + padding: 16px 0 10px 0; + color: white; + font-size: 14pt; +} \ No newline at end of file diff --git a/public/ngsp/tec.png b/public/ngsp/tec.png new file mode 100644 index 0000000..8581141 Binary files /dev/null and b/public/ngsp/tec.png differ diff --git a/public/ngsp/tr_bg.png b/public/ngsp/tr_bg.png new file mode 100644 index 0000000..e47b73e Binary files /dev/null and b/public/ngsp/tr_bg.png differ diff --git a/public/ngsp/ui_item_2010908.png b/public/ngsp/ui_item_2010908.png new file mode 100644 index 0000000..258fd28 Binary files /dev/null and b/public/ngsp/ui_item_2010908.png differ diff --git a/public/ngsp/we_bg.png b/public/ngsp/we_bg.png new file mode 100644 index 0000000..c00efac Binary files /dev/null and b/public/ngsp/we_bg.png differ