Skip to content
OverviewSolutions
11
Comments
10
Bisshy
@Bisshy

All comments

  • Purnama S Rahayu•250
    @catreedleSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    I am proud of learning BEM syntax CSS. I am also proud of the little animation for the validation message. I would rethink how I structured between the form section and the success message section. I don't like how it has no transition. I also need to start paying attention to tablet layout.

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

    By focusing on one area at a time.

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

    Anything in general. How would you switch between showing the form and showing the success message? I think in real case pages they would be in different files. But how would you approach it specifically in this project?

    Newsletter Sign-Up

    1
    Bisshy•150
    @BisshyPosted 2 months ago

    nice job

    1
  • Josephine Fitalvo•260
    @fitalvojosephineSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I am proud of my ability to combine HTML, CSS Grid, Flexbox, and transformations (translate along the X and Y axes and scale) to make the share button hide the element, along with using DOM JavaScript. I accomplished this by researching and reading other developers' code to complete an article preview component. I structured it responsively and added basic JavaScript functionalities using addEventListener.

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

    I encountered some difficulties with the button, specifically with how to make it hide, transform, and translate on hover and when clicked by the user. I researched this issue and resolved it by studying other developers' code. Additionally, I had some challenges with the grid-template-columns property for the container size. To fix this, I decided to use grid-template-columns: 285px minmax(300px, 445px);. This means the first column will always be 285 pixels wide, while the second column will have a flexible width that adjusts between 300 pixels and 445 pixels, depending on the available space in the container. This solution works perfectly.

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

    So far, none. Kindly give me some feedback to improve my coding skills. Thank you! #HappyCodingEveryone

    Article Preview Component

    1
    Bisshy•150
    @BisshyPosted 3 months ago

    Nice job your naming sense with the BEM method and your styling are good I learnt some new skills from you, I checked your page and I found out that your card__share-option is by default active when it's visited you can turn it off by adding the hidden class to the div of your html file which carries the icon images and adding the hidden class to you css and style it with the display none. i don't know if your JS will still work after this adjustments but if it doesn't try

    "shareButton.addEventListener("click", function () { shareOption.classList.toggle("hidden");" }); that is you set thet the shareButton to display the hidden card__share-options and you can fine-tune your css html also by removing the active class. I learnt a lot from your naming convention and I hope this I wrote up on here helps you

    0
  • Eli Silk•640
    @elisilkSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    I enjoyed the general challenge of the layout and getting the different grid elements to span different rows and columns in the desktop view while keeping the order the same as in the mobile view.

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

    I struggled with getting the spacing to match the design, and found the Figma design file was not that clear about spacing. I was also probably too heavy-handed with box shadow, and so I still need to work on a design eye for matching those kinds of details.

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

    Suggestions about how to think about and refine the spacing between elements (e.g., grid and flexbox gaps, paddings and margins that seem specific to a particular element) so that they match the design but are still consistent within a design system, would be appreciated.

    Testimonials grid section using CSS grid and BEM

    1
    Bisshy•150
    @BisshyPosted 3 months ago

    nice work

    0
  • Bisshy•150
    @BisshyPosted 3 months ago

    Nice Job

    Marked as helpful
    1
  • Bisshy•150
    @BisshyPosted 3 months ago

    Nice work

    1
  • quangphan0102•40
    @quangphan0102Submitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    Gotta learn about media queries for responsive the page, the image, etc... and do such cool stuffs.

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

    I got responsive desgin at the moment, go to google and researching and help my self passthrough the challenge. Also pushing myself to my work look exactly the same with the design. This time i lose much time than i thought, but worth when look the job done.

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

    i got okay with all elements, so yeah if you see something wrong in my html or css just show me.

    Recipe page

    1
    Bisshy•150
    @BisshyPosted 4 months ago

    good project I love it, it came out good and it's semantic but i think you should use div less it makes the coding have more structure more semantic

    1
  • Bisshy•150
    @BisshyPosted 4 months ago

    this is good very good, i love the way you applied the header i learnt something there, but if you can tone down on the div a bit it would be awesome

    0
  • Bisshy•150
    @BisshyPosted 4 months ago

    its a very nice attempt and the out come was wonderful though it didnt include semantic html or it would have been perfect, i try not use div if i can it makes my work professional im still working on it too but this is good

    0
  • Bisshy•150
    @BisshyPosted 4 months ago

    This is wonderful attempt like I had the knowledge that you can style your css in your html file but I've never done it before like I wouldn't even know how to go about it. It's eye opeing, errrm the html structure isn't schematic though with the use of the div I myself struggle sometimes not to use div div is a non schematic command, I used div at first myself then I went back and played around with it till I got it without using div which made the code very schematic but overall this is a wonderful attempt

    1
  • Bisshy•150
    @BisshyPosted 4 months ago

    the solution does not include semantic html but its a good project the code is well structured and readable I learnt how to apply the outfit command from this and it doesn't differ too much from the design more work can be done on the css instead of apply the height and width to the img in the css you can just add it to the html and make the img on css and 100% and the height set to auto make the img more responsive to the page and the semantic command main or header or footer wasnt applied to your html i feel if you could apply less div to your html your work will be top notch

    Marked as helpful
    0