Typemaster Pre Launch Landing Page

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted over 3 years ago

  Hey, there is an issue about the structure.

  • Okay, when I visited it, there seems to have 2 scrollbars on the right, the and I inspect your element and the overflow-x: hidden causes this that was declared on your .wrapper selector. I tried removing it and it fixes it.

  • Another issue, a big issue is that, there is a huge white blank spaces in your layout, in different sections there is. As I look in your grid, since you used grid in here, and saw your row grid-template-rows: 100% 100% 100% styled like this. Okay now this is a big problem like, since you are getting 100% but from where? At this instance, it is from the viewport since your grid, have no parent container. You could just remove this if you are just placing them in rows right or your declare it like this one grid-template-rows: repeat(3,auto);. That way, they are placed in different rows, and the size of the rows varies according to the height of the item that will be placed, hence auto.

  • I look into your sass and it seems okay, though when using scss it is better to use @use instead of @import so that there will be a namespace added to them, and them treating them as a module. But it's fine for now, I too use @import in scss since I cannot use other @ methods of sass since I am just using live sass compiler in vs code, but when I do my freelances, I go in best practices and uses my gulp for it.

  Refactoring those codes will be a great idea^^

  2

  ---

  

  drallas•375

  @DrallasPosted over 3 years ago

  @pikamart

  Thank you for taking the time to look at my challenge and give feedback.

  I can't reproduce (2 scrollbars) and (huge white blank spaces) in my layout but i tried to refactor a bit. The overflow-x: hidden i moved to the Body since i need to prevent 'vertical scroll'.

  This was supposed to be a grid challenge, but somehow i made a grid and then was pulled into using Flexbox. I completely removed the Grid and only needed a justify-content: center; on the .features container to make it look as before.

  I'm glad to hear my SASS look okay.. I'm still a little bit lost on @use and build tools (gulp / / Grunt /Parcel), tried to research it but it doesn't click yet!

  Noticed that if I change @import to @use the VSCode plug-in won't compile it? After some research i switch to Glenns Live Sass Compiler that's derived from ( ritwickdey) orignal and maintained and supports Dart SASS with @use. Had to refactor the SASS a bit, but no more @imports.

  Thanks for pointing it out, going forward i start using @use!

  1

  

  Raymart Pamplona•16,100

  @pikapikamartPosted over 3 years ago

  @Drallas Glad to hear that you made it worked and yes, I don't know why the sass compiler can't handle @use only @import . Well goodluck on future challenges and to using sass^^

  1

  

  drallas•375

  @DrallasPosted over 3 years ago

  @pikamart You can use @use in VSCode if you ise Glenns Live Sass Compiler that's derived from ritwickdey's version he couldn't maintain anymore. | "I'm sorry but I'm now super busy, If you want to be a maintainer of the project please feel me to contact me! You've to be passionate about programming".

  Gulp and other build tools i'm not using yet! :)

  0