joshua/bl3skills.com
1
0
Fork 0
mirror of https://github.com/seigler/bl3skills.com synced 2025-07-27 01:36:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Adding Styling For 4th Tree and Default State

Browse source
This commit is contained in:
Anthony Jung 2020-11-17 13:06:36 -08:00
parent 303de17ff5
commit 9e66cd16f2
3 changed files with 13 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/components/Skill/index.css
View file

@ -3,8 +3,8 @@
flex: 0 1 auto;
margin: 0.5rem;
padding: 0rem;
height: 2.5rem;
width: 2.5rem;
height: 2rem;
width: 2rem;
line-height: 1;
display: flex;
text-align: center;
@ -80,12 +80,13 @@
.augment, .actionSkill {
margin: 0;
padding: 0.5rem;
height: 3.5em;
width: 3.5em;
height: 3em;
width: 3em;
}
.augment {
background-color: var(--themeColor);
z-index: 0;
}
.augment:first-child {
@ -111,7 +112,7 @@
mix-blend-mode: luminosity;
}
.image > img {
width: 2.3em;
width: 1.8em;
opacity: 0.5;
}

9
src/components/VaultHunter/index.css
View file

@ -100,7 +100,7 @@
display: flex;
flex-direction: column;
margin: 1rem;
padding: 0 3.5rem;
padding: 0 3rem;
background-image: linear-gradient(0deg, var(--themeColor), var(--themeColor));
background-size: 100% calc(100% - 1.5rem);
background-repeat: no-repeat;
@ -112,11 +112,12 @@
.skills {
position: relative;
user-select: none;
height: calc(3.5rem * 7)
height: calc(3rem * 7)
}
.skills:before {
--gradientStop: calc(var(--invested)* 0.7rem + 3.5rem + 1.65rem);
/* --gradientStop: calc(var(--invested)* 0.7rem + 3.5rem + 1.65rem); */
--gradientStop: calc(var(--invested)* 0.6rem + 3rem + 1rem);
content: '';
position: absolute;
top: 1.85rem;
@ -133,7 +134,7 @@
}
.tier {
width: calc(3.5rem * 3 + 0.5em);
width: calc(3.5rem * 3);
justify-content: center;
position: relative;
}

4
src/components/VaultHunter/index.js
View file

@ -17,7 +17,7 @@ export default class VaultHunter extends Component {
constructor (props) {
super(props);
this.state = {
invested: [0, 0, 0],
invested: [0, 0, 0, 0],
skills: props.skills || {},
};
}
@ -52,7 +52,7 @@ export default class VaultHunter extends Component {
const resetSkills = () => {
setHash(initialSkills);
this.setState({
invested: [0, 0, 0],
invested: [0, 0, 0, 0],
skills: initialSkills || {},
});
};