Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
11
Comments
9

Isabela Fernanda

@Isabela-Fernanda190 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

  • Newsletter sign up form with success message solution using js


    Isabela Fernanda•190
    Submitted 3 months ago

    PT

    Eu gostaria de ajuda em como fazer aparecer as bolinhas que são o estilo de lista nas páginas do guthib, no meu repositório local elas aparecem normalmente como nas imagens que eu colocoi da minha resolução, mas nas páginas do github elas não aparecem de jeito nenhum. Alguém sabe o que eu preciso mudar para que elas possam ser aplicadas?

    EN

    I would like help on how to make the dots that are the list style appear on the guthib pages, in my local repository they appear normally as in the images I placed of my resolution, but on the github pages they do not appear at all. Does anyone know what I need to change so that they can be applied?


    0 comments
  • Article preview component solução


    Isabela Fernanda•190
    Submitted 12 months ago

    PT

    Não consegui deixar o botão igual ao design fornecido, se possível eu gostaria de informações de como deixa-lo mais parecido com design fornecido. Também aceito feedbacks sobre qualquer outro ponto que possa ser melhorado.

    EN

    I was unable to make the button the same as the design provided, if possible I would like information on how to make it more similar to the design provided. I also accept feedback on any other points that can be improved.


    1 comment
  • Profile card using flex


    Isabela Fernanda•190
    Submitted about 1 year ago

    PT Eu gostaria de saber se tem como posicionar o background do mobile de uma maneira melhor, ele fica bom quando está na lagura requerida (375px), mas não fica bom conforme a largura vai aumentando.

    EN I would like to know if there is a way to position the mobile background in a better way, it looks good when it is at the required width (375px), but it doesn't look good as the width increases.


    1 comment
  • Huddle landing page responsiva com grid e flex


    Isabela Fernanda•190
    Submitted about 1 year ago

    PT

    Eu gostaria de feedbacks de como melhorar o css deste projeto, mais expecificamente na parte de @media(min-width: 1024px), que eu acho que não ficou tão boa. Também aceito feedbacks sobre qualquer outro ponto que possa ser melhorado.

    EN

    I would like feedback on how to improve the css of this project, more specifically in the @media(min-width: 1024px) part, which I think is not so good. I also accept feedback on any other points that can be improved.


    1 comment
  • Testimonials grid section main solução, usando flex e grid


    Isabela Fernanda•190
    Submitted about 1 year ago

    PT

    Eu gostaria de receber feedbacks sobre qualquer ponto que possa ser melhorado.

    EN

    I would like to receive feedback on any points that can be improved.


    1 comment
  • Four card feature section responsiva, usando grid e flex


    Isabela Fernanda•190
    Submitted about 1 year ago

    PT

    Eu gostaria de receber feedbacks sobre a responsividade, se ela ficou legal e se teria algum ponto em que melhorar. Feedbacks sobre qualquer outros pontos que possam ser melhorados também serão bem-vindos.

    EN

    I would like to receive feedback on the responsiveness, if it was good and if there was any point to improve. Feedback on any other points that could be improved will also be welcome.


    1 comment
View more solutions

