Ian Parker
@i-prkrAll solutions
Time tracking dashboard (Sass, CSS filtering)
#bem#sass/scssPSubmitted 7 months agoThings in particular for feedback that would be greatly appreciated:
- Any feedback on the usage of BEM, I'm still familiarising with it and wanting to make sure I am implementing it using best practise
- Any feedback on the javascript - how it might be cleaner / more reusable
- Any missing accessibility features?
Newsletter signup (Sass, BEM)
#accessibility#bem#sass/scssPSubmitted 7 months agoI would really appreciate any feedback, but particularly would love to know if the BEM method has been implemented effectively. Particularly working between
.card
and.card-success
classes as the success card had a slightly different layout.I would also grealt appreciate any improvements on my sass code, I am enjoying working with Sass/BEM and am keen to keep improving.
Thanks for looking at my solution!
Article preview (Sass, BEM)
#accessibility#bem#sass/scssPSubmitted 7 months agoI would greatly appreciate some help with two things:
-
The CSS transition is not working correctly on the live site, but it works fine in the dev environment with parcel and I don't know why. On the live site, the position of the share bar before being opened is defaulting to the wrong location, so the transition is starting from the wrong place. In the large layout, it should start just below where it appears, but instead is starting from the middle of the card. In the small layout, it should scale up from the share button location. I don't know why it only works in local, I have tried using both the scss and css file for the parcel dev environment and both work fine, until it is deployed.
-
When I use a screen reader it won't read out anything more than the level on heading of 'article preview component', and I'm not sure why as I think I have my HTML structured correctly. Any suggestions to improve accessibility would be great too.
Any help would be greatly appreciated thank you for looking at my solution!
-
Meet landing page (Sass, BEM)
#sass/scss#bemPSubmitted 7 months agoI would love to ask for feedback on two things in particular:
- How I have used Sass and BEM in the project
- Whether the pictures in the solution should have been done in a different way. Particularly things like the mobile footer picture looks zoomed in compared to the design.
Thank you for looking at my solution!
Responsive Testimonials Grid using Sass
#bem#node#parcel#sass/scssPSubmitted 7 months agoI would love to ask for feedback and help on two things in particular:
-
My solution looks a lot bigger than the design in the screenshot. The style guide specifies a font size of 13px, but if I set this then the font does not appear as nicely on the design even though it is the correct size overall. So I kept it with the nicer font size, does that matter?
-
Any feedback on my implementation of Sass and BEM would be awesome!!
Thanks for looking at my solution!!
-
Responsive Four Card Feature
PSubmitted 8 months agoI would love to know answers to these questions I have after finishing the solution:
Is it bad to be using flex boxes in different places just for centring elements? I'm using it to centre the CSS grid container and the SVG icons on the cards.
I've used a media query breakpoint based on card design rather than the standard mobile breakpoint, is that bad practice?
Any other tips, thanks!
Responsive product preview card
PSubmitted 8 months agoI would really like feedback on whether the solution correctly implements responsive design, particularly whether my font sizing is good practice using the clamp function. Any tips on better practice would be greatly appreciated.
Recipe Page
#accessibilityPSubmitted 8 months agoI would really appreciate feedback on whether the semantic html is correct and the correct elements have been used. I would also really appreciate feedback on whether the responsive design has been implemented well and any improvements on the structure of my css code.
Social Links Profile
#accessibility#animationPSubmitted 9 months agoStill having trouble sometimes and taking a while to get the layout exact. In my ".card" class in the stylesheet, lines 73-83 I had to specify the padding-inline, padding-top and padding-bottom to get the padding correct. I wanted to just use the shorthand "padding" but it would make the top and bottom padding bigger than the sides each time I tried. I am unsure why, and where the extra padding on the top and bottom was coming from.
I also would greatly appreciate any feedback particularly on the CSS, whether variables have been used effectively and what can be improved.
Blog preview card with CSS Grid
#accessibilityPSubmitted 12 months agoI would really like to know whether I have correctly applied responsive behaviour to the card in the best way, and what should have been done differently to the card's elements to make it more naturally responsive. I'm not sure I should have been manually setting the card max-height for smaller screens.
Also have I correctly created the component restricting it to the modules that it occupies and not letting it grow to the size of the content? I had some trouble getting the spacing around the avatar at the bottom in the desktop view.
Qr-code component using only HTML and CSS
PSubmitted 12 months agoI would like to know if my CSS could be written more elegantly, or in a particular way so as to scale better for larger projects.
I was also unsure if more should have been added for the desktop & mobile specs - both looked correct in chrome dev tools.