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.
- Navigation: Intuitive navigation for seamless user experience across different screen sizes.
- Hero Section: Engaging hero section with eye-catching visuals and clear call-to-action.
- About Section: Concise introduction to your brand or business, highlighting key features or values.
- Best Products: Showcase your best products or services to attract potential customers.
- Testimonial: Build trust and credibility with customer testimonials.
- Contact Section: Make it easy for visitors to get in touch with you through a contact form or provided contact information.
- 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
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
To get a local copy up and running follow these simple steps:
- Clone the repository
git clone https://github.com/enesuraz/fur-nature.git
-
Open the project folder in your code editor.
-
Explore and modify the HTML and SCSS files to customize the landing page according to your needs
-
Run this command
npm run watch
- If you want to build for production run this command:
npm run build
For any questions or inquiries, please contact @enesuraz at nfk7221@gmail.com.