Skip to content
OverviewSolutions
7
Comments
5
Araf Aslam Afif
@ArafAfif

All comments

  • Daniel 🛸•44,250
    @danielmrz-devSubmitted 10 months ago

    Hello! I'm Daniel and this is my solution for this challenge! 😊

    Definetely not my best work... I underestimated this challenge and have paid the price... 😅

    I couldn't quite get the menu correctly on mobile version and faced many different problems with the layout on desktop version too. I had to use fixed values on the container grid because I just couldn't do it other way.

    I decided to post the solution anyway because I can't do more than that with my current knowledge. I intend to redo this challenge in the future. For now, that's what I've got.

    If you have any suggestions on how I can improve this project, feel free to leave me a comment!

    Feedback welcome 😊

    News Homepage built with SASS

    2
    Araf Aslam Afif•110
    @ArafAfifPosted 10 months ago

    Your solution looks very good. But if you change your h1 color the solution will be more match the design.

    1
  • Araf Aslam Afif•110
    @ArafAfifPosted 10 months ago

    Your js code is too large. You can modify your code like this:

    function plusContain(pId, imgId){ let paragraph = document.getElementById(pId); paragraph.classList.toggle('paragraph');

    let image = document.getElementById(imgId);
let currentSrc = image.getAttribute('src');

// Check the current source and toggle to the other image
let toggleImg = currentSrc === 'images/icon-plus.svg' ? image.setAttribute('src', 'images/icon-minus.svg') : image.setAttribute('src', 'images/icon-plus.svg');
return toggleImg;

    } document.getElementById('btn1').addEventListener('click', function(){ plusContain('p1', 'btn1_img'); }); document.getElementById('btn2').addEventListener('click', function(){ plusContain('p2', 'btn2_img'); }); document.getElementById('btn3').addEventListener('click', function(){ plusContain('p3', 'btn3_img'); }); document.getElementById('btn4').addEventListener('click', function(){ plusContain('p4', 'btn4_img'); });

    After you modify your js code into this code your js file will be short.

    0
  • Araf Aslam Afif•110
    @ArafAfifPosted 10 months ago

    Your solution looks great. But if you dont use the br tag, you use the font-size property your code will be standard.

    1
  • Araf Aslam Afif•110
    @ArafAfifPosted 10 months ago

    Your solution looks great. But If you use semantic element your code will be better seo friendly.

    Marked as helpful
    1
  • Araf Aslam Afif•110
    @ArafAfifPosted 10 months ago

    Good job!

    0