Skip to content

Latest commit

 

History

History
61 lines (41 loc) · 2.15 KB

README.md

File metadata and controls

61 lines (41 loc) · 2.15 KB

Welcome to FurNature landing page project! This project showcases a responsive landing page built using SCSS pre-processor with the 7-1 architecture, float-based layout, and BEM (Block Element Modifier) methodology.

Sections

  1. Navigation: Intuitive navigation for seamless user experience across different screen sizes.
  2. Hero Section: Engaging hero section with eye-catching visuals and clear call-to-action.
  3. About Section: Concise introduction to your brand or business, highlighting key features or values.
  4. Best Products: Showcase your best products or services to attract potential customers.
  5. Testimonial: Build trust and credibility with customer testimonials.
  6. Contact Section: Make it easy for visitors to get in touch with you through a contact form or provided contact information.

Features

  • Responsive design for compatibility across devices.
  • Old css layout technique float layout is used
  • SEO optimization
  • Density switching, resolution switching, art direction image optimization techniques
  • Modern web development practices such as SCSS pre-processor, 7-1 architecture and BEM methodology

Project Structure

The project follows the SCSS 7-1 architecture, which organizes SCSS files into seven folders and one main file:

  • base/: Base styles (resets, typography, etc.)
  • components/: Component-specific styles
  • layout/: Styles for the overall layout structure
  • pages/: Page-specific styles
  • abstracts/: Abstracts (variables, mixins, functions, etc.)
  • main.scss: Main SCSS file that imports all partials

Getting Started

To get a local copy up and running follow these simple steps:

  1. Clone the repository
git clone https://github.com/enesuraz/fur-nature.git
  1. Open the project folder in your code editor.

  2. Explore and modify the HTML and SCSS files to customize the landing page according to your needs

  3. Run this command

npm run watch
  1. If you want to build for production run this command:
npm run build

Contact

For any questions or inquiries, please contact @enesuraz at nfk7221@gmail.com.