Skip to content
OverviewSolutions
13
Comments
8
Abhijit Barman
@abhijitbcob

All comments

  • Abhijit Barman•550
    @abhijitbcobPosted about 3 years ago

    I really liked your css code. My one tip for making the toggle switch scalable:

    • assign the width of circle slider to a variable
    • then using multiplicand of the variable define the width of the switch
    • transform the slider using the multiplicand of the variable(use calc())
    • then just change the variable value and everything will change
    Marked as helpful
    1
  • Abhijit Barman•550
    @abhijitbcobPosted over 3 years ago

    Hi Hemanuela, In desktop view everything looks nice! But in mobile view I've noticed that you've set a width to body, and this is creating problem with responsiveness and under 375px width layout is not appearing properly.

    my tips:

    • set responsive width (max-width property) to elements
    • don't always use fixed padding(huge padding) instead set max-width to content and center inside container
    Marked as helpful
    0
  • LouiseCW•235
    @costelloewardSubmitted over 3 years ago

    Hi everyone,

    This is a work in progress, any feedback much appreciated. I'm unsure about the positioning of the boxes, especially the testimonials. Is there a better way than margins?

    Social proof section: first go

    2
    Abhijit Barman•550
    @abhijitbcobPosted over 3 years ago

    Hi, Yeah, there is a better way than margin.

    • Give the testimonial cards container a height(bigger than each card), make it flex or grid container
    • set the first card(align-self: start), second card(align-self: center) and third card(align-self: end)
    Marked as helpful
    0
  • Joy Shaheb•215
    @JoyShahebSubmitted over 3 years ago

    If I Missed any web dev best practices, let me know. Suggestions & Criticisms are highly appreciated 💖

    Four card feature section

    1
    Abhijit Barman•550
    @abhijitbcobPosted over 3 years ago

    👍

    Hey Joy! how are you brother? I am one of your FB followers.

    1
  • Abhijit Barman•550
    @abhijitbcobPosted over 3 years ago

    looking very nice! Here is my some tips:

    • to center any element in body just only use display: grid; place-items: center;
    • instead of writing row height, use padding inside every card component.
    • in mobile view write grid-template-columns: minmax(0, 325px) so that the card be responsive.
    Marked as helpful
    0
  • Abhijit Barman•550
    @abhijitbcobPosted over 3 years ago

    use photoshop or similar kind of tool to measure every element of the design(image file) so that you can give your site close look to the provided design and otherwise everything is fine.

    0
  • emmy-html•345
    @emmy-htmlSubmitted over 3 years ago

    I would love some feedback on how you all were able to achieve the fully rounded border-bottom on the 'Learn More' text! I was only able to get it to round itself out on the bottom half. As always I'm open to any other feedback as well.

    Responsive landing page using Sass and Vanilla JS

    3
    Abhijit Barman•550
    @abhijitbcobPosted over 3 years ago

    the little white triangle in the mobile menu that was nice!

    1
  • luwa•325
    @luwa-starSubmitted almost 4 years ago

    This is my first time using SCSS in a project. I would appreciate any times on the best practices for SCSS. Thank you.

    Loopstudios Landing Page using SCSS

    1
    Abhijit Barman•550
    @abhijitbcobPosted almost 4 years ago

    Good! I think you can give this design better improvement, if you correct some alignments and sizes. Like, put each section's content in a same size container, make this container responsive for all devices, justify it center. Then, make the mobile menu links a little smaller with no scrolling.

    0