Skip to content

Commit b73cd36

Browse files
bz-hashtag-0780bz-hashtag-0780
committed
Breeding updates
1 parent f312fd0 commit b73cd36

File tree

10 files changed

+117
-106
lines changed

10 files changed

+117
-106
lines changed

‎components/ui/BeastModalView/BeastModalView.tsx‎

Lines changed: 37 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -153,8 +153,6 @@ const Content = styled.div<any>`
153153
154154
width: 576px;
155155
156-
overflow-y: auto;
157-
158156
background: #fff;
159157
padding: 3vw;
160158
font-size: 1.2em;
@@ -168,7 +166,7 @@ const Content = styled.div<any>`
168166
const Img = styled.img`
169167
width: 160px;
170168
margin: auto;
171-
top: -60px;
169+
top: -70px;
172170
position: relative;
173171
user-drag: none;
174172
-webkit-user-drag: none;
@@ -415,9 +413,10 @@ const Select = styled.select`
415413
width: 100%;
416414
// border: 1px solid rgb(209 213 219);
417415
&:focus {
418-
--tw-ring-color: rgb(99 102 241);
416+
// --tw-ring-color: rgb(99 102 241);
419417
border-color: rgb(99 102 241);
420418
}
419+
outline: none;
421420
`
422421

423422
const Button = styled.button`
@@ -479,6 +478,9 @@ type Props = {
479478
allEvolutionPairs: any
480479
getPersonalDexicon: any
481480
walletAddress: any
481+
sushiBalance: any
482+
emptyPotionBottleBalance: any
483+
poopBalance: any
482484
}
483485

