Frontent dev env (#247)

* Added frontend development files/environment

* More items-categories related removals

* Improvements in pages templates (inc. static pages)

* Improvements in video player

* Added empty home page message + cta

* Updates in media, playlist and management pages

* Improvements in material icons font loading

* Replaced media & playlists links in frontend dev-env

* frontend package version update

* chnaged frontend dev url port

* static files update

* Changed default position of theme switcher

* enabled frontend docker container

frontend/src/static/js/components/media-actions/MediaSaveButton.jsx

@@ -0,0 +1,58 @@
+import React, { useState } from 'react';
+import { usePopup } from '../../utils/hooks/';
+import { CircleIconButton, MaterialIcon, NavigationContentApp, PopupMain } from '../_shared/';
+import { PlaylistsSelection } from '../playlists-selection/PlaylistsSelection';
+
+function mediaSavePopupPages(onTriggerPopupClose) {
+  return {
+    selectPlaylist: (
+      <div className="popup-fullscreen">
+        <PopupMain>
+          <span className="popup-fullscreen-overlay"></span>
+          <PlaylistsSelection triggerPopupClose={onTriggerPopupClose} />
+        </PopupMain>
+      </div>
+    ),
+    createPlaylist: (
+      <div className="popup-fullscreen">
+        <PopupMain>
+          <span className="popup-fullscreen-overlay"></span>
+        </PopupMain>
+      </div>
+    ),
+  };
+}
+
+export function MediaSaveButton(props) {
+  const [popupContentRef, PopupContent, PopupTrigger] = usePopup();
+
+  const [popupCurrentPage, setPopupCurrentPage] = useState('selectPlaylist');
+
+  function triggerPopupClose() {
+    popupContentRef.current.toggle();
+  }
+
+  return (
+    <div className="save">
+      <PopupTrigger contentRef={popupContentRef}>
+        <button>
+          <CircleIconButton type="span">
+            <MaterialIcon type="playlist_add" />
+          </CircleIconButton>
+          <span>SAVE</span>
+        </button>
+      </PopupTrigger>
+
+      <PopupContent contentRef={popupContentRef}>
+        <NavigationContentApp
+          initPage={popupCurrentPage}
+          pageChangeSelector={'.change-page'}
+          pageIdSelectorAttr={'data-page-id'}
+          pages={mediaSavePopupPages(triggerPopupClose)}
+          focusFirstItemOnPageChange={false}
+          pageChangeCallback={setPopupCurrentPage}
+        />
+      </PopupContent>
+    </div>
+  );
+}