Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
40 commits
Select commit Hold shift + click to select a range
09f7965
components and base
code-and-cats Apr 4, 2023
34a5989
some components styled
code-and-cats Apr 4, 2023
a5395ea
progress with testimonials
code-and-cats Apr 6, 2023
66f75bc
less/more button on TestimonialCard
code-and-cats Apr 6, 2023
4434434
add background color, tweak of testimonal length
code-and-cats Apr 6, 2023
559ccd0
footer styling mobile
code-and-cats Apr 6, 2023
3efde8c
position exit button
code-and-cats Apr 6, 2023
838dfff
Popup styled-ish
code-and-cats Apr 6, 2023
95344e4
some kind of popup, not done with functionality
code-and-cats Apr 6, 2023
3c651b1
carousel-ish
code-and-cats Apr 6, 2023
2a25a99
yoga slider - in progress
code-and-cats Apr 7, 2023
043811f
small css fix on benefits + cleaning up a file
code-and-cats Apr 7, 2023
8f577b9
Header now styled component
code-and-cats Apr 7, 2023
0cfcc62
moved background picture for header
code-and-cats Apr 7, 2023
0d762c8
popup functionality done
code-and-cats Apr 7, 2023
a8c4893
Nutrition plan section in place
code-and-cats Apr 7, 2023
9b13e08
pricing section done
code-and-cats Apr 7, 2023
58eab2f
centering button in header
code-and-cats Apr 7, 2023
f28702d
line height fixes
code-and-cats Apr 7, 2023
18ec822
fix popup on top + cleaning unused files
code-and-cats Apr 7, 2023
5fd0840
toggle button on videos
code-and-cats Apr 7, 2023
e61950d
media queries on benefits, CTA, header
code-and-cats Apr 7, 2023
63263b6
Yoga section responsive + some minor fixes
code-and-cats Apr 7, 2023
858bb37
styling for responsivity
code-and-cats Apr 9, 2023
d1eb26e
yoga section styling for desktop
code-and-cats Apr 9, 2023
a118230
sliders for different views progress
code-and-cats Apr 9, 2023
1db95a7
most of styling done
code-and-cats Apr 9, 2023
b21269a
working on css
code-and-cats Apr 9, 2023
7309b4d
Styling and fixing as I go
code-and-cats Apr 9, 2023
5003b86
Hoping to be able to add a toggle on the pricing
code-and-cats Apr 9, 2023
461c335
Footer and small fix on pricecards
code-and-cats Apr 9, 2023
2100272
Giving up on button over video
code-and-cats Apr 9, 2023
3b68265
Fix infinte loop of pricing slider
code-and-cats Apr 9, 2023
a9172f4
small fix, header bg pic
code-and-cats Apr 9, 2023
7f8f705
Add mark on yoga text
code-and-cats Apr 9, 2023
a0382ac
Oops fixed the yogamark + focus on input
code-and-cats Apr 9, 2023
2e6174d
final fixes, comments, readme
code-and-cats Apr 9, 2023
48bbb25
very small sneaky fix of padding H1 in popup
code-and-cats Apr 9, 2023
57083bc
another super sneaky fix on mobile view
code-and-cats Apr 9, 2023
23ecc52
fix centering of testimonals + pricing cut off
code-and-cats Apr 18, 2023
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 4 additions & 11 deletions .eslintrc.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
{
"extends": [
"airbnb"
],
"extends": ["airbnb", "prettier"],
"globals": {
"document": true,
"window": true,
Expand All @@ -22,9 +20,7 @@
"modules": true
}
},
"plugins": [
"react-hooks"
],
"plugins": ["react-hooks"],
"rules": {
"react/function-component-definition": [
2,
Expand All @@ -42,10 +38,7 @@
"allowSingleLine": true
}
],
"comma-dangle": [
"error",
"never"
],
"comma-dangle": ["warn"],
"consistent-return": "off",
"curly": "error",
"eol-last": "off",
Expand Down Expand Up @@ -91,7 +84,7 @@
"react/destructuring-assignment": "off",
"react/forbid-prop-types": "off",
"react/jsx-closing-bracket-location": [
"error",
"off",
{
"selfClosing": "after-props",
"nonEmpty": "after-props"
Expand Down
13 changes: 8 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,16 @@
# Design Handoff

Replace this readme with your own information about your project.

Start by briefly describing the assignment in a sentence or two. Keep it short and to the point.
This is my first design handoff from a UX-student. It's made to spec as far as
I could with the time restraints for the project.

## The problem

Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next?
For this projct, I took the opportunity to get more familiar with styled components. This is why they are used for EVERYTHING. I can confidently say many of the of the styled components are totally overkill for this project and would have been better solved with css files.

For the carousel I've used Swiper. I could not get it to work as I wanted and does not look as the design. The popup is coded by me.

Towards the end I got tired, so there are mixes of px and rem in there. If I had more time I would go over the code and use consistent units.

## View it live

Every project should be deployed somewhere. Be sure to include the link to the deployed project so that the viewer can click around and see what it's all about.
https://spectacular-pudding-f8c7fa.netlify.app/
Loading