granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix star styles

Browse source
This commit is contained in:
Justin Edmund 2023-06-23 19:49:15 -07:00
parent ab98089f81
commit 8f124c0f9a
6 changed files with 41 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
components/uncap/TranscendenceStar/index.module.scss
View file

@ -1,4 +1,4 @@
.TranscendenceStar { .star {
$size: 18px; $size: 18px;
position: relative; position: relative;
@ -6,35 +6,35 @@
transform: scale(1.2); transform: scale(1.2);
} }
&.Immutable { &.immutable {
pointer-events: none; pointer-events: none;
} }
&.Empty { &.empty {
@include hidpiImage('/icons/transcendence/0/stage-0', png, $size, $size); @include hidpiImage('/icons/transcendence/0/stage-0', png, $size, $size);
} }
&.Stage1 { &.stage1 {
@include hidpiImage('/icons/transcendence/1/stage-1', png, $size, $size); @include hidpiImage('/icons/transcendence/1/stage-1', png, $size, $size);
} }
&.Stage2 { &.stage2 {
@include hidpiImage('/icons/transcendence/2/stage-2', png, $size, $size); @include hidpiImage('/icons/transcendence/2/stage-2', png, $size, $size);
} }
&.Stage3 { &.stage3 {
@include hidpiImage('/icons/transcendence/3/stage-3', png, $size, $size); @include hidpiImage('/icons/transcendence/3/stage-3', png, $size, $size);
} }
&.Stage4 { &.stage4 {
@include hidpiImage('/icons/transcendence/4/stage-4', png, $size, $size); @include hidpiImage('/icons/transcendence/4/stage-4', png, $size, $size);
} }
&.Stage5 { &.stage5 {
@include hidpiImage('/icons/transcendence/5/stage-5', png, $size, $size); @include hidpiImage('/icons/transcendence/5/stage-5', png, $size, $size);
} }
.Figure { .figure {
$size: 18px; $size: 18px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 54px 54px; background-size: 54px 54px;
@ -42,7 +42,7 @@
height: $size; height: $size;
width: $size; width: $size;
&.Interactive.Base { &.interactive.base {
$size: $unit-6x; $size: $unit-6x;
@include hidpiImage( @include hidpiImage(

18
components/uncap/TranscendenceStar/index.tsx
View file

@ -36,18 +36,18 @@ const TranscendenceStar = ({
// Classes // Classes
const starClasses = classnames({ const starClasses = classnames({
TranscendenceStar: true, [styles.star]: true,
Immutable: immutable, [styles.immutable]: immutable,
Empty: stage === 0, [styles.empty]: stage === 0,
Stage1: stage === 1, [styles.stage1]: stage === 1,
Stage2: stage === 2, [styles.stage2]: stage === 2,
Stage3: stage === 3, [styles.stage3]: stage === 3,
Stage4: stage === 4, [styles.stage4]: stage === 4,
Stage5: stage === 5, [styles.stage5]: stage === 5,
}) })
const baseImageClasses = classnames(className, { const baseImageClasses = classnames(className, {
Figure: true, [styles.figure]: true,
}) })
useEffect(() => { useEffect(() => {

6
components/uncap/UncapIndicator/index.module.scss
View file

@ -1,8 +1,7 @@
.UncapWrapper { .wrapper {
position: relative; position: relative;
}
.UncapIndicator { .indicator {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-content: center; align-content: center;
@ -16,3 +15,4 @@
cursor: pointer; cursor: pointer;
} }
} }
}

4
components/uncap/UncapIndicator/index.tsx
View file

@ -150,8 +150,8 @@ const UncapIndicator = (props: Props) => {
} }
return ( return (
<div className="UncapWrapper"> <div className={styles.wrapper}>
<ul className="UncapIndicator"> <ul className={styles.indicator}>
{Array.from(Array(numStars)).map((x, i) => { {Array.from(Array(numStars)).map((x, i) => {
if (props.type === 'character' && i > 4) { if (props.type === 'character' && i > 4) {
if (props.special) return ulb(i) if (props.special) return ulb(i)

2
components/uncap/UncapStar/index.module.scss
View file

@ -1,4 +1,4 @@
.UncapStar { .star {
$size: 18px; $size: 18px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: $size; background-size: $size;

12
components/uncap/UncapStar/index.tsx
View file

@ -18,12 +18,12 @@ interface Props
const UncapStar = (props: Props) => { const UncapStar = (props: Props) => {
const classes = classnames({ const classes = classnames({
UncapStar: true, [styles.star]: true,
empty: props.empty, [styles.empty]: props.empty,
special: props.special, [styles.special]: props.special,
mlb: !props.special, [styles.mlb]: !props.special,
flb: props.flb, [styles.flb]: props.flb,
ulb: props.ulb, [styles.ulb]: props.ulb,
}) })
function clicked() { function clicked() {