Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • Rom• 780

    @RomWeb3

    Posted

    Hey,

    Nice work mate,

    I see that i can upVote and downVote as many times as i want.

    You should probably set a limit to one upVote & one downVote. Also user shouldn't be able to vote below 0.

    I've added 3 conditions in my handleScoreChange function to make this work.

    Hope it helps. Happy coding :)

    0
  • Ronald Sayre• 260

    @RJ3605

    Submitted

    This one took me a while because I stepped away from the project due to an issue with my browser guard and the API website. I eventually used a different browser to sidestep the issue. I also found that Visual Studio Code has an issue where it loads your live site zoomed in to 150%, which caused me to build the page with too small of font. I'm fixing it over time, but I wanted to upload my solution since it is functional now.

    The fetchWrapper.js is a overkill for this project, but I like using it because I am familiar with it.

    Any feedback is always welcome. I had an issue with reassigning the text for the "Copy" buttons. It changes to "Copied" when clicked, but for some reason I was having trouble changing the text back. Eventually I just ended up using a .forEach() to change all of them back to "Copy" before changing the text of the selected one to "Copied". Another issue I ran into was not realizing I did not have to Post, only Get, but that was due to me not understanding how the API actually worked.

    URL Shortening API Project Using Basic HTML, CSS, and JS

    1

    Rom• 780

    @RomWeb3

    Posted

    Hey, For the Copy button, you can use a setTimeout to automatically go back to the original copy button with the delay you want. On my code below i switch back to original button after 2s.

    Example :

     copyBtn.addEventListener("click", () => {
  clipboard(shortenUrl.innerHTML);
  copyBtn.classList.add("active");
  copyBtn.textContent = "Copied!";
  setTimeout(() => {
    copyBtn.classList.remove("active");
    copyBtn.textContent = "Copy";
 }, 2000);

    });

    For the social icons on footer, it's not loading, you can use https://fontawesome.com/icons it's really nice and easy to use

    Marked as helpful

    1
  • Rom• 780

    @RomWeb3

    Posted

    Hey, You can use Flex-wrap to do the responsive on this one. Check this site to fully learn Flexbox : https://flexboxfroggy.com/

    BTW, you should add some padding left & right.

    0
  • Rom• 780

    @RomWeb3

    Posted

    Hey Great work mate ! There is a problem between 720px & 600px You could start you Media Query Breakpoint at 720 px instead of 600px and it will fix the issue :)

    Marked as helpful

    0
  • ThaBeanBoy• 230

    @ThaBeanBoy

    Submitted

    I am unsure about the mobile breakpoint, is it strictly supposed to be 375px? because I adjusted it to 550px. I did this because The card would overlap the window screen between 375 and 550px. I hope this isn't bad practice

    Mainly used Flexbox

    1

    Rom• 780

    @RomWeb3

    Posted

    "I am unsure about the mobile breakpoint, is it strictly supposed to be 375px? " Not strictly, use breakpoints where needed. In your case you could change it to 700px BTW Feel free to check my Solution, it's far from perfect but it's not bad i think.

    Marked as helpful

    0