An open API service indexing awesome lists of open source software.

https://github.com/ninjainshade/arch-studio-multi-page

Multi page website for imaginary business "arch studio"
https://github.com/ninjainshade/arch-studio-multi-page

Last synced: 5 months ago
JSON representation

Multi page website for imaginary business "arch studio"

Awesome Lists containing this project

README

          

# Frontend Mentor - Arch Studio multi-page website solution

This is a solution to the [Arch Studio multi-page website challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/arch-studio-multipage-website-wNIbOFYR6). Frontend Mentor challenges help you improve your coding skills by building realistic projects.

## Table of contents

- [Overview](#overview)
- [The challenge](#the-challenge)
- [Expected behaviour](#expected-behaviour)
- [Screenshot](#screenshot)
- [Links](#links)
- [My process](#my-process)
- [Built with](#built-with)
- [What I learned](#what-i-learned)
- [Author](#author)

## Overview

### The challenge

Users should be able to:

- View the optimal layout for each page depending on their device's screen size
- See hover states for all interactive elements throughout the site
- Receive an error message when the contact form is submitted if:
- The `Name`, `Email` or `Message` fields are empty should show "Can't be empty"
- The `Email` is not formatted correctly should show "Please use a valid email address"
- **Bonus**: View actual locations on the contact page map. The addresses we have on the design are fictional, so you'll need to add real addresses for this bonus task.

### Expected Behaviour

The following points are to clarify behaviour for areas where you might not be sure what's expected.

#### Home

- When one of the 3 Featured projects near the bottom are clicked, navigate to the `/portfolio` page.

#### Portfolio

- The thumbnails on the `/portfolio` index page should be anchor tags but should not link anywhere. If this were a real site, these could link to the project websites individually.

#### Contact

- Clicking on "View on Map" should scroll down to the map if you're using the static images
- If you're using Google Maps, clicking on "View on Map" should highlight the office that the link was clicked for

### Screenshot

### Links

## My process

### Built with

- Semantic HTML5 markup
- CSS custom properties/vars
- Desktop-first workflow

### What I learned

Not done yet.

## Author

- Website - [Leon Michalak](https://www.leonmichalak.dev)
- Frontend Mentor - [@NinjaInShade](https://www.frontendmentor.io/profile/NinjaInShade)
- Instagram - [@TheFrontendGuy](https://www.instagram.com/thefrontendguy/)