diff --git a/.dockerignore b/.dockerignore
index b512c09d476623ff4bf8d0d63c29b784925dbdf8..c77a412f16cfe73f8c37fba69b059f5b6461dc8f 100644
--- a/.dockerignore
+++ b/.dockerignore
@@ -1 +1,2 @@
-node_modules
\ No newline at end of file
+node_modules
+github
\ No newline at end of file
diff --git a/Dockerfile b/Dockerfile
index 75e90ca4f752b34a7e7206c292bf1f3e58e753d5..edbab3979875a026b57b6843e011ae7d6159ad5c 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -8,10 +8,15 @@ RUN npm install --only=production
 
 COPY . .
 
-RUN mkdir -p ./public ./data
-RUN mv ./client/build/* ./public
-RUN rm -rf ./client
+RUN mkdir -p ./public ./data \
+    && cd ./client \
+    && npm run build \
+    && cd .. \
+    && mv ./client/build/* ./public \
+    && rm -rf ./client
 
 EXPOSE 5005
 
+ENV NODE_ENV=production
+
 CMD ["node", "server.js"]
\ No newline at end of file
diff --git a/README.md b/README.md
index 2a4cc81474f785408988b9befb590b8dae628b61..58517bf72f6da873398de544afcef214becc67d3 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,7 @@
 # Flame
 
+![Homescreen screenshot](./github/_home.png)
+
 ## Description
 Flame is self-hosted startpage for your server. It's inspired (heavily) by [SUI](https://github.com/jeroenpardon/sui)
 
@@ -20,7 +22,7 @@ git clone https://github.com/pawelmalak/flame
 cd flame
 
 # run only once
-<TODO>
+npm run dev-init
 
 # start backend and frontend development servers
 npm run dev
@@ -32,11 +34,25 @@ npm run dev
 docker build -t flame .
 
 # run container
-docker run \
-  -p 5005:5005 \
-  -v <host_dir>:/app/data \
-  flame
+docker run -p 5005:5005 -v <host_dir>:/app/data flame
 ```
 
 ## Functionality
-todo
\ No newline at end of file
+- Applications
+  - Create, update and delete applications using GUI
+  - Pin your favourite apps to homescreen
+
+![Homescreen screenshot](./github/_apps.png)
+
+- Bookmarks
+  - Create, update and delete bookmarks and categories using GUI
+  - Pin your favourite categories to homescreen
+
+![Homescreen screenshot](./github/_bookmarks.png)
+
+- Weather
+  - Get current temperature, cloud coverage and weather status with animated icons
+- Themes
+  - Customize your page by choosing from 12 color themes 
+
+![Homescreen screenshot](./github/_themes.png)
\ No newline at end of file
diff --git a/client/src/components/Apps/AppCard/AppCard.module.css b/client/src/components/Apps/AppCard/AppCard.module.css
index bba98be75ac403f8fbce3b33c7a1a298cc700198..a66a60f2677104377918fe7b531eda68335aef56 100644
--- a/client/src/components/Apps/AppCard/AppCard.module.css
+++ b/client/src/components/Apps/AppCard/AppCard.module.css
@@ -1,25 +1,18 @@
 .AppCard {
   width: 100%;
-  /* height: 50px; */
-  /* max-width: 150px; */
-  /* border: 1px solid red; */
   display: flex;
   align-items: center;
   margin-bottom: 20px;
 }
 
 .AppCardIcon {
-  /* height: 64px; */
-  width: 40px;
-  height: 40px;
+  width: 35px;
+  height: 35px;
   margin-right: 0.5em;
 }
 
 .AppCardDetails {
   text-transform: uppercase;
-  /* display: flex;
-  flex-direction: column;
-  justify-content: center; */
 }
 
 .AppCardDetails h5 {
diff --git a/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.module.css b/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.module.css
index e3a672fc8631ee9e8d21eb6b62806c2395f380e0..af71a2ed7781874d9688c0d0299824ec4f960e3f 100644
--- a/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.module.css
+++ b/client/src/components/Bookmarks/BookmarkCard/BookmarkCard.module.css
@@ -1,5 +1,4 @@
 .BookmarkCard {
-  /* margin-top: 10px; */
   margin-bottom: 30px;
 }
 
@@ -21,8 +20,7 @@
   transition: all 0.25s;
 }
 
-.BookmarkCard a:hover,
-.BookmarkCard a:focus {
+.BookmarkCard a:hover {
   text-decoration: underline;
   padding-left: 10px;
 }
\ No newline at end of file
diff --git a/client/src/components/Home/Home.module.css b/client/src/components/Home/Home.module.css
index 05e3426aeb56b7fada46579a9fa2036272f72037..652ca22a8a1efe98075bc049111d10cc1223d6a4 100644
--- a/client/src/components/Home/Home.module.css
+++ b/client/src/components/Home/Home.module.css
@@ -53,4 +53,8 @@
   .SettingsLink {
     visibility: hidden;
   }
+}
+
+.HomeSpace {
+  height: 20px;
 }
