beenull
/
Miruro
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Quick ```content``` & ```title``` Update

This commit is contained in:
biskwt 2022-11-24 06:56:47 +01:00
parent 4d9277c08a
commit 1fc96f3362
6 changed files with 53 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
public/index.html
View File

@ -17,14 +17,14 @@
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<meta <meta
property="og:description" property="og:description"
content="MIRURO | Watch Anime Online" content="Miruro | Watch The Best Quality Anime Online"
/> />
<meta property="og:url" content="https://miruro.vercel.app" /> <meta property="og:url" content="https://miruro.vercel.app" />
<meta property="og:image" content="./logo512.png" /> <meta property="og:image" content="./logo512.png" />
<meta property="og:site_name" content="Miruro.vercel.app" /> <meta property="og:site_name" content="Miruro.vercel.app" />
<meta <meta
property="og:image:alt" property="og:image:alt"
content="Miruro - Watch The Best Quality Anime Online Hue Hue" content="Miruro | Watch The Best Quality Anime Online"
/> />
<!------------------------------- Google tag (gtag.js) ------------------------------------> <!------------------------------- Google tag (gtag.js) ------------------------------------>
@ -41,7 +41,7 @@
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link href="https://fonts.cdnfonts.com/css/gilroy-bold" rel="stylesheet" /> <link href="https://fonts.cdnfonts.com/css/gilroy-bold" rel="stylesheet" />
<title>MIRURO | Watch Anime Online</title> <title>Miruro | Watch The Best Quality Anime Online</title>
<base href="/" /> <base href="/" />
</head> </head>
<body> <body>

2
src/components/Navigation/Nav.js
View File

