diff --git a/src/components/App.tsx b/src/components/App.tsx
index 7552018..1551b5d 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -27,7 +27,7 @@ function App(): JSX.Element {
return (
- {exerciseCount < 7 ? (
+ {exerciseCount < 4 ? (
<>
CONGRATULATIONS!
-
- You have come out of your shell and learned the basics of Turtle.{' '}
-
-
-
-
Try these next!
-
-
-
-
-
-
-
-
);
}
diff --git a/src/styles/Congratulations.scss b/src/styles/Congratulations.scss
index 6b9faa3..9d4b3ac 100644
--- a/src/styles/Congratulations.scss
+++ b/src/styles/Congratulations.scss
@@ -10,9 +10,9 @@
#congrats-page-container {
background-color: colors.$primary-green;
- display: flex;
+ // display: flex;
height: 100%;
- position: relative;
+ // position: relative;
width: 100%;
}
@@ -40,16 +40,15 @@
.speech-bubble {
height: auto;
- padding-left: 12.816vw;
- padding-right: 18.463vw;
- padding-top: 6vh;
- position: absolute;
+ margin-left: 18vw;
+ margin-right: 18vw;
+ // position: absolute;
width: auto;
}
#speech-bubble-image {
height: auto;
- width: 75%;
+ width: 100%;
}
#congratsTxt {
@@ -57,28 +56,17 @@
font-family: 'PT Sans', sans-serif;
font-size: 4vw;
font-weight: bold;
- left: 52%;
+ left: 50vw;
position: absolute;
top: 26%;
- transform: translate(-64%, -26%);
-}
-
-#blurb {
- color: colors.$primary-green;
- font-family: 'PT Sans', sans-serif;
- font-size: 2.8vw;
- font-weight: bold;
- left: 50%;
- position: absolute;
- top: 55%;
- transform: translate(-55%, -45%);
+ transform: translate(-50%, -60%);
}
#encouraging-turtle-congratulations {
- bottom: 3vh;
+ // bottom: 3vh;
height: 13.69vh;
- left: 2vh;
- position: absolute;
+ // left: 2vh;
+ // position: absolute;
width: 24vw;
}
@@ -86,47 +74,3 @@
padding-left: 6vw;
width: 14vw;
}
-
-#cat-img {
- width: 12vh;
-}
-
-#dog-img {
- width: 12vh;
-}
-
-#tryNext {
- bottom: 20.5vh;
- color: colors.$text-white;
- font-family: 'PT Sans', sans-serif;
- font-size: 4vh;
- font-weight: bold;
- height: auto;
- position: absolute;
- right: 10vw;
- width: auto;
-}
-
-#rectangle1 {
- background: #e5e5e5;
- border-radius: 1.48vh;
- bottom: 3vh;
- box-shadow: 0.12px 0.12px 0.5px rgba(0, 0, 0, 0.25);
- float: right;
- height: 14.46vh;
- position: absolute;
- right: 2.8vh;
- text-align: center;
- width: 26.2vh;
-}
-
-#rectangle2 {
- background: #e5e5e5;
- border-radius: 1.48vh;
- bottom: 3vh;
- box-shadow: 0.12px 0.12px 0.5px rgba(0, 0, 0, 0.25);
- height: 14.46vh;
- position: absolute;
- right: 31vh;
- width: 26.2vh;
-}