easybank-landing-page-master

Community feedback

• 

  P

  tediko•6,680

  @tedikoPosted over 3 years ago

  Hello, Jay! 👋

  Nice to see you posting another challenge! Your page responds well and you put effort to create nice hovers. Kudos for menu hamburger animation 😅 There is not much, but what I can suggest is:

  • When your menu is open on mobile, disable scrolling on your site.
  • I believe you forgot to remove padding-right from .content-box:not(:last-child) on mobile and your last item is now missplaced a bit.
  • You thought about accessibility with focus states, but i think the outline for buttons is invisible and not intuitive i think it should catch in the eye after you focus them.
  • Lastly, since you are using Sass i would recommend you to take a look at Block, Element, Modifier methodology.

  Good luck with that, have fun coding! 💪

  1

  ---

  

  Jay•695

  @JunjiequanPosted over 3 years ago

  @tediko

  Thank you for the suggestions.

  I've never thought about disable scrolling when the nav menu popup, thanks for mentioning me.

  I also noticed :focus-visible from your lately posted solution, it was indeed the best solution to make cleaner focus effect for non-keyboard users(the majority!).

  As for the BEM methodology, I think its really cool and good to know there is such a standard for name styling. I've tried once but I wasn't really sure that was for me. Nevertheless, I'm gonna give it another try for the next challenge, let see how it goes.

  you too have fun coding ;)

  0

  

  Roc Tanweer•2,500

  @RocTanweerPosted over 3 years ago

  @a331998513 Hello 👋

  Since there is no other way to contact you, so I am asking here...

  How did you hosted multiple projects in the same repo?

  I tried to understand, but I couldn't.

  I thought you made an index.html in the root directory of the repo and navigated all the projects from that like a multi-page website but I couldn't find the index.html that represents yourname.github.io/projects

  Help me

  0

  

  Jay•695

  @JunjiequanPosted over 3 years ago

  @RocTanweer hey,

  I didn't make anything in the root except the theme(_config.yml) & readme.

  When I start a new project, I just simply drag new design material folder into my vscode (connected to the projects repository) then create everything(.js .html .css etc) inside the folder.

  In my case, https://a331998513.github.io/projects/ is the root and you don't need to create index.html to jump to the other folders inside the root.

  you just simply add the folder name after the root url

  https://a331998513.github.io/projects/ **FOLDER NAME**

  Example https://a331998513.github.io/projects/easybank-landing-page-master

  You don't even need to include /index.html at the end. coz by default it will display .github.io/blablabla/folder blabla/index.html

  0
• 

  Jay•695

  @JunjiequanPosted over 3 years ago

  @RocTanweer

  if you wonder how my readme looks like, here it is.

  ## Frontend Mentor challenge
  
  | Projects-name | Repo-link |
  | ------------- | ------------- |
  | 1. [Promotional Event](https://a331998513.github.io/projects/pricebox/)  | [Repo](https://github.com/a331998513/projects/tree/main/pricebox)  |
  | 2. [Feature Box](https://a331998513.github.io/projects/Featurebox/) | [Repo](https://github.com/a331998513/projects/tree/main/Featurebox)  |
  | 3. [Base Apparel coming soon page](https://a331998513.github.io/projects/BeautyMain/index.html) | [Repo](https://github.com/a331998513/projects/tree/main/BeautyMain) |
  | 4. [fylo-data-storage-component-master](https://a331998513.github.io/projects/fylo-data-storage-component-master/) | [Repo](https://github.com/a331998513/projects/tree/main/fylo-data-storage-component-master) |
  | 5. [intro-component-with-signup-form-master](https://a331998513.github.io/projects/intro-component-with-signup-form-master/) | [Repo]
  

  0

  ---

  

  Roc Tanweer•2,500

  @RocTanweerPosted over 3 years ago

  @a331998513 how did you design the yourname.github.io/projects ? It's like a website which navigate through all the projects, that why I thought to have a index.html in the root...

  I understand the part, how you navigate through the different projects but couldn't understand how you design yourname.github.io/projects

  I am sorry to disturb to but I tried to do these stuff a month ago but couldn't, now I saw you so I am asking you 🙏

  0

  

  Roc Tanweer•2,500

  @RocTanweerPosted over 3 years ago

  @a331998513 or is it just rendering the readme.md file by default from GitHub pages?

  0

  

  Jay•695

  @JunjiequanPosted over 3 years ago

  @RocTanweer

  Ah, I misunderstood you. 😅

  Yes. readme is rendered by default. I didn't design that page, I just selected a theme.

  You can find theme in Settings > GitHub Pages > Change theme

  1

  

  Roc Tanweer•2,500

  @RocTanweerPosted over 3 years ago

  @a331998513 Thank you

  1