Sockets - Nara #23
Sockets - Nara #23
Conversation
| <title>Startrly</title> | ||
| <link href="styles/normalize.css" rel="stylesheet"> | ||
| <link href="styles/styles.css" rel="stylesheet"> | ||
| <link href="https://fonts.googleapis.com/css?family=Great+Vibes" rel="stylesheet"> <title>Startrly</title> |
There was a problem hiding this comment.
I love how you added google fonts to further customize your site. Your quotes specifically look really great!
| content: close-quote; | ||
| } | ||
|
|
||
| .quote p::before { |
There was a problem hiding this comment.
Super cool! This sections looks so closely aligned to the wireframe. Using ::before to add quotes was a really great move.
| .team img { | ||
| border-radius: 50%; | ||
| padding: .3em; | ||
| border: 1px solid lightgray; |
There was a problem hiding this comment.
Your border around each image makes the images pop more -- looks really nice.
|
|
||
| } | ||
|
|
||
| .team { |
There was a problem hiding this comment.
Using flexbox and wrap seems to change the placement of each item based on the screen size. Consider fixing the size of the container to have the layout stay the same!
| text-align: center; | ||
| } | ||
|
|
||
| .sponsors { |
There was a problem hiding this comment.
Same situation as the .team section above with item placement! I am learning Flexbox is tricky with responsiveness to different screen sizes.
| padding: 10px 70px 30px; | ||
| } | ||
|
|
||
| .footer { |
There was a problem hiding this comment.
I love how you used Flexbox here! It really dries up your code to simply manipulate the individual "divs" rather than using a grid and having to place each item.
| .button { | ||
| color: black; | ||
| font-size: 1.5em; | ||
| cursor: pointer; |
There was a problem hiding this comment.
I love this!! A subtle additional of adding the hand pointer makes such a difference from the user's perspective!
|
|
||
| } | ||
| .reason-container img { | ||
| float: left; |
There was a problem hiding this comment.
Nice use of varied placement techniques. Using float left and setting the paragraph width make the layout super close to the wireframe.
There was a problem hiding this comment.
Really great website! I love how detailed your styling is -- using special fonts for quotes/adding borders to images -- and close to the wireframe you created your product. Your mixing of Flexbox and Grid helped me get a better of idea on what kinds of cases I could implement either method.
Startrly
Congratulations! You're submitting your assignment.
Comprehension Questions