PolyPaw/habitica-sync
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

CSS changes for buttons, fixed numbers in stats

Browse source
This commit is contained in:
SuperChamp234 2022-01-15 09:23:35 +05:30
parent e4d3c78a9f
commit 82780ba589
3 changed files with 14 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/view/App.tsx
View file

@ -34,6 +34,7 @@ class App extends React.Component<any, any> {
stats: {
hp: 0,
lvl: 0,
gold: 0,
},
lastCron: "",
},

7
src/view/Components/Statsview/index.tsx
View file

@ -4,9 +4,12 @@ export default function Index(props: any) {
return(
<div className="stats">
{/* <div id="profile-name">{props.user_data.profile.name}</div> */}
<div className = "substats" id="hp">HP: {(props.user_data.stats.hp).toPrecision(3)}</div>
<div className = "substats" id="hp">HP: {numberWithCommas((props.user_data.stats.hp).toFixed(0))}</div>
<div className = "substats" id="lvl">LEVEL: {props.user_data.stats.lvl}</div>
<div className = "substats" id="gold">GOLD: {(props.user_data.stats.gp).toPrecision(3)}</div>
<div className = "substats" id="gold">GOLD: {numberWithCommas(props.user_data.stats.gp.toFixed(2))}</div>
</div>
);
}
function numberWithCommas(x: any) {
return x.toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
}

10
styles.css
View file

@ -67,7 +67,7 @@ p {
}
.habit-button {
/* background-color: #fff; */
background-color: var(--interactive-accent);
border: none;
/* color: black; */
text-align: center;
@ -75,6 +75,12 @@ p {
font-size: 16px;
display: block;
width: 100%;
color: var(--text-on-accent);
}
/* habit-button on hover css selector */
.habit-button:hover {
color: var(--text-on-accent);
background-color: var(--interactive-accent-hover);
}
.habit-item {
@ -300,7 +306,7 @@ button {
margin-bottom: 5px;
white-space: nowrap;
padding: 5px 5px;
color: var(--interactive-accent);
background-color: var(--interactive-accent);
margin-right: auto;
}