https://github.com/thomasjonstrup/blog-preview-card

Frontend mentor challenge - Blog preview card
https://github.com/thomasjonstrup/blog-preview-card

astrojs frontend-mentor-challenge tailwindcss

Last synced: 29 days ago
JSON representation

Frontend mentor challenge - Blog preview card

• Host: GitHub
• URL: https://github.com/thomasjonstrup/blog-preview-card
• Owner: thomasjonstrup
• License: mit
• Created: 2024-04-20T12:36:59.000Z (8 months ago)
• Default Branch: main
• Last Pushed: 2024-04-28T15:52:29.000Z (8 months ago)
• Last Synced: 2024-04-28T16:46:03.758Z (8 months ago)
• Topics: astrojs, frontend-mentor-challenge, tailwindcss
• Language: Astro
• Homepage: https://blog-preview-card-tj.netlify.app/
• Size: 258 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Frontend Mentor - Blog preview card solution

This is a solution to the

[Blog preview card challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/blog-preview-card-ckPaj01IcS).

Frontend Mentor challenges help you improve your coding skills by building

realistic projects.

## Table of contents

-   [Overview](#overview)

    -   [The challenge](#the-challenge)

    -   [Screenshot](#screenshot)

    -   [Links](#links)

-   [My process](#my-process)

    -   [Built with](#built-with)

    -   [What I learned](#what-i-learned)

-   [Author](#author)

**Note: Delete this note and update the table of contents based on what sections

you keep.**

## Overview

### The challenge

Users should be able to:

-   See hover and focus states for all interactive elements on the page

### Screenshot

![Design preview for the Blog preview card coding challenge](./design/desktop-preview.jpg)

### Links

-   Solution URL:

    [Add solution URL here](https://www.frontendmentor.io/solutions/responsive-astrojs-and-tailwind-blog-preview-card-KbtzEq_h5k)

-   Live Site URL:

    [Add live site URL here](https://blog-preview-card-tj.netlify.app/)

## My process

### Built with

-   Semantic HTML5 markup

-   CSS custom properties

-   Flexbox

-   Tailwind CSS

-   Mobile-first workflow

-   [Astro.js](https://astro.build/) - web framework

**Note: These are just examples. Delete this note and replace the list above

with your own choices**

### What I learned

Training my skills in tailwind and astro

## Author

-   Website - [thomasjonstrup](https://thomasjonstrup.dk)

-   Frontend Mentor -

    [@thomasjonstrup](https://www.frontendmentor.io/profile/thomasjonstrup)