Skip to content
OverviewSolutions
2
Comments
3
Akuma95
@Akuma95

All comments

  • Akuma95•40
    @Akuma95Posted 3 months ago

    Yes it does help :)

    0
  • Akuma95•40
    @Akuma95Posted 3 months ago

    You result looks really nice :) Here are some Tips or Inspirations:

    • Try to use Variables like:
    :root {
   --font-size: 16px;
   --font-weight-normal: 400;
   --font-weight-bold: 700;

   --white: hsl(0, 0%, 100%);
   --Yellow: hsl(47, 88%, 63%);
   --gray-500: hsl(0, 0%, 42%);
   --gray-950: hsl(0, 0%, 7%);

   --space-200: 16px;
   --space-150: 12px;
   --space-100: 8px;
   --space-50: 4px;
}

body {
   background-color: var(--Yellow);
}

    If you do this, you can reuse this Color, Spacing, Fontweight, or anything else. An other advantage of it, if the Primary Color changes from Yellow to Red, You can fix it by changing it at one position :)

    • Try to remove unused Code :) if you do this, your code looks better and for other guys its a better overview and they understand your code better.

    • Try to use the Figma File, there is your Design Template and you can see all spaces, fontsizes and so on :) Then you will fit the Design Better with your solution.

    But thats all is a good work <3

    Marked as helpful
    0
  • Akuma95•40
    @Akuma95Posted 3 months ago

    This is a very good solution of this challenge :3

    A little tip: Try to use the Figma file. There are all spacings, heights and so on defined. For example: In the figma file you could see all Spacings are ether 16px, 24px or 40px. So you could define This as Variable and reuse them.

    In my opinion using Classes makes code more understandable for other people. In this example not very important, because this is very small, but the bigger the project the better is it.

    0