Skip to content
OverviewSolutions
10
Comments
10

Tunde Abdulhamid Sanusi (Tuham)

@tuhamworld190 points

Frontend Engineer | Web Developer | WordPress Enthusiast

I’m currently learning...

JavaScript | React | PHP

Latest solutions

View more solutions

Latest comments

  • zeegu•310
    @zeeguSubmitted about 1 month ago
    What are you most proud of, and what would you do differently next time?

    Things I've tried

    • Tried Hover animation & transition
    • Used regular expressions for email form validation
    • Scored 99% on Google PageSpeed Insights
    • Considered web accessibility
    • Responsive for Mobile, Tablet, Desktop devices

    Things I should improve

    • Code refactoring : I should study more about reducing duplication when writing JavaScript🤣
    • Image Flickering : Image is flickering near desktop breakpoint. 😂 If anyone knows a solution, please let me know! It's gonna be a huge help :D

    Newsletter Signup With Success Message

    #sass/scss
    1
    Tunde Abdulhamid Sanusi (Tuham)•190
    @tuhamworldPosted about 1 month ago

    Well done on the solution. I noticed some errors which are quite important to fix:

    1. The mobile view submit button is overlapping. I attached a screenshot of the submit button overlapping here: overlapping here

    2. Success Message is now showing up: After filling in the email address, the success message is meant to show up but I noticed yours wasn't showing up - even after filling in the correct email address.

    3. Error messages are not showing as well : Validations for the correct email address such that when an incorrect email address is inserted, it should show an error message with the color

    Marked as helpful
    1
  • Mayen•440
    @Mayen007Submitted 3 months ago
    What challenges did you encounter, and how did you overcome them?

    This was my first time using SCSS on a project. I haven't really used the full power of this pre-processor and I hope to use more in future projects.

    What specific areas of your project would you like help with?

    I would like to get help on working with SCSS and how to get a better looking "arrow" for the share button.

    Any other feedback is welcomed.

    Article Preview Component

    #sass/scss#accessibility
    1
    Tunde Abdulhamid Sanusi (Tuham)•190
    @tuhamworldPosted about 2 months ago

    Weldone on working on the project, and you did quite well despite your first attempt at using SCSS.

    1. To start working on SCSS, here are the steps I would recommend;
    • Create a folder and name it scss.
    • Now create your file (e.g main.scss) inside the scss folder
    • Open a command prompt in the folder and run this command sass --watch main.scss:main.css
    • The purpose of the command prompt is to compile your sass styles into CSS automatically
    • Now link the compiled CSS (main.css) in your index.html folder
    1. In your mobile view, I noticed the share popup box displays on load. You will need to first display all contents of the mobile view, and then when the share icon is clicked on mobile, it will display the mobile share popup box

    Well done once again And cheers

    0
  • Tunde Abdulhamid Sanusi (Tuham)•190
    @tuhamworldPosted 2 months ago

    You did a great job with the project by paying attention to details and ensuring responsiveness.

    Your solution also has well-structured code that keeps your sass and CSS code separable.

    Well done

    The only comment I have is to ensure that you remove the README-template.md from your code

    0
  • Tunde Abdulhamid Sanusi (Tuham)•190
    @tuhamworldPosted 2 months ago

    First, I'd like to give kudos (well done) for trying it out and ensuring your code results is also responsive as well.

    My feedback on the results would be to reduce the font weight of the description in the box.

    I also would like to give kudos on your Sass arrangements and how you imported it.

    My feedback on the code would be to remove the dummy data which are the README-template.md and replace it with your contents.

    Well done once again

    0
  • P
    LuRouFan•140
    @angel-retrySubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    Write CSS code using SCSS.

    What challenges did you encounter, and how did you overcome them?

    Adjust the width and height of the image for smaller devices. Use object-fit: cover; and object-position: center; on the parent element of the img:

    {
   width: 100%;
   height: 240px;
   object-fit: cover;
   object-position: center;
}
    What specific areas of your project would you like help with?

    Please review my code. I want to know if there are better ways to write CSS, and I'm not sure if I'm using SCSS correctly. Are there any ways to make my SCSS code more maintainable and readable?

    Using SCSS Flexbox for layout, incorporating accessibility design.

    #sass/scss
    1
    Tunde Abdulhamid Sanusi (Tuham)•190
    @tuhamworldPosted 3 months ago

    Hello LuRouFan,

    You did a great job with the solution especially taking the bold step of writing your styles with Sass (Scss).

    Here are some improvements I recommend you also make:

    • Add hover effects to the "Add to cart" button
    • Removing/Replacing some dummy files in your project folder (e.g README template)
    • README.md will be shown on your github code profile as details about your project, it is highly recommended to change the texts to suit your own style

    Best Regards

    0
  • Tunde Abdulhamid Sanusi (Tuham)•190
    @tuhamworldPosted 4 months ago

    Well done Hussein for the job done.

    I like the desktop design and mobile responsiveness of your recipe page as it follow the style guide.

    I only have 3 suggestions based on my review:

    • The paragraph text in the Instructions is lighter compared to what's in the design, I would suggest adding a little bit of weight to the font.

    • For clarification, the README-template.MD was meant to replace the original README.md (after editing the contents).

    • I recommend creating a folder called CSS and moving your index.css to the CSS folder. This makes it easier for you and your potential employer to navigate between your codes

    Well done once again

    Marked as helpful
    0
View more comments