diff --git a/client/src/App.tsx b/client/src/App.tsx
index 723fc540eec86898e64b2711dd30c9b2195934d9..c304321a2b4c9cfad810cfae12c1b2733048afb4 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -22,7 +22,7 @@ const App = (): JSX.Element => {
         <Switch>
           <Route exact path='/' component={Home} />
           <Route path='/settings' component={Settings} />
-          <Route path='/apps' component={Apps} />
+          <Route path='/applications' component={Apps} />
         </Switch>
       </BrowserRouter>
     </Provider>
diff --git a/client/src/components/Apps/Apps.module.css b/client/src/components/Apps/Apps.module.css
index 09810e1f23677e9476943773be24b3d621d48ad3..4b6d917cc98e14438f2abc00c257e0a3f2c630a9 100644
--- a/client/src/components/Apps/Apps.module.css
+++ b/client/src/components/Apps/Apps.module.css
@@ -1,4 +1,13 @@
 .ActionsContainer {
   display: flex;
   align-items: center;
+}
+
+.AppsMessage {
+  color: var(--color-primary);
+}
+
+.AppsMessage a {
+  color: var(--color-accent);
+  font-weight: 600;
 }
\ No newline at end of file
diff --git a/client/src/components/Apps/Apps.tsx b/client/src/components/Apps/Apps.tsx
index afe429067ef44448a58387c4ec6994432731b1b3..4921497bb4512fbf238882595135326f1b780733 100644
--- a/client/src/components/Apps/Apps.tsx
+++ b/client/src/components/Apps/Apps.tsx
@@ -36,7 +36,9 @@ const Apps = (props: ComponentProps): JSX.Element => {
   const [isInEdit, setIsInEdit] = useState(false);
 
   useEffect(() => {
-    props.getApps();
+    if (props.apps.length === 0) {
+      props.getApps();
+    }
   }, [props.getApps]);
 
   const toggleModal = (): void => {
@@ -49,12 +51,12 @@ const Apps = (props: ComponentProps): JSX.Element => {
 
   return (
     <Container>
-      <Modal isOpen={modalIsOpen}>
+      <Modal isOpen={modalIsOpen} setIsOpen={setModalIsOpen}>
         <AppForm modalHandler={toggleModal} />
       </Modal>
 
       <Headline
-        title='All Apps'
+        title='All Applications'
         subtitle={(<Link to='/'>Go back</Link>)}
       />
       
@@ -75,7 +77,9 @@ const Apps = (props: ComponentProps): JSX.Element => {
         {props.loading
           ? <Spinner />
           : (!isInEdit
-              ? <AppGrid apps={props.apps} />
+              ? props.apps.length > 0
+                ? <AppGrid apps={props.apps} />
+                : <p className={classes.AppsMessage}>You don't have any applications. You can a new one from <Link to='/applications'>/application</Link> menu</p>
               : <AppTable />)
         }
       </div>
diff --git a/client/src/components/UI/Icons/WeatherIcon/WeatherIcon.tsx b/client/src/components/UI/Icons/WeatherIcon/WeatherIcon.tsx
index 6e25363dc968b89dc4e9869c82162d7efa2ddb33..a72c6b2aa0f83ce20dca30052f978635926167d7 100644
--- a/client/src/components/UI/Icons/WeatherIcon/WeatherIcon.tsx
+++ b/client/src/components/UI/Icons/WeatherIcon/WeatherIcon.tsx
@@ -7,10 +7,13 @@ import { IconMapping, TimeOfDay } from './IconMapping';
 interface ComponentProps {
   theme: Theme;
   weatherStatusCode: number;
+  isDay: number;
 }
 
 const WeatherIcon = (props: ComponentProps): JSX.Element => {
-  const icon = (new IconMapping).mapIcon(props.weatherStatusCode, TimeOfDay.day);
+  const icon = props.isDay
+    ? (new IconMapping).mapIcon(props.weatherStatusCode, TimeOfDay.day)
+    : (new IconMapping).mapIcon(props.weatherStatusCode, TimeOfDay.night);
 
   useEffect(() => {
     const delay = setTimeout(() => {
diff --git a/client/src/components/UI/Modal/Modal.tsx b/client/src/components/UI/Modal/Modal.tsx
index 5f458eef8758c017199c3fab922217d14827e7af..b8b86ebd49009dbc43c073a64a77f35f590bcdbb 100644
--- a/client/src/components/UI/Modal/Modal.tsx
+++ b/client/src/components/UI/Modal/Modal.tsx
@@ -1,15 +1,25 @@
+import { MouseEvent, useRef, useEffect } from 'react';
+
 import classes from './Modal.module.css';
 
 interface ComponentProps {
   isOpen: boolean;
+  setIsOpen: Function;
   children: JSX.Element;
 }
 
 const Modal = (props: ComponentProps): JSX.Element => {
+  const modalRef = useRef(null);
   const modalClasses = [classes.Modal, props.isOpen ? classes.ModalOpen : classes.ModalClose].join(' ');
 
+  const clickHandler = (e: MouseEvent) => {
+    if (e.target === modalRef.current) {
+      props.setIsOpen(false);
+    }
+  }
+
   return (
-    <div className={modalClasses}>
+    <div className={modalClasses} onClick={clickHandler} ref={modalRef}>
       {props.children}
     </div>
   )
diff --git a/client/src/components/Widgets/WeatherWidget/WeatherWidget.tsx b/client/src/components/Widgets/WeatherWidget/WeatherWidget.tsx
index c3cf36b125520060de6514f21a27e858b0a1fb42..67fa7fe1d5e1273d38078e0f0d01d4814656fcad 100644
--- a/client/src/components/Widgets/WeatherWidget/WeatherWidget.tsx
+++ b/client/src/components/Widgets/WeatherWidget/WeatherWidget.tsx
@@ -36,7 +36,10 @@ const WeatherWidget = (): JSX.Element => {
         : (
           <Fragment>
             <div className={classes.WeatherIcon}>
-              <WeatherIcon weatherStatusCode={weather.conditionCode} />
+              <WeatherIcon
+                weatherStatusCode={weather.conditionCode}
+                isDay={weather.isDay}
+              />
             </div>
             <div className={classes.WeatherDetails}>
               <span>{weather.tempC}°C</span>