Skip to content

Commit c28f0c4

Browse files
codingmster1codingmster1
committed
css file for each jsx in ui
1 parent 7d50190 commit c28f0c4

12 files changed

+59
-57
lines changed

‎src/App.css

+1-49
Original file line numberDiff line numberDiff line change
@@ -71,22 +71,7 @@ html {
7171
left: 0;
7272
}
7373

74-
.loading {
75-
display: flex;
76-
align-items: center;
77-
justify-content: center;
78-
color: #e6700f;
79-
font-size: 40px;
80-
}
8174

82-
.fa-spinner {
83-
animation: rotate 800ms infinite linear;
84-
display: none !important;
85-
}
86-
87-
.loading .fa-spinner {
88-
display: block !important;
89-
}
9075

9176
@keyframes rotate {
9277
0% {
@@ -181,29 +166,7 @@ html {
181166
height: 60px;
182167
}
183168

184-
.search__form {
185-
display: flex;
186-
align-items: center;
187-
}
188-
189-
.search__box {
190-
padding: 20px 80px 20px 20px;
191-
border: 2px solid #e6700f;
192-
border-radius: 40px;
193-
margin-right: 16px;
194-
font-size: 18px;
195-
196-
}
197-
198-
.search__button {
199-
border: none;
200-
background-color: #ffffff;
201-
202-
}
203-
204-
.search__button--icon {
205-
font-size: 20px;
206-
}
169+
207170

208171
.fa-searchengin
209172
{
@@ -262,18 +225,7 @@ html {
262225
border-color: #e6700f;
263226
}
264227

265-
/* no results */
266-
267-
.nores{
268-
height: 500px;
269-
}
270228

271-
.nores__para {
272-
margin-top: 40px;
273-
color: #e6700f;
274-
font-size: 24px;
275-
}
276-
277229
/* footer */
278230

279231
footer {

‎src/components/AnimeInfo.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React, { useEffect, useState } from "react";
22
import { useParams } from "react-router-dom";
33
import Loading from "./ui/Loading";
4-
import "App.css";
4+
import "./App.css";
55

66
function AnimeInfo() {
77
const { id } = useParams();

‎src/components/Footer.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from "react";
2-
import "App.css";
2+
import "./App.css";
33
import footerLogo from '../assets/skull.gif';
44
import { Link } from 'react-router-dom';
55

‎src/components/Landing.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import Search from "./ui/Search";
33
import Anime from "./ui/Anime";
44
import Loading from "./ui/Loading";
55
import mainImg from '../assets/skull-knight.gif';
6-
import "App.css";
6+
import "./App.css";
77

88
function Landing({ searchRedirect }) {
99
const [trendingList, setTrending] = useState([]);

‎src/components/Nav.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from "react";
2-
import 'App.css';
2+
import './App.css';
33
import navLogo from '../assets/2_all-the-anime-logo.png';
44
import navLogo2 from '../assets/behelit.png';
55
import { Link } from "react-router-dom";

‎src/components/ui/Anime.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from "react";
2-
import "Anime.css";
2+
import "./Anime.css";
33
import { Link } from "react-router-dom";
44

55
function Anime({ title, cover, id }) {

‎src/components/ui/Loading.css

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
.loading {
2+
display: flex;
3+
align-items: center;
4+
justify-content: center;
5+
color: #e6700f;
6+
font-size: 40px;
7+
}
8+
9+
.fa-spinner {
10+
animation: rotate 800ms infinite linear;
11+
display: none !important;
12+
}
13+
14+
.loading .fa-spinner {
15+
display: block !important;
16+
}

‎src/components/ui/Loading.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from "react";
22
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
3-
import "../src/App.css"
3+
import "./Loading.css";
44

55
function Loading() {
66
return (

‎src/components/ui/NoRes.css

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/* no results */
2+
3+
.nores{
4+
height: 500px;
5+
}
6+
7+
.nores__para {
8+
margin-top: 40px;
9+
color: #e6700f;
10+
font-size: 24px;
11+
}

‎src/components/ui/NoRes.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from "react";
2-
import "App.css";
2+
import "./NoRes.css";
33

44
function NoRes() {
55
return (

‎src/components/ui/Search.css

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
.search__form {
2+
display: flex;
3+
align-items: center;
4+
}
5+
6+
.search__box {
7+
padding: 20px 80px 20px 20px;
8+
border: 2px solid #e6700f;
9+
border-radius: 40px;
10+
margin-right: 16px;
11+
font-size: 18px;
12+
13+
}
14+
15+
.search__button {
16+
border: none;
17+
background-color: #ffffff;
18+
19+
}
20+
21+
.search__button--icon {
22+
font-size: 20px;
23+
}

‎src/components/ui/Search.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
22
import React from "react";
33

4-
import "App.css";
4+
import "./Search.css";
55

66
function Search({ searchRedirect }) {
77
return (

0 commit comments

Comments
 (0)