Skip to content
OverviewSolutions
18
Comments
11
darshii
@darshii98

All comments

  • darshii•525
    @darshii98Posted over 3 years ago

    No reponsiveness in your design mate, maybe either work with flexbox or at every suitable width of screen, decrease the width of your container, also set your entire container's overflow to hidden.

    Marked as helpful
    0
  • darshii•525
    @darshii98Posted over 3 years ago

    Your amount increases but backers don't increase. So maybe try to change that!!. Also adding some transitions might help smooth things out in case of buttons and bookmark. Awesome Job bdw!!

    Marked as helpful
    0
  • 7milkyways•100
    @iamdestinychildSubmitted over 3 years ago

    this project was really fun i tell you, but it would have been better if we where not given the pageview to target a price it would had been better if we just had to write the function to solve for it, thanks for this project . LOVE 7milkyways.

    interactive-pricing-component

    2
    darshii•525
    @darshii98Posted over 3 years ago

    The slider component is not smooth. 8, 12, 16 are showing in the beginning and 36 at the end. Maybe you should think about implementing a uniform step size. Also below 400px screen width, the toggle switch appears to be very small, and the toggle effect isn't effective, try to maybe put a min-width on the toggle. Everything else looks great. Happy Coding!

    Marked as helpful
    0
  • darshii•525
    @darshii98Posted over 3 years ago

    Awesome job man. One small nitpick, when on the active tab if I check some items as completed, they still remain there and do not immediately get transferred to completed. I have to click completed and then on active again, to see that they are not there. If that could somehow change, then it will be a great app.

    Marked as helpful
    0
  • Asfand Yar•20
    @asfand687Submitted over 3 years ago
    1. I would like to know about what is the best practice for making the navbar for the mobile screens, how can we add some transition effects on them when they appear on the screen.
    2. What is the best practice for using the pictures? Should we use them as background or we should just render them using img tags?
    3. How have you used the svgs? with the img tags or have you used the inline-svgs? Whats the best practice to use the svgs in our projects?

    Flexbox, CSS Grid for the layout.

    1
    darshii•525
    @darshii98Posted over 3 years ago

    1. Set visibility to hidden below a certain screen length, preferably at tablet size(768), then you can make the container of the nav-links flex, with flex direction column, make position absolute, and give some padding to the links, to make it look like a list. To add transition effect either you can use transform translate or you can make the height of the container zero and when menu burger icon is clicked, set the height to unset or original and use transition to animate it.

    2. Sometimes its better to use directly images, but in case of the design and photography section of your site, you can use image as background.

    3. Svgs I have used in the sass itself and used filter property to change the color. (for icons I have used ion-icons, but you can also use the provided ones and change their color using filter when hovering)

    Marked as helpful
    0
  • darshii•525
    @darshii98Posted over 3 years ago

    Use the filter property to change color of images. You can find it in mdn. Something like " filter: brightness(0) saturate(100%) invert(37%) sepia(13%) saturate(2008%) hue-rotate(116deg) brightness(93%) contrast(93%);"

    Marked as helpful
    1
  • Rohit•330
    @Rohitgour03Submitted over 3 years ago

    hello, How to fix the background images position ??? Please give your valuable feedback and suggestion.

    Profile card component

    1
    darshii•525
    @darshii98Posted over 3 years ago

    GIve the container a background url() and set it's position in terms of vh vw...something like " background-position: right 51vw bottom 40vh, left 49vw top 49vh", .

    Marked as helpful
    0
  • Writam Biswas•105
    @bwritamSubmitted over 3 years ago

    how can i get better result if there any?

    css

    1
    darshii•525
    @darshii98Posted over 3 years ago

    Below 760px screen width, you can set the background of the card to 'repeat'. Because right now it just shows the background image on one side and white space on other.

    Marked as helpful
    0
  • darshii•525
    @darshii98Posted over 3 years ago

    Set your background's repeat as no-repeat. Other than that, it looks great ;)

    0
  • Jacob•130
    @VastagonSubmitted over 3 years ago

    I couldn't figure out how to add any padding at the bottom and used a p tag to create a bit of space. How do I not have to do that? I know that that was a bad solution.

    Semi-Responsive 3 column card using Flexbox

    1
    darshii•525
    @darshii98Posted over 3 years ago

    Make your single card component's position relative and your button's position as absolute, then give a distance from bottom to your button, it will work. You can refer my solution if you want. Also change your entire card component's flex direction to column if you want to make it responsive in mobile view.

    Marked as helpful
    1
  • darshii•525
    @darshii98Posted over 3 years ago

    You could set the input values to "", after submit button is clicked (when no errors), so that it would seem as if form is submitted. Bdw, nice job !! ;)

    Marked as helpful
    1