Docs: Added Specification and helper line in README

README.md

@@ -12,3 +12,6 @@ For using the NixOS direnv functionality, refer to [docs/direnv.md](/docs/direnv
 
 For documentation in this repository, check the `docs` folder.
 Each file will contain a short description of what it documents.
+
+### Website plan (submisson 1.)
+For reviewing the first submisson we recommend reading PRD.md first, then the Spec.md and the rest of the docs.

docs/Spec.md

@@ -0,0 +1,39 @@
+# Website Specification — key contents:  
+
+## Purpose & goals — what the site should achieve, target audience, success metrics 
+* The site will be a platform to view albums from a selection of artist.  
+* The target audience is anyone interested in music, and vinyl plates.  
+
+## Content & structure — site map, pages, content needed, navigation 
+
+The website will display shelves of vinyl records in their covers. Each vinyl record will be clickable and open a page that displays information over the songs in the album. In this “details” page you can also select each song to open a separate page where you can add you review and see other reviews. To the right of the vinyls, separated by a stripe, you can select filters to apply to the selection. This will work in addition to the search bar. If the selected vinyls exceed the number that can be shown on one page, a page section will appear between the vinyls and the footer. Here you can navigate through pages.  
+
+The data we will use will contain albums, artist and song list at minimum. This is the most critical data we need to show on the website.  
+
+
+## Functionality — features (forms, login, webshop), integrations, user flows 
+
+We will have a button to change the page, a search bar, a way to leave reviews and store them in our database and if time allows we will be making an admin panel. A filter box to change what data is displayed.  
+
+
+## Constraints — timeline, budget, maintenance plan 
+
+There are several features that will be implemented if we see that we are on schedule and have the extra time to do so. One of them is user accounts with authentication. 
+
+## Acceptance criteria — clear definition of "done" (must-haves vs. nice-to-haves) 
+
+The landing page of the website is a view over albums; EPs are also seen as an album. The album count per page changes the default value based on the type of device. Create reviews. 
+
+When clicking in on an album the album view should show which songs the	 album contains, the user should be able to click on a song in the album and write a review. To ensure content moderation, making reviews with hateful speech disappear, a admin page should be made to ease this process. 
+
+
+
+## Design — brand guidelines, responsive/mobile behavior, accessibility 
+![](./media/Figma-Design-1.png)
+![](./media/Figma-Design-2.png)
+
+Dette er tenkt utforming av nettsiden. Vi har valgt å gå for et retro stil hvor hver plate er et album, og du kan klikke den inn på hver plate for å se hver sang i hvert album. Det skal også være mulig å tab-navigere igjennom hver plate. Mobilversjonen trenger fortsatt litt finpuss, men per nå er siden om lag 700-800px bred, så vi regner med at utforming til mobil ikke blir for vanskelig. 
+
+Technical — platform/tech stack, hosting, performance, browser support, security/GDPR 
+
+We are going to use a mongo database and the same react setup as in project 1. We will be following the technical requirements of the project.