Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
2
Comments
16

Bakrin Olasupo

@Swag-blips210 points

I love and breathe creativity

Latest solutions

  • Advice Generator using html css and javascript

    #accessibility

    Bakrin Olasupo•210
    Submitted about 1 year ago

    Not much, if you have any feedback you would like to share please don't hesitate


    1 comment
  • Dev links Built with React and firebase

    #firebase#tailwind-css#react

    Bakrin Olasupo•210
    Submitted about 1 year ago

    If you have any feedback that can help or imporve my code please dont hesitate to commet


    0 comments

Latest comments

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

    .

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

    How to add transparent color and svg to image.

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

    .

    NFT preview card

    1
    Bakrin Olasupo•210
    @Swag-blips
    Posted about 1 year ago

    Hello polinagusakova, Great work, Hope this feedback helps.

    Meta Tags for SEO: Consider adding meta tags for better search engine optimization and social media sharing.

    Ensure the alt attributes for images are descriptive for better accessibility.

    Link Accessibility:Provide a descriptive link text or aria-label for better accessibility:

    <a href="#">Coded by Polina</a>

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

    i am proud of centering the social card in the middle of the webpage.

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

    how to center the social card and i overcame it by display:flex; , justify-conten:center; , align-self:center;

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

    i need help in media query, how to place rule for mobile and desktop design

    responsive website using flexbox

    1
    Bakrin Olasupo•210
    @Swag-blips
    Posted about 1 year ago

    Hello Brown, Great work, here is my feedback hope it helps.

    Meta Tags for SEO: Consider adding meta tags for better search engine optimization and social media sharing.

    Link Attributes:The alt attribute is not valid on a <link> element. Remove it from the favicon link.

    Image Accessibility: Ensure the alt attribute for the image is descriptive:

    <img src="IMG-20240510-WA0031.jpg" alt="Profile picture of Mimvili Brown">

    Marked as helpful
  • Anita Nwabasa•100
    @Anitanwabasa
    Submitted about 1 year ago
    What specific areas of your project would you like help with?

    Any area that needs help

    Responsive product preview card

    1
    Bakrin Olasupo•210
    @Swag-blips
    Posted about 1 year ago

    Hello Anita,Great work, here is my feedback, I hope this helps

    Meta Tags for SEO: Consider adding meta tags for better search engine optimization and social media sharing.

    Link Attributes:The alt attribute is not valid on a <link> element. Remove it from the favicon link:

    Button Accessibility:Add an aria-label to the button for better accessibility:

        <img src="carticon.svg" alt="Shopping cart icon">
        Add to Cart
    </button>```
    
    Marked as helpful
  • KingX•180
    @iwedibah
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    I am most proud of the fact that i could finish this challenge

    Order Summary Component

    1
    Bakrin Olasupo•210
    @Swag-blips
    Posted about 1 year ago

    Hello KingX, Great work. Here is my feedback

    Meta Tags for SEO: Consider adding meta tags for better search engine optimization and social media sharing. For example:

    <meta property="og:title" content="Frontend Mentor | Order summary card">
    <meta property="og:description" content="Order summary card project from Frontend Mentor.">```
    
    **Correct the favicon type. The current type image/x-pneg seems to be a typo. It should be image/png:**
    <meta property="og:image" content="illustration-hero.svg">
    
  • Surya M•10
    @professorofficial
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    fh

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

    fdh

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

    gch

    div property

    #accessibility
    1
    Bakrin Olasupo•210
    @Swag-blips
    Posted about 1 year ago

    Hello Surya, Great work Here is my feedback

    Improve alt Attribute:

    • Update the alt attribute of the QR code image to be more descriptive for better accessibility.

    Fix Typo in .small Class:

    • Correct the typo in the .small class where font size should be font-size

    Remove Duplicate Rule:

    • Remove the duplicate CSS rule for .container img to avoid redundancy
  • Martinna Lazcano•40
    @martinalzc
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of how it came out i thought i wouldn't be abble to make it look that good- I'm also proud that this time i found out how to center the card without using any weird theqniques

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

    For me is a challenge make the font sizes smaller for mobile without media queries because i actually have no idea how to do that so i just used media queries instead for the moment. Another challenge I encountered was to make the hover title yellow without making all the texts yellow, I overcame that by assigning the color black directly to the other texts instead of leaving them black as default and I was able to achieve it.

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

    i would like to know how to make font sizes smaller for mobile without using media queries

    Responsive blog preview card using vh

    1
    Bakrin Olasupo•210
    @Swag-blips
    Posted about 1 year ago

    Hey martinna, great work

    Descriptive Alt Text: Provide descriptive alt text for all images for better accessibility.

    CSS Class Naming Convention: Ensure that class names are meaningful and follow a consistent naming convention, such as BEM (Block Element Modifier).

    Accessibility

    • Focus States: Ensure interactive elements have clear focus states for accessibility

    Alt Text for Images: Always include meaningful alt text for images:

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