diff --git a/Website/modules/Footer.tsx b/Website/modules/Footer.tsx index ba5b94a..5ac8425 100644 --- a/Website/modules/Footer.tsx +++ b/Website/modules/Footer.tsx @@ -1,4 +1,5 @@ -import React from 'react'; +import React, {useEffect} from 'react'; +import '../styles/footer.css'; export default function Footer(){ return ( diff --git a/Website/modules/Header.tsx b/Website/modules/Header.tsx index 081182a..426895a 100644 --- a/Website/modules/Header.tsx +++ b/Website/modules/Header.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import '../styles/header.css' export default function Header(){ return ( diff --git a/Website/modules/Search.tsx b/Website/modules/Search.tsx index 36f576b..da280d7 100644 --- a/Website/modules/Search.tsx +++ b/Website/modules/Search.tsx @@ -3,6 +3,7 @@ import {MangaConnector} from "./MangaConnector"; import IMangaConnector from "./interfaces/IMangaConnector"; import {isValidUri} from "../App"; import IManga, {HTMLFromIManga} from "./interfaces/IManga"; +import '../styles/search.css'; export default function Search(){ const [mangaConnectors, setConnectors] = useState(); @@ -104,7 +105,10 @@ export default function Search(){
{searchResults === undefined ?

No Results yet

- : searchResults.map(result => HTMLFromIManga(result))} + : searchResults.map(result =>
+ {HTMLFromIManga(result)} + +
)}
) } \ No newline at end of file diff --git a/Website/styles/footer.css b/Website/styles/footer.css new file mode 100644 index 0000000..41c6fdb --- /dev/null +++ b/Website/styles/footer.css @@ -0,0 +1,21 @@ +footer { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + width: 100%; + height: 40px; + align-items: center; + justify-content: center; + background-color: var(--primary-color); + align-content: center; + position: fixed; + bottom: 0; + color: white; +} + +#madeWith { + flex-grow: 1; + text-align: right; + margin-right: 20px; + cursor: url("Website/media/blahaj.png"), grab; +} \ No newline at end of file diff --git a/Website/styles/header.css b/Website/styles/header.css new file mode 100644 index 0000000..18d80fc --- /dev/null +++ b/Website/styles/header.css @@ -0,0 +1,32 @@ +header { + display: flex; + align-items: center; + height: var(--topbar-height); + background-color: var(--secondary-color); + z-index: 100; + box-shadow: 0 0 20px black; +} + +header > #titlebox { + position: relative; + display: flex; + margin: 0 0 0 40px; + height: 100%; + align-items:center; + justify-content:center; +} + +header > #titlebox > span{ + cursor: default; + font-size: 24pt; + font-weight: bold; + background: linear-gradient(150deg, var(--primary-color), var(--accent-color)); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + margin-left: 20px; +} + +header > #titlebox > img { + height: 100%; + cursor: grab; +} \ No newline at end of file diff --git a/Website/styles/index.css b/Website/styles/index.css index c72c606..eb98325 100644 --- a/Website/styles/index.css +++ b/Website/styles/index.css @@ -21,58 +21,4 @@ body{ font-family: "Inter", sans-serif; overflow-x: hidden; color: var(--primary-color); -} - -header { - display: flex; - align-items: center; - height: var(--topbar-height); - background-color: var(--secondary-color); - z-index: 100; - box-shadow: 0 0 20px black; -} - -header > #titlebox { - position: relative; - display: flex; - margin: 0 0 0 40px; - height: 100%; - align-items:center; - justify-content:center; -} - -header > #titlebox > span{ - cursor: default; - font-size: 24pt; - font-weight: bold; - background: linear-gradient(150deg, var(--primary-color), var(--accent-color)); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - margin-left: 20px; -} - -header > #titlebox > img { - height: 100%; - cursor: grab; -} - -footer { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - width: 100%; - height: 40px; - align-items: center; - justify-content: center; - background-color: var(--primary-color); - align-content: center; - position: fixed; - bottom: 0; -} - -#madeWith { - flex-grow: 1; - text-align: right; - margin-right: 20px; - cursor: url("Website/media/blahaj.png"), grab; } \ No newline at end of file diff --git a/Website/styles/search.css b/Website/styles/search.css new file mode 100644 index 0000000..e06b205 --- /dev/null +++ b/Website/styles/search.css @@ -0,0 +1,3 @@ +.searchResult{ + background-color: var(--second-background-color); +} \ No newline at end of file