@ -67,7 +67,7 @@ function Nav() {
<div className="nav-links"> <div className="nav-links">
<Links to="/popular">Popular</Links> <Links to="/popular">Popular</Links>
<Links to="/#">Forum</Links> <Links to="/forum">Forum</Links>
<Links to="/help">Help</Links> <Links to="/help">Help</Links>
</div> </div>

4
src/components/Navigation/Search.js
View File

@ -146,7 +146,7 @@ const Content = styled.div`
} }
input { input {
background: rgb( 28, 32, 33 ); background: rgba(0, 0, 0, 0.1);
color: #ccc; color: #ccc;
outline: none; outline: none;
border: none; border: none;
@ -157,7 +157,7 @@ const Content = styled.div`
margin-right: 10px; margin-right: 10px;
margin-left: 10px; margin-left: 10px;
width: 80%; width: 80%;
transition: .5s; transition: 1s;
} }
input:focus { input:focus {

8
src/pages/Home.js
View File

@ -14,7 +14,7 @@ function Home({ changeMetaArr }) {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [confirmRemove, setConfirmRemove] = useState([]); const [confirmRemove, setConfirmRemove] = useState([]);
const { width } = useWindowDimensions(); const { width } = useWindowDimensions();
const title = 'Miruro - Watch The Best Quality Anime Online'; const title = 'Miruro | Watch The Best Quality Anime Online';
const content = `Miruro. An ad-free anime streaming site. Catch your favourite shows and movies right here! const content = `Miruro. An ad-free anime streaming site. Catch your favourite shows and movies right here!
Help us by contributing to the project on github.`; Help us by contributing to the project on github.`;
const image = const image =
@ -116,16 +116,16 @@ function Home({ changeMetaArr }) {
const Links = styled(Link)` const Links = styled(Link)`
color: rgba(158,162,164,1); color: rgba(158,162,164,1);
background: rgb(19, 21, 22); background: rgb(19, 21, 22);
padding: 0.5rem; padding: 0.4rem 0.5rem 0.4rem 0.5rem;
border-radius: 5px; border-radius: 5px;
border: 0.5px solid rgba(48,52,54,1); border: 1px solid rgba(48,52,54, 0.3);
font-size: 1.1rem; font-size: 1.1rem;
font-family: 'Gilroy-Medium', sans-serif; font-family: 'Gilroy-Medium', sans-serif;
text-decoration: none; text-decoration: none;
transition: 0.2s; transition: 0.2s;
:hover { :hover {
transform: scale(1.08); transform: scale(0.95);
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
color: #ffffff; color: #ffffff;

62
src/pages/PageNotFound.js
View File

@ -7,16 +7,30 @@ function PageNotFound({ changeMetaArr }) {
React.useEffect(() => { React.useEffect(() => {
changeMetaArr('title', 'PageNotFound'); changeMetaArr('title', 'PageNotFound');
}); });
document.addEventListener("DOMContentLoaded", () => {
const log = console.log,
array = [
"https://cdn.discordapp.com/attachments/985501610455224389/1045194302680219678/14.png",
"https://cdn.discordapp.com/attachments/985501610455224389/1045194095443853322/5.png",
"https://cdn.discordapp.com/attachments/985501610455224389/1045197663454363658/24.png",
"https://cdn.discordapp.com/attachments/985501610455224389/1045197663156584468/23.png",
"https://cdn.discordapp.com/attachments/985501610455224389/1045194095007629372/4.png"],
random = Math.floor(Math.random() * array.length),
target = document.getElementById("target");
target.src = `${array[random]}`;
log(target);
});
return ( return (
<NotFoundWrapper> <NotFoundWrapper>
<ErrorCTA> <ErrorCTA>
<img <img
src="https://cdn.discordapp.com/attachments/985501610455224389/1041882683166445699/logo2.png" id="target"
src="https://cdn.discordapp.com/attachments/985501610455224389/1045194302680219678/14.png"
width="320" width="320"
alt="AkioNotFound" alt="AkioNotFound"
className="error-image" className="error-image"
/> />
<HomeLink to="/">Go to Home</HomeLink> <HomeLink to="/">{/*Go Home*/}</HomeLink>
</ErrorCTA> </ErrorCTA>
<ErrorDetails> <ErrorDetails>
<h2 className="error-code">404</h2> <h2 className="error-code">404</h2>
@ -43,10 +57,19 @@ const NotFoundWrapper = styled.div`
`; `;
const ErrorCTA = styled.div` const ErrorCTA = styled.div`
position: relative; position: relative;
margin-bottom: 3rem; margin-bottom: 3rem;
margin-top: 1rem;
width: 350px; width: 350px;
overflow: hidden; overflow: hidden;
border-radius: 10px;
opacity: 0.7;
transition: 0.5s;
:hover {
transform: scale(1.05);
color: rgba(255, 255, 255, 1);
opacity: 1;
}
.error-image { .error-image {
width: 100%; width: 100%;
object-fit: cover; object-fit: cover;
@ -58,29 +81,26 @@ const ErrorCTA = styled.div`
`; `;
const HomeLink = styled(Link)` const HomeLink = styled(Link)`
background-color: #ddd; color: rgba(255, 255, 255, 0.7);
color: #23272a;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
padding: 10px 0%; padding-bottom: 210px;
border-radius: 10px; border-radius: 10px;
border-top-right-radius: 0;
border-top-left-radius: 0;
text-decoration: none; text-decoration: none;
font-size: 32px;
font-family: 'Acme', sans-serif;
font-weight: bold; font-weight: bold;
font-size: 22px; transition: 0.5s;
transition: 0.3s; :hover {
transform: scale(1.05);
color: rgba(255, 255, 255, 1);
}
@media screen and (max-width: 380px) { @media screen and (max-width: 380px) {
width: 100%; width: 100%;
font-size: 16px; font-size: 16px;
} }
:hover {
background-color: #fff;
}
`; `;
const ErrorDetails = styled.div` const ErrorDetails = styled.div`
@ -91,13 +111,15 @@ const ErrorDetails = styled.div`
gap: 1rem; gap: 1rem;
white-space: pre-wrap; white-space: pre-wrap;
.error-code { .error-code {
font-size: 120px; font-size: 100px;
letter-spacing: 10px; font-family: 'Acme', sans-serif;
letter-spacing: 0px;
color: white; color: white;
} }
.error-status { .error-status {
font-size: 75px; font-size: 65px;
font-weight: bold; font-family: 'Acme', sans-serif;
letter-spacing: -5px;
color: #ccc; color: #ccc;
} }
.error-message { .error-message {
@ -122,7 +144,7 @@ const ErrorDetails = styled.div`
font-size: 40px; font-size: 40px;
} }
.error-message { .error-message {
font-size: 20px; font-size: 17px;
} }
} }
@media screen and (max-width: 380px) { @media screen and (max-width: 380px) {

2
src/pages/Top100Anime.js
View File

@ -8,7 +8,7 @@ function Top100Anime({ changeMetaArr }) {
const [animeDetails, setAnimeDetails] = useState([]); const [animeDetails, setAnimeDetails] = useState([]);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const title = 'Top 100 Anime'; const title = 'Top 100 Anime';
const content = 'Miruro - Watch The Best Quality Anime Online'; const content = 'Miruro | Watch The Best Quality Anime Online';
const image = const image =
'https://cdn.discordapp.com/attachments/985501610455224389/1041832015105884241/logo512.png'; 'https://cdn.discordapp.com/attachments/985501610455224389/1041832015105884241/logo512.png';