moved components, fonts, images to main

add privat
add LinkBox to privat

src/App.js

@@ -1,6 +1,10 @@
-import Menu from './components/Menu';
-import Foot from './components/Foot';
-import NotFound from './components/NotFound'
+import Menu from './main/components/Menu';
+import Foot from './main/components/Foot';
+
+import NotFound from './main/components/NotFound';
+import Links from './privat/components/Links';
+
+
 import './App.css';
 
 function App() {
@@ -9,6 +13,7 @@ function App() {
       <Menu/>
       <div className='App-body'>
         <NotFound/>
+        <Links/>
       </div>
       <Foot/>
     </div>

src/privat/components/LinkBox.css

@@ -0,0 +1,42 @@
+.link-box {
+    display: grid;
+    grid-template-areas:
+        "logo title" 
+        "logo subtitle";
+    grid-template-columns: 2.5em 1fr;
+    grid-template-rows: 1.5em 1em;
+    column-gap: 10px;
+    border-radius: 1em;
+    border-width: 3px;
+    border-style: solid;
+    background-color: #5555;
+    width: 300px;
+    color: black;
+    text-decoration: none;
+}
+
+.link-box:hover {
+    color: blueviolet;
+}
+
+.link-box-logo {
+    grid-area: logo;
+    width: 100%;
+    height: 100%;
+}
+
+.link-box-title {
+    grid-area: title;
+    font-size: 1.5em;
+    display: flex;
+    align-items: center;
+    line-height: 1;
+}
+
+.link-box-subtitle {
+    grid-area: subtitle;
+    font-size: 1em;
+    display: flex;
+    align-items: center;
+    line-height: 1;
+}

src/privat/components/LinkBox.js

@@ -0,0 +1,22 @@
+import "./LinkBox.css"
+
+function LinkBox (par) {
+    const title = typeof par.title === "string" ? par.title : " ";
+    const subtitle = typeof par.subtitle === "string" ? par.subtitle : " ";
+    const logo = typeof par.logo === "string" ? <img className="link-box-logo" src={par.logo} alt=""/> : " ";
+    const url = typeof par.url === "string" ? par.url : "#";
+
+    return (
+        <a className="link-box" href={url}>
+            {logo}
+            <div className="link-box-title">
+                <div>{title}</div>
+            </div>
+            <div className="link-box-subtitle">
+                <div>{subtitle}</div>
+            </div>
+        </a>
+    );
+}
+
+export default LinkBox;

src/privat/components/Links.js

@@ -0,0 +1,11 @@
+import LinkBox from './LinkBox';
+
+function Links () {
+    return (
+        <div>
+            <LinkBox title="Gitlab" subtitle="Git Verwaltung" url="172.22.1.1:7202"/>
+        </div>
+    );
+}
+
+export default Links;