Skip to content
OverviewSolutions
29
Comments
8
Rob Simpson
@pertrai1

All comments

  • Rob Simpson•490
    @pertrai1Posted 4 months ago

    This is great work you have done. It basically aligns with the layout given and has clean markup for both the HTML and CSS. Well done!

    0
  • Rob Simpson•490
    @pertrai1Posted over 1 year ago

    I like your solution more than the actual design. Very well done.

    0
  • Rob Simpson•490
    @pertrai1Posted over 1 year ago

    Still working on my code reusability, mainly with CSS. Wondering if putting a lot of values in variables would be helpful or not. Same with properties that are shared across rules, would it be better to combined the two or more rules, or create a helper rule?

    0
  • Rob Simpson•490
    @pertrai1Posted over 1 year ago

    The code I looked at looks great. I did look and see that there is a 404 for the font location. Maybe changing src: url(/assets/fonts/Inter-VariableFont_slnt\,wght.ttf); to src: url(assets/fonts/Inter-VariableFont_slnt\,wght.ttf); where /assets becomes assets without the leading /?

    Marked as helpful
    1
  • Bezies•1,230
    @BeziesSubmitted over 1 year ago

    No particular difficulties for this small project. Except for a small detail, I'm having trouble with the size of my input and my button, I can't find a correct and simple setting so that they have the same size, any idea?

    Using flexbox, JS: regEx

    1
    Rob Simpson•490
    @pertrai1Posted over 1 year ago

    Good work with the solution. When you say that you are having trouble with the size of the input and button, do you mean that it would be nice to only write code once and not have to duplicate for both? If so, you could take what is used for both of them and combine into one rule, i.e.

    #email,
#sub {
padding: 15px 20px;
}

    Then you can remove that from each individual rule. This way, you can change the value once and both will pick it up.

    I hope that is what you meant when you need to find a way to have them the same size.

    Marked as helpful
    0
  • Rob Simpson•490
    @pertrai1Posted over 1 year ago

    Great work on the solution you have come up with.

    Check in your JS and notice that you are using querySelector for the selected-tab, but there are multiple elements in the DOM that have this class. Because of this you will need to use querySelectorAll and then loop over each of them to add the class inactive. See if that helps get you going in the right direction.

    Marked as helpful
    0
  • Rob Simpson•490
    @pertrai1Posted over 1 year ago

    Great work on the solution you came up with. A quick look at the code and what I see that could help you:

    Do not use the same id multiple times. I see id="mob-nav-item" used for all links under .mobile-nav.

    Not much feedback but I hope it is enough to help you continue improving.

    Marked as helpful
    0
  • GreenT2012•20
    @GreenT2012Submitted over 1 year ago

    Hey,

    I’m unsure about trying to use the icons etc. as the data.json file. I guess my solution isn’t the best way so I left it at a try. Maybe someone can show me a better solution.

    My structure in the CSS file could also leave something to be desired. It would be great if I could get some feedback on this.

    Thank you!

    Responsive "Result-Summary-Component" with CSS Flexbox

    1
    Rob Simpson•490
    @pertrai1Posted over 1 year ago

    I personally think your solution is a good one. Don't think that your solution is not the best because that is very subjective and the objective is to practice. Good work.

    0