Latest comments

  • h3cat3•330
    @h3cat3
    Submitted 4 months ago

    newsletter-sign-up-with-success-message-main mobile first aproch

    2
    Isabela Fernanda•190
    @Isabela-Fernanda
    Posted 3 months ago

    It looks good, but it is a little out of position and the width of the project is smaller than the solution. I recommend using the Google extension "PerfectPixel by WellDoneCode (pixel perfect)", it will help to better position the solution and also define the sizes of some parts.

  • Shakil ahmed•260
    @Shakil-a
    Submitted 12 months ago
    What are you most proud of, and what would you do differently next time?

    I am proud:

    • I added javascript to my mobile and desktop design
    • used the display none in css and figured out how it worked
    • played around with positioning

    next time i will:

    • look more into javascript and events and find a better way to toggle the share popup
    What challenges did you encounter, and how did you overcome them?

    challenges:

    • on the desktop version i havent figured out how to effectively toggle my profile content with the share popup and therefore i need to look into this and redo my project soon
    What specific areas of your project would you like help with?
    • suggesting other methods i could have used for my pop up

    article preview component

    1
    Isabela Fernanda•190
    @Isabela-Fernanda
    Posted 12 months ago

    Hi, your project turned out very good. Regarding the pop-up, one tip I have is that you could have made the share arrow within a single button, it would serve both to make the pop-up appear and disappear, so you wouldn't need another share arrow inside the popup.

  • Ralph•190
    @RalphPastel972
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    I am just proud of my consistency.

    What I would do differently? I would spend more time to plan the best layout and the best approach for a challenge.

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

    I am still way to slow.

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

    Nothing specific. But I am open to any critics that will make me improve.

    Responsive Testimonials grid section

    1
    Isabela Fernanda•190
    @Isabela-Fernanda
    Posted about 1 year ago

    Seu projeto ficou muito bom, parabéns! Mas uma coisa que eu percebi é que o seu site conforme o tamanho da tela vai diminuindo até chegar em 1050, o último valor antes dele mudar para mobile, a parte esquerda dos posts começa a ser cortada. Sugiro retirar min-width: 250px; que você definiu para a classe .card para resolver esse problema.

  • Tahsin YT•270
    @Randomgituser69
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    Atleast making it come close

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

    I was having no idea how can i put each item to different sides like left,right,top or bottom. I tried many ways but it didn't work. At one time i set the display of the container that includes cards to grid then gap some pixels or fr which i forgot how much and then grid template column to 1fr 1fr 1fr or something like that and that fixed the problem

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

    Idk

    Finished this ANNOYING PROJECT, FOUR Card feature section project

    1
    Isabela Fernanda•190
    @Isabela-Fernanda
    Posted about 1 year ago

    Hello, I took a look at your code and some tips I can give you are:

    1. Create a separate file just for styling (style.css, for example);
    2. In HTML, the <div class="head"> can be replaced by the <header> tag and placed outside the main, this would make your HTML more semantic and make it easier to style the <main> (you wouldn't need the < div class="grid-container">, you could simply make the div of the cards);
    3. I recommend you take a look at the grid-template-areas property, it makes it much easier to work with the grid in this type of design. I'll put below a code example on this property that would solve this design with just a few space changes between items.
    main {
            display: grid;
            grid-template-areas: "card1 card2 card4" "card1 card3 card4";
          }   
    .card1 {
        grid-area: card1;
      }
    .card2 {
        grid-area: card2;
      }
    .card3 {
        grid-area: card3;
      }
    .card4 {
        grid-area: card4;
      }
    
  • P
    WebDevJoe•70
    @JoeWebDevelopment
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    Use more utility classes, and rely more on global variables. I'm proud that this one has a lot of responsiveness.

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

    I had a challenge with the picture/image changing, but googled the solution using a srcset and media to match the media queries. I was also having issues of white space as it grew, but just used a break point of the media query to prevent that and max the width along with creating a mid-width to have consistency.

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

    Please give it a look over. I know I need to add more for accessibility and screen reader users but that is not an area I have much knowledge in.

    Product Card Mix of Grid and Flex

    2
    Isabela Fernanda•190
    @Isabela-Fernanda
    Posted about 1 year ago

    Great HTML semantics. The responsiveness is also good, but if you want to increase it you can make two @media, one for tablets with @media(min-width: 768px), and another for desktop with @media(min-width: 1440px)

    Marked as helpful
  • leodev•530
    @hangtime319
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    Foi um projeto bem diferente e excelente para praticar CSS. Eu sempre começo a desenvolver a página pelo layout de desktop. Nesse projeto, é melhor começar pelo layout de tela menor.

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

    O maior desafio que encontrei e não consegui concluir foi realizar os ajustes nas listas. Não consegue alinhar igual ao desafio.

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

    Ajustar os textos em listas como está no projeto.

    Recipe page using CSS Flexbox and responsive layout.

    1
    Isabela Fernanda•190
    @Isabela-Fernanda
    Posted about 1 year ago

    Good HTML structure

    Marked as helpful
View more comments
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub