Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
3
Comments
5

Askar

@AskArtwentythree50 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

  • FLEXBOX, BEM

    #bem

    Askar•50
    Submitted 6 months ago

    I found that font-family: "Inter" in a div, which cover all the card, it does not inherit to the buttons. I do not know why, but when I put font-family to each button, it worked, in other cases does not


    1 comment
  • Vertical alligning and border radius


    Askar•50
    Submitted 9 months ago

    Is the distance betweem image and text is good, I mean it should be like that?


    1 comment
  • Centering text, padding, margin and border-radius


    Askar•50
    Submitted 9 months ago

    I would like to practice more with padding


    1 comment

Latest comments

  • Aakash Verma•9,500
    @skyv26
    Submitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    I'm really proud of the unique approach I took right from the start of the project. At first, it seemed time-consuming, but I trusted the process and focused on building a strong foundation.

    Here’s a breakdown of what I accomplished:

    1. Design Focus: I decided to complete the design phase first, which allowed me to create a solid visual structure before diving into the technical parts. This step gave me clarity and set the tone for the rest of the project. 🎨✨
    2. Personal Touch: I modified the JSON data to include my own profile, which added a personal and unique element to the application. 🧑‍💻
    3. Light and Dark Mode: Implementing both themes was an exciting challenge! I managed to keep the images the same for both modes, and instead of toggling between images, I cleverly used CSS properties to change the image color based on the theme. 🌞🌙
    4. Clean and Lightweight: I kept things simple by using vanilla TypeScript with no external libraries for the components. This helped me maintain full control over the project’s structure and made it lighter. 💡
    5. Well-Structured Code: I created separate components and wrote clear interfaces, ensuring the code was modular, easy to maintain, and scalable. 👨‍💻🔧

    Looking back, if I were to do anything differently, I would aim to plan the project’s timeline more efficiently to avoid feeling rushed during the implementation phase. Next time, I'll make sure to allocate time for both testing and refinement without compromising on quality.

    Overall, I'm really happy with the outcome and excited for the next challenge!

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

    One of the main challenges I faced was related to image handling in production. Since my assets were initially stored in the src folder, they weren’t loading properly when deployed. This caused issues with the images not being visible in the live version of the app. 😕📸

    To resolve this, I moved the assets from the src folder to the public folder, which allowed the images to be served correctly in production. This simple adjustment solved the issue and made everything work smoothly. 💡✔️

    It was a good reminder that sometimes the solution is just about placing things in the right spot! Always a learning experience! 😎

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

    I'd appreciate some constructive feedback on my TypeScript code and the overall project structure. 🙏 I'm open to suggestions on how I can improve code readability, performance, or anything else that might make it more maintainable and scalable. 👩‍💻🧑‍💻

    If you spot any areas where I could refine the architecture or if you have tips on best practices for TypeScript, feel free to share! 🚀 I'm all ears for valid and insightful feedback that can help me level up my skills! ✨

    Important: Make sure to hover on the dashboard for a bigger screen to see the buttons for light mode and profile swap.

    Tracking Dashboard: Light Mode + Profile Switch + Tailwind + VanillaTS

    #tailwind-css#typescript#vite
    1
    Askar•50
    @AskArtwentythree
    Posted 6 months ago

    Great work! Keep it up!

  • Amir97t•40
    @Amir97t
    Submitted over 1 year ago

    a simple and responsive card

    #bem
    1
    Askar•50
    @AskArtwentythree
    Posted 6 months ago

    Great work! Liked that github button is clickable. Keep it up! Wish u all the best!

    Marked as helpful
  • P
    KoalaChang•110
    @KoalaChang
    Submitted 9 months ago
    What are you most proud of, and what would you do differently next time?
    • Figma tools

    Compared to the previous project, "QR Code Component," this time I incorporated the Figma file into my entire workflow. It’s much more efficient to apply margins and padding directly.

    • Cursor syle

    It’s my first time customizing the cursor style on hover, and it’s exciting to see how many styles there are to choose from!

    .content-main:hover {
        color: #F4D04E;
        cursor: pointer;
    }
    
    What challenges did you encounter, and how did you overcome them?

    At first, I was puzzled by the card’s positioning—it just wouldn’t align both vertically and horizontally. After some searching and trial-and-error, I realized it was because I hadn’t set position: absolute on the card.

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

    Although I completed this project, I still find my code a bit lengthy and challenging to maintain. I’d be thrilled if anyone has suggestions on how to improve it!

    Responsive blog preview card (HTML / CSS)

    1
    Askar•50
    @AskArtwentythree
    Posted 9 months ago

    Looks very nice! Good job! I noticed that borders may be a little bit bigger than needed, but it does not change anything since your work is great! Wish u luck in next challenges!

  • Yiftach-Yaakov•40
    @Yiftach-Yaakov
    Submitted 9 months ago

    Blog Preview Card

    2
    Askar•50
    @AskArtwentythree
    Posted 9 months ago

    Nice work, man. Keep it up!

  • Hadole Raju•40
    @rajureddyhadole
    Submitted 9 months ago

    qr-code-component using html and scss

    1
    Askar•50
    @AskArtwentythree
    Posted 9 months ago

    Well done

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