484486
const tabs = [
@@ -505,6 +507,9 @@ const BeastModalView: FC<Props> = ({
505507
allEvolutionPairs,
506508
getPersonalDexicon,
507509
walletAddress,
510+
sushiBalance,
511+
emptyPotionBottleBalance,
512+
poopBalance,
508513
}) => {
509514
const [open2, setOpen2] = useState(false)
510515
const [filter, setFilter] = useState("Info")
@@ -715,6 +720,9 @@ const BeastModalView: FC<Props> = ({
715720
<MakeLovePotionModal
716721
open={makeLovePotionModalOpen}
717722
setOpen={setMakeLovePotionModalOpen}
723+
sushiBalance={sushiBalance}
724+
emptyPotionBottleBalance={emptyPotionBottleBalance}
725+
poopBalance={poopBalance}
718726
/>
719727

720728
<EggObtainedModal
@@ -1131,39 +1139,32 @@ const BeastModalView: FC<Props> = ({
11311139
<></>
11321140
)}
11331141
{filter === "Breeding" ? (
1134-
// <Breeding
1135-
// evolvableBeasts={evolvableBeasts}
1136-
// beast={beast}
1137-
// makeLovePotionModalOpen={makeLovePotionModalOpen}
1138-
// setMakeLovePotionModalOpen={
1139-
// setMakeLovePotionModalOpen
1140-
// }
1141-
// eggObtainedModalOpen={eggObtainedModalOpen}
1142-
// setEggObtainedModalOpen={setEggObtainedModalOpen}
1143-
// />
1144-
<NotEnoughContainer>
1145-
<Body
1146-
style={{
1147-
margin: "0px 0 20px",
1148-
textAlign: "center",
1149-
fontSize: "1em",
1150-
}}
1151-
>
1152-
Coming soon
1153-
</Body>
1154-
</NotEnoughContainer>
1142+
<Breeding
1143+
evolvableBeasts={evolvableBeasts}
1144+
beast={beast}
1145+
makeLovePotionModalOpen={makeLovePotionModalOpen}
1146+
setMakeLovePotionModalOpen={
1147+
setMakeLovePotionModalOpen
1148+
}
1149+
eggObtainedModalOpen={eggObtainedModalOpen}
1150+
setEggObtainedModalOpen={setEggObtainedModalOpen}
1151+
sushiBalance={sushiBalance}
1152+
emptyPotionBottleBalance={emptyPotionBottleBalance}
1153+
poopBalance={poopBalance}
1154+
/>
11551155
) : (
1156-
<NotEnoughContainer>
1157-
<Body
1158-
style={{
1159-
margin: "0px 0 20px",
1160-
textAlign: "center",
1161-
fontSize: "1em",
1162-
}}
1163-
>
1164-
Coming soon
1165-
</Body>
1166-
</NotEnoughContainer>
1156+
// <NotEnoughContainer>
1157+
// <Body
1158+
// style={{
1159+
// margin: "0px 0 20px",
1160+
// textAlign: "center",
1161+
// fontSize: "1em",
1162+
// }}
1163+
// >
1164+
// Coming soon
1165+
// </Body>
1166+
// </NotEnoughContainer>
1167+
<></>
11671168
)}
11681169
{filter === "Trade" && (
11691170
<NotEnoughContainer>

‎components/ui/BeastTab/BeastTab.tsx‎

Lines changed: 9 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -516,29 +516,9 @@ type Props = {
516516
allEvolutionPairs: any
517517
getPersonalDexicon: any
518518
walletAddress: any
519-
}
520-
521-
type Beast = {
522-
beastTemplateID: number
523-
generation: number
524-
dexNumber: number
525-
name: String
526-
description: String
527-
image: String
528-
imageTransparentBg: String
529-
animationUrl: String
530-
externalUrl: String
531-
rarity: String
532-
skin: String
533-
starLevel: number
534-
asexual: boolean
535-
breedableBeastTemplateID: number
536-
maxAdminMintAllowed: number
537-
ultimateSkill: String
538-
basicSkills: String[]
539-
elements: String[]
540-
data: any
541-
id: any
519+
sushiBalance: any
520+
emptyPotionBottleBalance: any
521+
poopBalance: any
542522
}
543523

544524
const BeastTab: FC<Props> = ({
@@ -549,6 +529,9 @@ const BeastTab: FC<Props> = ({
549529
allEvolutionPairs,
550530
getPersonalDexicon,
551531
walletAddress,
532+
sushiBalance,
533+
emptyPotionBottleBalance,
534+
poopBalance,
552535
}) => {
553536
// const query = useQuery()
554537
// const beasts =
@@ -672,6 +655,9 @@ const BeastTab: FC<Props> = ({
672655
allEvolutionPairs={allEvolutionPairs}
673656
getPersonalDexicon={getPersonalDexicon}
674657
walletAddress={walletAddress}
658+
sushiBalance={sushiBalance}
659+
emptyPotionBottleBalance={emptyPotionBottleBalance}
660+
poopBalance={poopBalance}
675661
/>
676662
<EvolutionModal
677663
handleClose={() => setEvolutionModalOpen(false)}

‎components/ui/Breeding/Breeding.tsx‎

Lines changed: 38 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -9,20 +9,22 @@ import { faHeart } from "@fortawesome/free-solid-svg-icons"
99

1010
import picture from "public/beasts/001_normal.png"
1111
import scroll from "public/beasts/001_unknown.png"
12-
import potion from "/public/love_potion.png"
12+
import potion from "/public/love_potion.gif"
1313
import { toast } from "react-toastify"
1414
import MakeLovePotionModal from "../MakeLovePotionModal"
1515
import EggObtainedModal from "../EggObtainedModal"
1616
import beastTemplates from "data/beastTemplates"
1717

18-
const Wrapper = styled.section`
18+
const Wrapper = styled.div`
1919
display: flex;
2020
flex-direction: column;
2121
justify-content: space-between;
2222
align-items: center;
2323
// height: 100%;
2424
padding-bottom: 2rem;
2525
margin-top: 1rem;
26+
height: 300px;
27+
// overflow-y: auto;
2628
`
2729
const H2 = styled.h2`
2830
color: grey;
@@ -38,6 +40,7 @@ const BreedingSpot = styled.div`
3840
`
3941
const Img = styled.img`
4042
max-width: 10rem;
43+
margin-bottom: 10px;
4144
`
4245
const ImgDiv = styled.div`
4346
text-align: center;
@@ -47,6 +50,7 @@ const PotionDiv = styled.div`
4750
cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAzElEQVRYR+2X0Q6AIAhF5f8/2jYXZkwEjNSVvVUjDpcrGgT7FUkI2D9xRfQETwNIiWO85wfINfQUEyxBG2ArsLwC0jioGt5zFcwF4OYDPi/mBYKm4t0U8ATgRm3ThFoAqkhNgWkA0jJLvaOVSs7j3qMnSgXWBMiWPXe94QqMBMBc1VZIvaTu5u5pQewq0EqNZvIEMCmxAawK0DNkay9QmfFNAJUXfgGgUkLaE7j/h8fnASkxHTz0DGIBMCnBeeM7AArpUd3mz2x3C7wADglA8BcWMZhZAAAAAElFTkSuQmCC)
4851
14 0,
4952
pointer !important;
53+
margin-top: 30px;
5054
`
5155
const Potion = styled.div`
5256
position: relative;
@@ -65,8 +69,8 @@ const Potion = styled.div`
6569
display: block;
6670
position: absolute;
6771
top: 50%;
68-
left: -51%;
69-
width: 3.5rem;
72+
left: -31%;
73+
width: 1.5rem;
7074
height: 1px;
7175
background: #ebebe9;
7276
}
@@ -75,8 +79,8 @@ const Potion = styled.div`
7579
display: block;
7680
position: absolute;
7781
top: 50%;
78-
right: -51%;
79-
width: 3.5rem;
82+
right: -31%;
83+
width: 1.5rem;
8084
height: 1px;
8185
background: #ebebe9;
8286
}
@@ -93,18 +97,18 @@ const PotionP = styled.p`
9397
font-size: 1rem;
9498
`
9599
const RequiredNumber = styled.span`
96-
color: #dc8494;
100+
// color: #dc8494;
97101
`
98102
const BreedButton = styled.button<any>`
99103
position: relative;
100104
border: 1px solid ${(props) => props.buttonColors.buttonBorder};
101105
border-radius: 0.25rem;
102-
padding: 0.5rem 1rem;
106+
padding: 1.5rem;
103107
width: max-content;
104108
line-height: 0;
105109
background: ${(props) => props.buttonColors.buttonBackground};
106110
color: ${(props) => props.buttonColors.buttonColor};
107-
font-size: 1rem;
111+
font-size: 1.5em;
108112
&::before {
109113
content: "";
110114
display: block;
@@ -119,8 +123,8 @@ const BreedButton = styled.button<any>`
119123

120124
const ListWrapper = styled.div`
121125
width: 100%;
122-
overflow: hidden;
123-
overflow-y: scroll;
126+
// overflow: hidden;
127+
// overflow-y: scroll;
124128
// height: 270px;
125129
margin-top: 15px;
126130
-ms-overflow-style: none; /* IE and Edge */
@@ -139,6 +143,9 @@ type Props = {
139143
setMakeLovePotionModalOpen: any
140144
eggObtainedModalOpen: any
141145
setEggObtainedModalOpen: any
146+
sushiBalance: any
147+
emptyPotionBottleBalance: any
148+
poopBalance: any
142149
}
143150

144151
const Breeding: FC<Props> = ({
@@ -148,20 +155,23 @@ const Breeding: FC<Props> = ({
148155
setMakeLovePotionModalOpen,
149156
eggObtainedModalOpen,
150157
setEggObtainedModalOpen,
158+
sushiBalance,
159+
emptyPotionBottleBalance,
160+
poopBalance,
151161
}) => {
152162
const [beastSelected, setBeastSelected] = useState(false)
153163

154164
const [selectedBeasts, setSelectedBeasts] = useState<any>([])
155165
const [serialOneSelected, setSerialOneSelected] = useState<any>(false)
156166

157-
const potions = 200
167+
const potions = 1
158168

159169
const buttonColors = () => {
160170
let buttonBorder
161171
let buttonColor
162172
let buttonBackground
163173
{
164-
potions >= 200 && beastSelected == true
174+
false
165175
? ((buttonBorder = "#d97586"),
166176
(buttonColor = "#d97586"),
167177
(buttonBackground = "#facdd7"))
@@ -223,19 +233,19 @@ const Breeding: FC<Props> = ({
223233
beast?.beastTemplateID as keyof typeof beastTemplates
224234
].imageTransparentBg
225235
}
226-
style={{ transform: "scaleX(-1)" }}
236+
// style={{ transform: "scaleX(-1)" }}
227237
/>{" "}
228238
<ImgInfo>
229-
<H2>BREED COUNT</H2>
230-
<p>1/7</p>
239+
<H2>Breed Count</H2>
240+
<p>1/6</p>
231241
</ImgInfo>
232242
</ImgDiv>
233243
<PotionDiv onClick={() => setMakeLovePotionModalOpen(true)}>
234-
<PotionP>Required Love Potions</PotionP>
244+
{/* <PotionP>Required Love Potions</PotionP> */}
235245
<Potion>
236246
<PotionImg src={potion.src} />
237247
<p>
238-
<RequiredNumber>{potions}</RequiredNumber>/200
248+
<RequiredNumber>{potions}</RequiredNumber>/1
239249
</p>
240250
</Potion>
241251
</PotionDiv>
@@ -252,15 +262,16 @@ const Breeding: FC<Props> = ({
252262
</ImgInfo>
253263
</ImgDiv>
254264
</BreedingSpot>
255-
<BreedButton
256-
disabled={potions < 200 || !beastSelected}
257-
buttonColors={buttonColors()}
258-
onClick={() => setEggObtainedModalOpen(true)}
259-
>
260-
<FontAwesomeIcon icon={faHeart} /> Start Breeding
261-
</BreedButton>
265+
{potions >= 1 && beastSelected && (
266+
<BreedButton
267+
buttonColors={buttonColors()}
268+
onClick={() => setEggObtainedModalOpen(true)}
269+
>
270+
🍆
271+
</BreedButton>
272+
)}
262273
</div>
263-
{evolvableBeasts != null && (
274+
{/* {evolvableBeasts != null && (
264275
<ListWrapper>
265276
<ul
266277
role="list"
@@ -288,7 +299,7 @@ const Breeding: FC<Props> = ({
288299
)}
289300
</ul>
290301
</ListWrapper>
291-
)}
302+
)} */}
292303

293304
{/* <ul
294305
role="list"

‎components/ui/EggObtainedModal/EggObtainedModal.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { FC, Fragment, useEffect, useState } from "react"
22
import { Dialog, Transition } from "@headlessui/react"
33
import { CheckIcon, IdentificationIcon } from "@heroicons/react/outline"
44
import poopPic from "public/fungible_tokens/fungible_tokens_images/basic_beasts_poop.png"
5-
import picture from "public/001_normal.png"
5+
import eggImage from "public/egg.png"
66
import star from "public/basic_starLevel.png"
77
import styled from "styled-components"
88
import {
@@ -231,7 +231,7 @@ const EggObtainedModal: FC<Props> = ({ open, setOpen }) => {
231231
<Title>Congratulations!</Title>
232232
<Title>You have recieved an egg!</Title>
233233
<div className="relative z-10">
234-
<Img src={poopPic.src} />
234+
<Img src={eggImage.src} />
235235
<Backshine />
236236
</div>
237237
<Button>Go To Your Egg Collection</Button>

0 commit comments

Comments
 (0)