\ No newline at end of file
diff --git a/client/src/components/Home/Home.tsx b/client/src/components/Home/Home.tsx
index 15988207075292a7e930ce9e32cc68d515039747..6a8ebc3229d8a70fdf99b7bb685b620247c9cff0 100644
--- a/client/src/components/Home/Home.tsx
+++ b/client/src/components/Home/Home.tsx
@@ -51,17 +51,7 @@ const Home = (props: ComponentProps): JSX.Element => {
 
     const now = new Date();
 
-    const ordinal = (day: number): string => {
-      if (day > 3 && day < 21) return 'th';
-      switch (day % 10) {
-        case 1:  return "st";
-        case 2:  return "nd";
-        case 3:  return "rd";
-        default: return "th";
-      }
-    }
-
-    return `${days[now.getDay()]}, ${now.getDate()}${ordinal(now.getDate())} ${months[now.getMonth()]} ${now.getFullYear()}`;
+    return `${days[now.getDay()]}, ${now.getDate()} ${months[now.getMonth()]} ${now.getFullYear()}`;
   }
 
   const greeter = (): string => {
@@ -94,6 +84,8 @@ const Home = (props: ComponentProps): JSX.Element => {
         : <AppGrid apps={props.apps.filter((app: App) => app.isPinned)} />
       }
 
+      <div className={classes.HomeSpace}></div>
+
       <SectionHeadline title='Bookmarks' link='/bookmarks' />
       {props.categoriesLoading
         ? <Spinner />
diff --git a/client/src/components/Settings/WeatherSettings/WeatherSettings.tsx b/client/src/components/Settings/WeatherSettings/WeatherSettings.tsx
index 3ab96184b69538d26014c7c926f5d83d1922b910..5eb7255a876a44f40e156a8cacbc8b975c7a683d 100644
--- a/client/src/components/Settings/WeatherSettings/WeatherSettings.tsx
+++ b/client/src/components/Settings/WeatherSettings/WeatherSettings.tsx
@@ -89,7 +89,7 @@ const WeatherSettings = (props: ComponentProps): JSX.Element => {
       .catch(err => console.log(err));
     
     // set localStorage
-    localStorage.setItem('isCelsius', JSON.stringify(formData.isCelsius === 1))
+    localStorage.setItem('isCelsius', JSON.stringify(parseInt(`${formData.isCelsius}`) === 1))
   }
 
   return (
diff --git a/client/src/components/UI/Forms/ModalForm/ModalForm.module.css b/client/src/components/UI/Forms/ModalForm/ModalForm.module.css
index 641d68c5001c93daf6873ae3945486b006149dc0..31ba48b66379ae11580e005ae7bef5531c6b68b3 100644
--- a/client/src/components/UI/Forms/ModalForm/ModalForm.module.css
+++ b/client/src/components/UI/Forms/ModalForm/ModalForm.module.css
@@ -2,9 +2,8 @@
   background-color: var(--color-background);
   color: var(--color-primary);
   border-radius: 6px;
-  width: 60%;
+  width: 95%;
   position: relative;
-  /* height: 50vh; */
   padding: 50px 50px;
 }
 
@@ -17,4 +16,28 @@
 
 .ModalFormIcon:hover {
   cursor: pointer;
+}
+
+@media (min-width: 430px) {
+  .ModalForm {
+    width: 90%;
+  }
+}
+
+@media (min-width: 800px) {
+  .ModalForm {
+    width: 70%;
+  }
+}
+
+@media (min-width: 1000px) {
+  .ModalForm {
+    width: 60%;
+  }
+}
+
+@media (min-width: 1400px) {
+  .ModalForm {
+    width: 40%;
+  }
 }
\ No newline at end of file
diff --git a/client/src/components/UI/Modal/Modal.module.css b/client/src/components/UI/Modal/Modal.module.css
index 200595bb1168072b92a7b398d810197ce7e5121e..fb6d7e8fff7dffbfd2dd0251bc01fd5a71a2c8a0 100644
--- a/client/src/components/UI/Modal/Modal.module.css
+++ b/client/src/components/UI/Modal/Modal.module.css
@@ -1,7 +1,7 @@
 .Modal {
   width: 100%;
   height: 100%;
-  position: absolute;
+  position: fixed;
   top: 0;
   left: 0;
   z-index: 100;
diff --git a/client/src/index.css b/client/src/index.css
index 2662dab30e4e4fce2be9c762137c0f25b9d1c096..db1d21b6e74f9420511921f60ec4288274e4ec94 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -2,7 +2,6 @@
   margin: 0;
   padding: 0;
   box-sizing: border-box;
-  /* user-select: none; */
 }
 
 body {
diff --git a/github/_apps.png b/github/_apps.png
new file mode 100644
index 0000000000000000000000000000000000000000..ecc1a9df56921b3d6ef526acfce07bd8ec38eb34
Binary files /dev/null and b/github/_apps.png differ
diff --git a/github/_bookmarks.png b/github/_bookmarks.png
new file mode 100644
index 0000000000000000000000000000000000000000..6392eb2f1509372b655be94ac29cb08051dcefdf
Binary files /dev/null and b/github/_bookmarks.png differ
diff --git a/github/_home.png b/github/_home.png
new file mode 100644
index 0000000000000000000000000000000000000000..2f24126d7a11aa7a8390410ac06404769eb07734
Binary files /dev/null and b/github/_home.png differ
diff --git a/github/_themes.png b/github/_themes.png
new file mode 100644
index 0000000000000000000000000000000000000000..6479d6f06faf1bee2a4a52e8e252257a9da53955
Binary files /dev/null and b/github/_themes.png differ
diff --git a/package.json b/package.json
index 0cf2a9287e2d26deff6d39b3450b8098f290c710..dc01f8ea0715f727b0089307d5c4f714826825d6 100644
--- a/package.json
+++ b/package.json
@@ -10,8 +10,7 @@
     "dev-init": "npm run init-server && npm run init-client",
     "dev-server": "nodemon server.js",
     "dev-client": "npm start --prefix client",
-    "dev": "concurrently \"npm run dev-server\" \"npm run dev-client\"",
-    "build": "docker build -t flame ."
+    "dev": "concurrently \"npm run dev-server\" \"npm run dev-client\""
   },
   "author": "",
   "license": "ISC",