Skip to content
OverviewSolutions
4
Comments
6
Luis Mendoza
@LMCyber

All comments

  • Sidharth Sreekumar•10
    @SidharthSreekumarSubmitted 8 months ago
    What are you most proud of, and what would you do differently next time?

    This is the first time I'm using Tailwind CSS after the crash course I took.

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

    I was having trouble importing the Outfit font from Google Fonts in my source CSS file. I added it as a link in the head tag as an alternative.

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

    Any suggestions on how I can improve my use of TailwindCSS in this project are welcome. I would also like to know I we can import a font using a remote URL in the main CSS file.

    QR Code Component using Tailwind CSS

    2
    Luis Mendoza•80
    @LMCyberPosted 8 months ago

    I recommend using the following to center all the conten:

    body { font-family: var(--primaryFont); background-color: var(--lightGray); display: grid; place-content: center; height: 100vh; }

    Marked as helpful
    0
  • Oswaldo Castro•240
    @tufcoderSubmitted 8 months ago
    What are you most proud of, and what would you do differently next time?

    Styling tables rows was a good trainning.

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

    Maybe using display grid to styling tables in the future.

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

    I'm not so confidente in the styling table, but I think its ok.

    HTML & CSS Mobile First Recipe Page

    1
    Luis Mendoza•80
    @LMCyberPosted 8 months ago

    Great job! You can do it. At first, it’s a bit challenging to shape the design, but if you ask Copilot or Chat GPT, you’ll achieve the same design. I recommend breaking it down into sections:

    Image Title Preparation time Ingredients Instructions Nutrition

    It’s easier to style one section at a time rather than the entire page. 😊👍

    0
  • Luis Mendoza•80
    @LMCyberPosted 8 months ago

    I was inspired by your code to create my solution. Thank you very much, I learned a lot by looking at how you did it.

    0
  • tgodo•50
    @tobiekweSubmitted 8 months ago
    What are you most proud of, and what would you do differently next time?

    I am most proud of building a good structure using HTML. Still struggling to understand the use of Figma for more precise coding.

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

    Figuring out correct widths, sizes and text family. I took enough time comparing and adjusting.

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

    Figma design.

    Social links profile - Challenge

    1
    Luis Mendoza•80
    @LMCyberPosted 8 months ago

    Congratulations, it turned out great. I used the following sizes, I share them with you in case they can help you achieve a better result:

    Mobile: .main { background-color: var(--darkGrey); display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 24px; width: 328px; height: 581px; border-radius: 12px; }

    Desktop:

    .main { width: 384px; height: 613px; padding: 40px; }

    0
  • Vien•30
    @pblanabelleSubmitted 8 months ago
    What are you most proud of, and what would you do differently next time?

    Nothing much. I am happy that I did it.

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

    Nothing

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

    Maybe on the right structuring. I am messy coder.

    Responsive webpage, semantic HTML, CSS variables, Flexbox

    1
    Luis Mendoza•80
    @LMCyberPosted 8 months ago

    You can use the next values properties to center all in your page:

    body { display: grid; place-content: center; height: 100vh; }

    Aditionally, the right sizes for the container are: .container { width: 325px; height: 499px; background-color: var(--white); border-radius: 20px; box-shadow: 8px 8px 0 0 var(--black); padding: 22px; }

    I hope that this can help you.

    Marked as helpful
    0
  • ikitamalarose•400
    @ikitamalaroseSubmitted 8 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud to have been able to manage responsive design, but also to have been able to finish the project within the time i had granted myself (1 hour).Soon i will no longer spend my time understanding how to manage this.

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

    I spent more time learning the flex box in order to properly arrange the block of my card.

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

    For the writing of HTML (index.html), did i respect the principle of BEM(Bloc - Element - Modifier) ? I want to learn how to write clean and understandable code.

    QR code component

    1
    Luis Mendoza•80
    @LMCyberPosted 8 months ago

    You can use this code on your body to center the content:

    body{ display: grid; place-content: center; height: 100vh; }

    0