ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ethan icons

Browse Source
This commit is contained in:
ntr 2020-01-22 12:26:23 +10:00
parent adff7ebefa
commit 4b6e4544f1
3 changed files with 91 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
client/assets/styles/colours.less
View File

@ -33,6 +33,25 @@ svg {
}
}
// icons from ethan are fills not strokes
svg.ethan-icon {
fill: @white;
stroke: none;
.red {
fill: @red;
}
.green {
fill: @green;
}
.blue {
fill: @blue;
}
}
.green {
color: @green;
stroke: @green;

1
client/assets/styles/styles.less
View File

@ -271,7 +271,6 @@ figure.gray {
.stats svg, .specs svg {
height: 2em;
fill: none;
}
.credits {

139
client/src/components/shapes.jsx
View File

@ -11,6 +11,10 @@ const triangle = require('./svgs/triangle');
// const vboxColour = require('./svgs/colour');
const vboxColour = require('./svgs/vbox.colour');
const speed = require('./svgs/speed');
const power = require('./svgs/power');
const life = require('./svgs/life');
module.exports = {
circle,
diamond,
@ -19,6 +23,7 @@ module.exports = {
square,
squircle,
triangle,
speed,
saw,
vboxColour,
@ -27,17 +32,17 @@ module.exports = {
Blue: () => vboxColour('blue'),
// stats
RedLife: () => square(['red']),
GreenLife: () => square(['green']),
BlueLife: () => square(['blue']),
RedPower: () => circle(['red']),
GreenPower: () => circle(['green']),
BluePower: () => circle(['blue']),
SpeedStat: () => triangle(['white']),
RedLife: () => life(['red']),
GreenLife: () => life(['green']),
BlueLife: () => life(['blue']),
RedPower: () => power(['red']),
GreenPower: () => power(['green']),
BluePower: () => power(['blue']),
SpeedStat: () => speed(['white']),
POWER: () => circle(['white']),
LIFE: () => square(['white']),
SPEED: () => triangle(['white']),
POWER: () => power(['white']),
LIFE: () => life(['white']),
SPEED: () => speed(['white']),
// specs
// Base
@ -50,343 +55,343 @@ module.exports = {
Power: () =>
<figure>
{circle(['white'])}
{power(['white'])}
<figcaption>Power</figcaption>
</figure>,
Life: () =>
<figure>
{square(['white'])}
{life(['white'])}
<figcaption>Life</figcaption>
</figure>,
Speed: () =>
<figure>
{triangle(['white'])}
{speed(['white'])}
<figcaption>Speed</figcaption>
</figure>,
// Lifes Upgrades
LifeGG: () =>
<figure>
{square(['green'])}
{life(['green'])}
<figcaption>Life</figcaption>
</figure>,
LifeRR: () =>
<figure>
{square(['red'])}
{life(['red'])}
<figcaption>Life</figcaption>
</figure>,
LifeBB:() =>
<figure>
{square(['blue'])}
{life(['blue'])}
<figcaption>Life</figcaption>
</figure>,
LifeRG: () =>
<figure>
{square(['red', 'green'])}
{life(['red', 'green'])}
<figcaption>Life</figcaption>
</figure>,
LifeGB: () =>
<figure>
{square(['green', 'blue'])}
{life(['green', 'blue'])}
<figcaption>Life</figcaption>
</figure>,
LifeRB:() =>
<figure>
{square(['red', 'blue'])}
{life(['red', 'blue'])}
<figcaption>Life</figcaption>
</figure>,
LifeGGPlus: () =>
<figure>
{square(['green'])}
{life(['green'])}
<figcaption>Life+</figcaption>
</figure>,
LifeRRPlus: () =>
<figure>
{square(['red'])}
{life(['red'])}
<figcaption>Life+</figcaption>
</figure>,
LifeBBPlus:() =>
<figure>
{square(['blue'])}
{life(['blue'])}
<figcaption>Life+</figcaption>
</figure>,
LifeRGPlus: () =>
<figure>
{square(['red', 'green'])}
{life(['red', 'green'])}
<figcaption>Life+</figcaption>
</figure>,
LifeGBPlus: () =>
<figure>
{square(['green', 'blue'])}
{life(['green', 'blue'])}
<figcaption>Life+</figcaption>
</figure>,
LifeRBPlus:() =>
<figure>
{square(['red', 'blue'])}
{life(['red', 'blue'])}
<figcaption>Life+</figcaption>
</figure>,
LifeGGPlusPlus: () =>
<figure>
{square(['green'])}
{life(['green'])}
<figcaption>Life++</figcaption>
</figure>,
LifeRRPlusPlus: () =>
<figure>
{square(['red'])}
{life(['red'])}
<figcaption>Life++</figcaption>
</figure>,
LifeBBPlusPlus:() =>
<figure>
{square(['blue'])}
{life(['blue'])}
<figcaption>Life++</figcaption>
</figure>,
LifeRGPlusPlus: () =>
<figure>
{square(['red', 'green'])}
{life(['red', 'green'])}
<figcaption>Life++</figcaption>
</figure>,
LifeGBPlusPlus: () =>
<figure>
{square(['green', 'blue'])}
{life(['green', 'blue'])}
<figcaption>Life++</figcaption>
</figure>,
LifeRBPlusPlus:() =>
<figure>
{square(['red', 'blue'])}
{life(['red', 'blue'])}
<figcaption>Life++</figcaption>
</figure>,
// Powers Upgrades
PowerGG: () =>
<figure>
{circle(['green'])}
{power(['green'])}
<figcaption>Power</figcaption>
</figure>,
PowerRR: () =>
<figure>
{circle(['red'])}
{power(['red'])}
<figcaption>Power</figcaption>
</figure>,
PowerBB:() =>
<figure>
{circle(['blue'])}
{power(['blue'])}
<figcaption>Power</figcaption>
</figure>,
PowerRG: () =>
<figure>
{circle(['red', 'green'])}
{power(['red', 'green'])}
<figcaption>Power</figcaption>
</figure>,
PowerGB: () =>
<figure>
{circle(['green', 'blue'])}
{power(['green', 'blue'])}
<figcaption>Power</figcaption>
</figure>,
PowerRB:() =>
<figure>
{circle(['red', 'blue'])}
{power(['red', 'blue'])}
<figcaption>Power</figcaption>
</figure>,
PowerGGPlus: () =>
<figure>
{circle(['green'])}
{power(['green'])}
<figcaption>Power+</figcaption>
</figure>,
PowerRRPlus: () =>
<figure>
{circle(['red'])}
{power(['red'])}
<figcaption>Power+</figcaption>
</figure>,
PowerBBPlus:() =>
<figure>
{circle(['blue'])}
{power(['blue'])}
<figcaption>Power+</figcaption>
</figure>,
PowerRGPlus: () =>
<figure>
{circle(['red', 'green'])}
{power(['red', 'green'])}
<figcaption>Power+</figcaption>
</figure>,
PowerGBPlus: () =>
<figure>
{circle(['green', 'blue'])}
{power(['green', 'blue'])}
<figcaption>Power+</figcaption>
</figure>,
PowerRBPlus:() =>
<figure>
{circle(['red', 'blue'])}
{power(['red', 'blue'])}
<figcaption>Power+</figcaption>
</figure>,
PowerGGPlusPlus: () =>
<figure>
{circle(['green'])}
{power(['green'])}
<figcaption>Power++</figcaption>
</figure>,
PowerRRPlusPlus: () =>
<figure>
{circle(['red'])}
{power(['red'])}
<figcaption>Power++</figcaption>
</figure>,
PowerBBPlusPlus:() =>
<figure>
{circle(['blue'])}
{power(['blue'])}
<figcaption>Power++</figcaption>
</figure>,
PowerRGPlusPlus: () =>
<figure>
{circle(['red', 'green'])}
{power(['red', 'green'])}
<figcaption>Power++</figcaption>
</figure>,
PowerGBPlusPlus: () =>
<figure>
{circle(['green', 'blue'])}
{power(['green', 'blue'])}
<figcaption>Power++</figcaption>
</figure>,
PowerRBPlusPlus:() =>
<figure>
{circle(['red', 'blue'])}
{power(['red', 'blue'])}
<figcaption>Power++</figcaption>
</figure>,
// Speeds Upgrades
SpeedGG: () =>
<figure>
{triangle(['green'])}
{speed(['green'])}
<figcaption>Speed</figcaption>
</figure>,
SpeedRR: () =>
<figure>
{triangle(['red'])}
{speed(['red'])}
<figcaption>Speed</figcaption>
</figure>,
SpeedBB:() =>
<figure>
{triangle(['blue'])}
{speed(['blue'])}
<figcaption>Speed</figcaption>
</figure>,
SpeedRG: () =>
<figure>
{triangle(['red', 'green'])}
{speed(['red', 'green'])}
<figcaption>Speed</figcaption>
</figure>,
SpeedGB: () =>
<figure>
{triangle(['green', 'blue'])}
{speed(['green', 'blue'])}
<figcaption>Speed</figcaption>
</figure>,
SpeedRB:() =>
<figure>
{triangle(['red', 'blue'])}
{speed(['red', 'blue'])}
<figcaption>Speed</figcaption>
</figure>,
SpeedGGPlus: () =>
<figure>
{triangle(['green'])}
{speed(['green'])}
<figcaption>Speed+</figcaption>
</figure>,
SpeedRRPlus: () =>
<figure>
{triangle(['red'])}
{speed(['red'])}
<figcaption>Speed+</figcaption>
</figure>,
SpeedBBPlus:() =>
<figure>
{triangle(['blue'])}
{speed(['blue'])}
<figcaption>Speed+</figcaption>
</figure>,
SpeedRGPlus: () =>
<figure>
{triangle(['red', 'green'])}
{speed(['red', 'green'])}
<figcaption>Speed+</figcaption>
</figure>,
SpeedGBPlus: () =>
<figure>
{triangle(['green', 'blue'])}
{speed(['green', 'blue'])}
<figcaption>Speed+</figcaption>
</figure>,
SpeedRBPlus:() =>
<figure>
{triangle(['red', 'blue'])}
{speed(['red', 'blue'])}
<figcaption>Speed+</figcaption>
</figure>,
SpeedGGPlusPlus: () =>
<figure>
{triangle(['green'])}
{speed(['green'])}
<figcaption>Speed++</figcaption>
</figure>,
SpeedRRPlusPlus: () =>
<figure>
{triangle(['red'])}
{speed(['red'])}
<figcaption>Speed++</figcaption>
</figure>,
SpeedBBPlusPlus:() =>
<figure>
{triangle(['blue'])}
{speed(['blue'])}
<figcaption>Speed++</figcaption>
</figure>,
SpeedRGPlusPlus: () =>
<figure>
{triangle(['red', 'green'])}
{speed(['red', 'green'])}
<figcaption>Speed++</figcaption>
</figure>,
SpeedGBPlusPlus: () =>
<figure>
{triangle(['green', 'blue'])}
{speed(['green', 'blue'])}
<figcaption>Speed++</figcaption>
</figure>,
SpeedRBPlusPlus:() =>
<figure>
{triangle(['red', 'blue'])}
{speed(['red', 'blue'])}
<figcaption>Speed++</figcaption>
</figure>,
};