Welcome to the News Letter web app! This simple web application provides information on various topics through a clean and responsive user interface. The app is built using Svelte, a modern JavaScript framework for building user interfaces.
The project structure is organized for clarity and maintainability. Below is a brief overview of the main files and directories:
- src/
- components/
Cards.svelte
: Component for displaying individual news cards.HeroSection.svelte
: Component for the hero section of the web app.NewSection.svelte
: Component for the new section of the web app.nav.svelte
: Component for the navigation bar.
App.svelte
: Main application file.
- components/
- public/
- images/
- Contains images used in the application.
- images/
The Cards
component is used to display individual news cards. It takes parameters such as image source (src
), card number (num
), heading (h_one
), and paragraph (paragraph
).
The HeroSection
component represents the hero section of the web app.
The NewSection
component represents the new section of the web app.
The Nav
component is responsible for the navigation bar.
The styling of the web app is done using inline styles within the style
tag in the App.svelte
file. The styling includes responsive design adjustments using media queries for both small screens and larger screens (min-width: 1024px).
- Responsive Design:
- On small screens, the content is displayed in a single column.
- On larger screens (min-width: 1024px), the content is displayed in a grid layout with specified column and row configurations.
Feel free to explore, modify, and enhance this web app to suit your needs! If you have any questions or suggestions, please don't hesitate to reach out.
Happy coding! ๐