1
1
Fork 0

Redesign to dashboard only

This commit is contained in:
Jordy van Zeeland 2023-07-28 17:23:14 +02:00
parent ac0429d23f
commit 0c4f43dc73
31 changed files with 2448 additions and 2087 deletions

BIN
.DS_Store vendored

Binary file not shown.

BIN
ras/.DS_Store vendored

Binary file not shown.

View File

@ -4,7 +4,8 @@ from .views import *
from .login import *
urlpatterns = [
path('books', getAllBooks),
path('books/all', getAllBooks),
path('books', getBooksByYear),
path('books/challenge', getChallengeOfYear),
path('books/challenges', getAllChallenges),
path('books/challenges/insert', addChallenge),

View File

@ -4,6 +4,7 @@ from rest_framework.response import Response
import pandas as pd
import ras.settings
import math
from pymongo import MongoClient
from sklearn.linear_model import LinearRegression
from sklearn.metrics import mean_squared_error
@ -13,6 +14,7 @@ from django.db.models import Q
from django.templatetags.static import static
import json
def getBooksData():
engine = create_engine('mysql+mysqldb://' + ras.settings.DATABASES['default']['USER'] + ':' + ras.settings.DATABASES['default']['PASSWORD'] + '@' + ras.settings.DATABASES['default']['HOST'] + ':3306/' + ras.settings.DATABASES['default']['NAME'])
df = pd.read_sql('SELECT * FROM api_books ORDER BY readed', engine, parse_dates={'readed': {'format': '%m-%Y'}})
@ -60,6 +62,34 @@ def getAllBooks(request):
return Response(data)
@api_view(['GET'])
def getBooksByYear(request):
if request.META.get('HTTP_YEAR'):
data = []
df = getBooksData()
df['readed'] = pd.to_datetime(df['readed'], format='%Y-%m-%d')
df['readed'] = df['readed'].dt.strftime('%Y-%m-%d')
df = df.where(df['readed'].str.contains(request.META.get('HTTP_YEAR')))
df = df.fillna('')
for index, row in df.iterrows():
if row['id'] and row['id'] != '':
data.append({
"id": row['id'],
"name": row['name'],
"author": row['author'],
"genre": row['genre'],
"author": row['author'],
"country": row['country'],
"country_code": row['country_code'],
"pages": row['pages'],
"readed": row['readed'],
"rating": row['rating'],
})
return Response(data)
@api_view(['GET'])
def getAllChallenges(request):
data = []

File diff suppressed because it is too large Load Diff

View File

@ -1,9 +1,6 @@
import React, { Component, lazy, Suspense } from "react";
import { Route, Routes, BrowserRouter as Router } from 'react-router-dom';
import { ColorRing } from 'react-loader-spinner'
import Login from "./views/login";
import ManageBooks from "./views/manage/books";
import ManageChallenges from "./views/manage/challenges";
const Dashboard = lazy(() => import("./views/dashboard"));
const Booklist = lazy(() => import("./views/booklist"));
@ -21,17 +18,13 @@ function App() {
ariaLabel="blocks-loading"
wrapperStyle={{}}
wrapperClass="blocks-wrapper"
colors={['#8066ee', '#58c8d6', '#fe4c62', '#49b8fd', '#ffbe0e']}
colors={['#404e67', '#01a9ac', '#64c5b1', '#1ABB9C']}
/>
<span>Data wordt geladen...</span>
</div>
</div>}>
<Routes>
<Route exact path="/" element={<Dashboard />} />
<Route exact path="/booklist" element={<Booklist />} />
<Route exact path="/login" element={<Login />} />
<Route exact path="/manage" element={<ManageBooks />} />
<Route exact path="/manage/challenges" element={<ManageChallenges />} />
</Routes>
</Suspense>
</Router>

View File

@ -1,20 +1,3 @@
const filterDataTable = (column, value, exact) => {
if (value !== 0 && exact === true) {
$('#DataTable').DataTable().column(column).search("(^" + value + "$)", true, false).draw();
} else {
$('#DataTable').DataTable().column(column).search(value).draw();
}
}
const fillDataTableFilters = (filter, value, text) => {
console.log(value, text);
if (value && !filter.find("option:contains('" + text + "')").length) {
var option = new Option(value, value);
option.innerHTML = text;
filter[0].appendChild(option);
}
}
const getFlagEmoji = (countryCode) => {
const codePoints = countryCode
.toUpperCase()
@ -22,14 +5,3 @@ const getFlagEmoji = (countryCode) => {
.map(char => 127397 + char.charCodeAt());
return String.fromCodePoint(...codePoints);
}
export const readCookie = (name) => {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}

View File

@ -45,7 +45,7 @@ export default class Challenge extends Component {
<div className="stat-block" style={{ marginBottom: '20px' }}>
<span className="block_name">Book Challenge</span>
<div className="progress">
<div className="progress-bar progress-bar-striped" role="progressbar" style={{ width: challengePercentage + '%' }} aria-valuenow={challengePercentage} aria-valuemin="0" aria-valuemax="100">
<div className="progress-bar" role="progressbar" style={{ width: challengePercentage + '%' }} aria-valuenow={challengePercentage} aria-valuemin="0" aria-valuemax="100">
<div className="progress-bar-number">{challengePercentage}%</div>
</div>
</div>

View File

@ -10,7 +10,7 @@ export const initChart = (data, ratings, year) => {
var colors = [
// '#696ffc', '#7596fa', '#92adfe', '#abc0ff'
'#8066ee', '#58c8d6', '#fe4c62', '#49b8fd', '#ffbe0e'
'#404e67', '#01a9ac', '#64c5b1', '#1ABB9C'
]
var dataSet = [];
@ -133,7 +133,8 @@ export const initChart = (data, ratings, year) => {
x: {
ticks: {
beginAtZero: true,
color: "#101010",
color: "#333",
size: 12,
fontFamily: "Source Sans Pro",
},
stacked: true,
@ -142,7 +143,8 @@ export const initChart = (data, ratings, year) => {
ticks: {
beginAtZero: true,
stepSize: 1,
color: "#101010",
color: "#333",
size: 12,
fontFamily: "Source Sans Pro",
},
stacked: true
@ -153,10 +155,11 @@ export const initChart = (data, ratings, year) => {
position: 'top',
labels: {
usePointStyle: true,
color: "#101010",
color: "#333",
padding: 20,
font: {
size: 14,
size: 12,
weight: 400,
family: 'Source Sans Pro',
}
}
@ -209,7 +212,7 @@ export const initDoughnut = (data) => {
label: '# of Tomatoes',
data: counts,
backgroundColor: [
'#8066ee', '#58c8d6', '#fe4c62', '#49b8fd', '#ffbe0e'
'#404e67', '#01a9ac', '#64c5b1', '#1ABB9C'
],
borderWidth: 0,
borderColor: '#1f2940',
@ -245,9 +248,9 @@ export const initDoughnut = (data) => {
padding: 20,
usePointStyle: true,
// This more specific font property overrides the global property
color: "##101010",
color: "#333",
font: {
size: 14,
size: 12,
family: 'Source Sans Pro'
}
}

View File

@ -35,7 +35,6 @@ export default class Countries extends Component {
<table id="DataTable" className="table responsive nowrap" width="100%">
<thead>
<tr>
<th>#</th>
<th>Land</th>
<th>Boeken</th>
</tr>
@ -45,7 +44,6 @@ export default class Countries extends Component {
var code = country.code.toLowerCase();
return (
<tr key={i}>
<td>{i + 1}</td>
<td><img src={`https://flagcdn.com/32x24/${code}.png`} /> {country.country}</td>
<td>{country.count}</td>
</tr>

View File

@ -1,8 +1,21 @@
import { readCookie } from "../Functions";
export const getAllBooks = () => {
return fetch('/api/books/all', {
"method": "GET",
})
.then(response => response.json())
.then(data => {
return data;
})
}
export const getBooksByYear = (year) => {
return fetch('/api/books', {
"method": "GET",
"headers": {
"year": year
}
})
.then(response => response.json())
.then(data => {

View File

@ -6,6 +6,15 @@
padding-top:15px !important;
}
#DataTable td {
color: #333;
font-size: 14px;
height: 40px;
font-weight: 400;
vertical-align: middle;
letter-spacing: .3px;
}
.DataTable_Container {
margin: 0 !important;
margin-top:30px !important;
@ -61,6 +70,7 @@
#DataTable{
margin-bottom:0;
box-shadow: none !important;
}
#DataTable .openAlarm .pictogram {
@ -84,12 +94,11 @@
#DataTable td{
padding:10px;
color: #000000;
font-size: 15px;
height: 45px;
font-size: 14px;
height: 0px;
font-weight: 400;
vertical-align: middle;
padding-left: 20px !important;
border-top: 1px solid #efefef;
border-top: none;
border-bottom: none;
}
@ -200,14 +209,14 @@
.DataTable_Container .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
background: none !important;
background-color: #8066ee !important;
border-color: #8066ee !important;
background-color: #404e67 !important;
border-color: #404e67 !important;
color: #fff !important;
}
.DataTable_Container .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
background: none !important;
background-color: #eaebec !important;
background-color: #404e67 !important;
color: #000 !important;
}

View File

@ -1,19 +0,0 @@
import React from "react";
import { NavLink } from "react-router-dom";
function SidebarManage(){
return (
<React.Fragment>
<div className='sidebar-manage'>
<ul>
<li><NavLink exact="true" to="/manage" end><i className="fa fa-book"></i> Boeken</NavLink></li>
<li><NavLink exact="true" to="/manage/challenges" end><i className="fa fa-list"></i> Challenges</NavLink></li>
</ul>
</div>
</React.Fragment>
)
}
export default SidebarManage;

View File

@ -59,7 +59,7 @@ export default class Ratings extends Component {
return (
<React.Fragment>
<div className="ratings">
<span className="block_name">Waarderingen ({this.state.totalRatings})</span>
<span className="block_name">Ratings</span>
<table id="DataTable" className="table responsive nowrap" width="100%">
<thead>
<tr>
@ -83,10 +83,10 @@ export default class Ratings extends Component {
return(
<tr>
<td style={{width: '150px'}} className='book_rating' dangerouslySetInnerHTML={{__html: ratingstars}}></td>
<td style={{width: '200px'}} className='book_rating' dangerouslySetInnerHTML={{__html: ratingstars}}></td>
<td style={{width: '257px'}}>
<div className="progress">
<div className="progress-bar progress-bar-striped" role="progressbar" style={{ width: rating_percentage + '%' }} aria-valuenow={rating_percentage} aria-valuemin="0" aria-valuemax="100">
<div className="progress-bar" role="progressbar" style={{ width: rating_percentage + '%' }} aria-valuenow={rating_percentage} aria-valuemin="0" aria-valuemax="100">
{/* <div className="progress-bar-number">{rating_percentage}%</div> */}
</div>
</div>

View File

@ -0,0 +1,80 @@
import React, { Component } from 'react';
import '../components/DataTables.css';
import * as moment from 'moment';
import { getBooksByYear } from "./Data.js";
const $ = require('jquery');
$.DataTable = require('datatables.net');
export default class Readed extends Component {
constructor(props) {
super(props);
this.state = {
books: []
}
}
getComponentData(init) {
getBooksByYear(this.props.year).then(readed => {
console.log(readed);
this.setState({
books: readed
})
if(init === true){
setTimeout(() => {
$('#DataTable').DataTable({
language: {
url: 'https://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Dutch.json'
},
dom: 'rt<"bottom"p><"clear">',
order: []
});
}, 1000)
}
})
}
componentDidMount() {
this.getComponentData(true);
}
componentDidUpdate(prevProps, prevState) {
if (prevProps.year !== this.props.year) {
this.getComponentData(false);
}
}
render() {
return (
<React.Fragment>
<div className="readed">
<span className="block_name">Gelezen boeken</span>
<table id="DataTable" className="table responsive nowrap" width="100%">
<thead>
<tr>
<th>Book</th>
<th>Author</th>
<th>Genre</th>
<th>Ratings</th>
</tr>
</thead>
<tbody>
{this.state.books.map((book, i) => {
var code = book.country_code.toLowerCase();
return (
<tr key={i}>
<td>{book.name}</td>
<td>{book.author} <img style={{ width: '20px' }} src={`https://flagcdn.com/32x24/${code}.png`} /></td>
<td>{book.genre}</td>
<td><i class='fas fa-star'></i>{book.rating}</td>
</tr>
)
})}
</tbody>
</table>
</div>
</React.Fragment>
)
}
}

View File

@ -1,19 +0,0 @@
import React from "react";
import { NavLink } from "react-router-dom";
function Sidebar(){
return (
<React.Fragment>
<div className='sidebar'>
<ul>
<li><NavLink to="/"><i className="fa fa-chart-bar"></i> Dashboard</NavLink></li>
<li><NavLink to="/booklist"><i className="fas fa-book"></i> Boekenlijst</NavLink></li>
</ul>
</div>
</React.Fragment>
)
}
export default Sidebar;

View File

@ -1,102 +0,0 @@
import React, { useState, useEffect } from "react";
import '../components/DataTables.css';
import * as moment from 'moment';
import Sidebar from "../components/Sidebar";
import Filters from "../components/Filters";
const $ = require('jquery');
$.DataTable = require('datatables.net');
moment.locale('nl');
function Booklist(){
var [books, setBooks] = useState([]);
const fillDataTableFilters = (filter, value, text) => {
console.log(value, text);
if (value && !filter.find("option:contains('" + text + "')").length) {
var option = new Option(value, value);
option.innerHTML = text;
filter[0].appendChild(option);
}
}
const getFlagEmoji = (countryCode) => {
const codePoints = countryCode
.toUpperCase()
.split('')
.map(char => 127397 + char.charCodeAt());
return String.fromCodePoint(...codePoints);
}
useEffect(() => {
document.title = "Boekenlijst - Reading Analytics System";
import("../components/Data.js").then(module => {
return module.getAllBooks().then(data => {
setBooks(data);
setTimeout(() => {
$('#DataTable').DataTable({
language: {
url: 'https://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Dutch.json'
},
dom: 'rt<"bottom"pl><"clear">',
order: []
});
}, 1000)
});
});
}, [])
return (
<React.Fragment>
<Sidebar />
<div className="content">
<Filters />
<div className="DataTable_Container">
<table id="DataTable" className="showHead table responsive nowrap" width="100%">
<thead>
<tr>
<th>Boek</th>
<th>Schrijver</th>
<th>Genre</th>
<th>Land</th>
<th>Aantal pagina's</th>
<th>Gelezen op</th>
<th>Beoordeling</th>
</tr>
</thead>
<tbody>
{books.map((book, i) => {
var code = book.country_code.toLowerCase();
var flag = getFlagEmoji(book.country_code);
var optionValue= book.country
var optionText = flag + ' ' + book.country;
fillDataTableFilters($('.genre'), book.genre, book.genre);
fillDataTableFilters($('.country'), optionValue, optionText);
fillDataTableFilters($('.author'), book.author, book.author);
return (
<tr key={book.id}>
<td>{book.name}</td>
<td>{book.author}</td>
<td>{book.genre}</td>
<td><img src={`https://flagcdn.com/20x15/${code}.png`} /> {book.country}</td>
<td>{book.pages}</td>
<td>{moment(book.readed).format('MMMM YYYY')}</td>
<td><i class='fas fa-star'></i>{book.rating}</td>
</tr>
)
})}
</tbody>
</table>
</div>
</div>
</React.Fragment>
)
}
export default Booklist;

View File

@ -4,8 +4,8 @@ import Countries from "../components/Countries";
import Genres from "../components/Genres";
import Books from "../components/Books";
import { getRatingsCount, getReadingYears } from "../components/Data.js";
import Sidebar from "../components/Sidebar";
import Ratings from "../components/Ratings";
import Readed from "../components/Readed";
export default class Dashboard extends Component {
@ -40,9 +40,10 @@ export default class Dashboard extends Component {
return (
<React.Fragment>
<div className="content">
<div className="chooseYear">
<i className="fa fa-calendar"></i>
<span className="stats-number">
<span className="stats-number" style={{ marginRight: '0px' }}>
<select className="yearselector" value={this.state.year} onChange={(event) => this.changeYear(event)}>
{this.state.readingYears.map((year, i) => {
return (<option key={i} value={year}>{year}</option>)
@ -50,15 +51,13 @@ export default class Dashboard extends Component {
</select>
</span>
</div>
<Sidebar />
<div className="content">
<div className="container-fluid">
<div className="row">
<div className="col-md-8">
<Challenge year={this.state.year} />
<Books year={this.state.year} />
{/* <Pages year={this.state.year} /> */}
<Readed year={this.state.year} />
</div>
<div className="col-md-4">

View File

@ -1,70 +0,0 @@
import React from "react";
import '../components/DataTables.css';
import { useNavigate } from "react-router-dom";
import * as moment from 'moment';
import { readCookie } from "../Functions";
const $ = require('jquery');
$.DataTable = require('datatables.net');
moment.locale('nl');
function Login() {
var navigate = useNavigate();
const loginSubmit = (event) => {
event.preventDefault();
var details = {
'username': event.target.username.value,
'password': event.target.password.value
};
var formBody = [];
for (var property in details) {
var encodedKey = encodeURIComponent(property);
var encodedValue = encodeURIComponent(details[property]);
formBody.push(encodedKey + "=" + encodedValue);
}
formBody = formBody.join("&");
fetch('/api/auth/login', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
"X-CSRFToken": readCookie('csrftoken')
},
body: formBody
})
.then(response => response.json())
.then(data => {
if(data.token){
localStorage.setItem("token", data.token);
navigate("/manage", { replace: true });
}else{
console.log("No Token Inside");
}
})
}
return (
<React.Fragment>
<div className="content loginbg">
<form method="POST" onSubmit={(event) => loginSubmit(event)}>
<div className="form-group">
<label htmlFor="username">Gebruikersnaam</label>
<input type="text" className="form-control username" name="username" id="username" />
</div>
<div className="form-group">
<label htmlFor="password">Wachtwoord</label>
<input type="password" className="form-control password" name="password" id="password" />
</div>
<button type="submit" className="btn btn-primary">Inloggen</button>
</form>
</div>
</React.Fragment>
)
}
export default Login;

View File

@ -1,81 +0,0 @@
import React, { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import '../../components/DataTables.css';
import * as moment from 'moment';
import SidebarManage from "../../components/manage/sidebar";
import Filters from "../../components/Filters";
const $ = require('jquery');
$.DataTable = require('datatables.net');
moment.locale('nl');
function ManageBooks() {
var [books, setBooks] = useState([]);
var navigate = useNavigate();
useEffect(() => {
if (!localStorage.getItem("token") || localStorage.getItem("token") && localStorage.getItem("token") === '') {
// window.location.href = "/login";
navigate("/login")
}
document.title = "Boeken - Beheer - Reading Analytics System";
import("../../components/Data.js").then(module => {
return module.getAllBooks().then(data => {
setBooks(data);
setTimeout(() => {
$('#DataTable').DataTable({
language: {
url: 'https://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Dutch.json',
search: "",
searchPlaceholder: "Zoeken"
},
dom: 'frt<"bottom"pl><"clear">',
order: []
});
}, 1000)
});
});
}, [])
return (
<React.Fragment>
<SidebarManage />
<div className="content-manage">
<h1>Boeken beheren <button type="button" class="btn btn-success">Toevoegen</button></h1>
<div className="DataTable_Container">
<table id="DataTable" className="showHead table responsive nowrap" width="100%">
<thead>
<tr>
<th>Boek</th>
<th>Schrijver</th>
<th>Acties</th>
</tr>
</thead>
<tbody>
{books.map((book, i) => {
return (
<tr key={book.id}>
<td>{book.name}</td>
<td>{book.author}</td>
<td>
<button type="button" class="btn btn-warning"><i class="fa fa-pen"></i></button>
<button type="button" class="btn btn-danger"><i className="fa fa-trash"></i></button>
</td>
</tr>
)
})}
</tbody>
</table>
</div>
</div>
</React.Fragment>
)
}
export default ManageBooks;

View File

@ -1,175 +0,0 @@
import React, { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import '../../components/DataTables.css';
import * as moment from 'moment';
import SidebarManage from "../../components/manage/sidebar";
const $ = require('jquery');
$.DataTable = require('datatables.net');
moment.locale('nl');
function ManageChallenges() {
var [challenges, setChallenges] = useState([]);
var navigate = useNavigate();
const addChallenge = (event) => {
event.preventDefault();
var details = {
'year': event.target.year.value,
'challenge': event.target.challenge.value
};
var formBody = [];
for (var property in details) {
var encodedKey = encodeURIComponent(property);
var encodedValue = encodeURIComponent(details[property]);
formBody.push(encodedKey + "=" + encodedValue);
}
formBody = formBody.join("&");
import("../../components/Data.js").then(module => {
return module.insertChallenge(formBody).then(data => {
module.getAllChallenges().then(challenges => {
setChallenges(challenges);
$('.modal').hide();
})
});
});
}
const deleteChallenge = (challengeid) => {
var result = confirm("Weet je zeker dat je dit wilt verwijderen?");
if (result) {
import("../../components/Data.js").then(module => {
return module.deleteChallenge(challengeid).then(data => {
module.getAllChallenges().then(challenges => {
setChallenges(challenges);
})
});
});
}
}
useEffect(() => {
if (!localStorage.getItem("token") || localStorage.getItem("token") && localStorage.getItem("token") === '') {
// window.location.href = "/login";
navigate("/login")
}
document.title = "Challenges - Beheer - Reading Analytics System";
import("../../components/Data.js").then(module => {
return module.getAllChallenges().then(data => {
setChallenges(data);
setTimeout(() => {
$('#DataTable').DataTable({
language: {
url: 'https://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Dutch.json',
search: "",
searchPlaceholder: "Zoeken"
},
dom: 'rt<"bottom"pl><"clear">',
order: []
});
}, 1000)
});
});
}, [])
$('.btn-add').on('click', function () {
$('.modal').show();
});
$('.modal .close, .modal .cancel').on('click', function () {
$('.modal').hide();
});
return (
<React.Fragment>
<SidebarManage />
<div className="content-manage">
<h1>Challenges beheren <button type="button" className="btn btn-success btn-add">Toevoegen</button></h1>
<div className="DataTable_Container">
<table id="DataTable" className="showHead table responsive nowrap" width="100%">
<thead>
<tr>
<th>Jaar</th>
<th>Challenge</th>
<th>Voortgang</th>
<th>Acties</th>
</tr>
</thead>
<tbody>
{challenges.map((challenge, i) => {
var challengePercentage = Math.round((challenge.booksread / challenge.nrofbooks) * 100, 0);
return (
<tr key={challenge.id}>
<td width="150px">{challenge.year}</td>
<td width="150px">{challenge.nrofbooks}</td>
<td>
<div className="progress">
<div className="progress-bar progress-bar-striped" role="progressbar" style={{ width: challengePercentage + '%' }} aria-valuenow={challengePercentage} aria-valuemin="0" aria-valuemax="100">
<div className="progress-bar-number">{challengePercentage}%</div>
</div>
</div>
</td>
<td width="150px">
<button type="button" className="btn btn-warning"><i className="fa fa-pen"></i></button>
<button type="button" onClick={() => deleteChallenge(challenge.id)} className="btn btn-danger"><i className="fa fa-trash"></i></button>
</td>
</tr>
)
})}
</tbody>
</table>
</div>
<div className="modal" tabIndex="-1" role="dialog">
<div className="modal-dialog" role="document">
<div className="modal-content">
<div className="modal-header">
<h5 className="modal-title">Challenge toevoegen</h5>
<button type="button" className="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<form method="POST" onSubmit={(event) => addChallenge(event)}>
<div className="modal-body">
<div className="form-group">
<label htmlFor="year">Jaar</label>
<input type="text" className="form-control" id="year"/>
</div>
<div className="form-group">
<label htmlFor="challenge">Aantal boeken</label>
<input type="text" className="form-control" id="challenge" />
</div>
</div>
<div className="modal-footer">
<button type="submit" className="btn btn-success">Toevoegen</button>
<button type="button" className="btn btn-danger cancel" data-dismiss="modal">Annuleren</button>
</div>
</form>
</div>
</div>
</div>
</div>
</React.Fragment>
)
}
export default ManageChallenges;

View File

@ -3,6 +3,9 @@ html, body{
margin:0;
padding:0;
font-family: 'Source Sans Pro', sans-serif;
letter-spacing: .3px;
font-weight: 400;
color:#333;
}
h1{
@ -78,12 +81,12 @@ html, body{
height:600px !important;
}
.books-per-month, .genresPercent, .books-per-country, .book, .ratings{
.books-per-month, .genresPercent, .books-per-country, .book, .ratings, .readed{
background: #ffffff;
padding: 20px;
box-shadow: 0 2px 0px 1px rgb(0 0 0 / 3%);
-webkit-box-shadow: 0 1px 20px 0 rgba(69,90,100,.08);
box-shadow: 0 1px 20px 0 rgba(69,90,100,.08);
margin-bottom: 20px;
border-radius: 10px;
}
.book .book-icon{
@ -257,19 +260,20 @@ html, body{
.books-stats .stat-block, .stat-block{
background: #ffffff;
box-shadow: 0 2px 0px 1px rgb(0 0 0 / 3%);
-webkit-box-shadow: 0 1px 20px 0 rgba(69,90,100,.08);
box-shadow: 0 1px 20px 0 rgba(69,90,100,.08);
padding: 15px 5px;
color: #101010;
color: #333;
text-align: center;
border-radius: 10px;
}
.chooseYear{
float: right;
margin-top: 10px;
padding: 12px 15px;
border-radius: 10px;
font-size:14px;
position: fixed;
bottom: 10px;
right: 10px;
background: #404e67;
padding: 10px;
text-align: center;
}
.chooseYear i{
@ -321,17 +325,18 @@ html, body{
}
.books-stats .stat-block .stats-number, .stats-number{
font-weight: 600;
font-weight: 400;
display: inline-block;
margin-left: 10px;
font-size: 18px;
font-size: 16px;
margin-right: 10px;
color: #333;
}
.books-stats .stat-block .stats-label, .stats-label{
color: #a7adbd;
font-weight: 400;
font-size: 18px;
font-size: 16px;
}
.yearselector{
@ -359,6 +364,7 @@ html, body{
.table td img{
margin-right:5px;
width:20px;
}
.showHead thead{
@ -372,13 +378,14 @@ html, body{
span.block_name{
color: #101010;
font-weight: 600;
color: #333;
font-weight: 400;
border-bottom: solid 1px #f5f6fa;
width: 100%;
display: block;
padding-bottom: 10px;
margin-bottom: 10px;
letter-spacing: .3px;
}
.stat-block .progress{
@ -393,14 +400,14 @@ html, body{
}
.stat-block .progress-bar{
background-color: #8066ee;
background-color: #404e67;
position: relative;
overflow: visible;
border-right: solid 2px #333;
}
.progress-bar{
background-color: #8066ee;
background-color: #404e67;
position: relative;
overflow: visible;
}
@ -413,6 +420,7 @@ html, body{
padding: 10px;
top: -20px;
right: -20px;
letter-spacing: .3px;
}
.loading-screen-overlay{

File diff suppressed because one or more lines are too long

View File

@ -6,42 +6,14 @@
!*** ./src/index.js ***!
\**********************/
/*!**************************!*\
!*** ./src/Functions.js ***!
\**************************/
/*!****************************!*\
!*** ./src/views/login.js ***!
\****************************/
/*!***********************************!*\
!*** ./src/components/Filters.js ***!
\***********************************/
/*!***********************************!*\
!*** ./src/views/manage/books.js ***!
\***********************************/
/*!*************************************!*\
!*** ./node_modules/react/index.js ***!
\*************************************/
/*!***************************************!*\
!*** ./node_modules/moment/moment.js ***!
\***************************************/
/*!***************************************!*\
!*** ./src/components/DataTables.css ***!
\***************************************/
/*!****************************************!*\
!*** ./node_modules/react-is/index.js ***!
\****************************************/
/*!****************************************!*\
!*** ./src/views/manage/challenges.js ***!
\****************************************/
/*!*****************************************!*\
!*** ./node_modules/react-dom/index.js ***!
\*****************************************/
@ -50,570 +22,18 @@
!*** ./node_modules/scheduler/index.js ***!
\*****************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/af.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ar.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/az.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/be.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/bg.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/bm.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/bn.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/bo.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/br.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/bs.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ca.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/cs.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/cv.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/cy.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/da.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/de.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/dv.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/el.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/eo.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/es.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/et.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/eu.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/fa.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/fi.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/fo.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/fr.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/fy.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ga.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/gd.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/gl.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/gu.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/he.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/hi.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/hr.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/hu.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/id.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/is.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/it.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ja.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/jv.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ka.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/kk.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/km.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/kn.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ko.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ku.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ky.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/lb.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/lo.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/lt.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/lv.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/me.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/mi.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/mk.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ml.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/mn.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/mr.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ms.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/mt.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/my.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/nb.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ne.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/nl.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/nn.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/pl.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/pt.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ro.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ru.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/sd.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/se.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/si.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/sk.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/sl.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/sq.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/sr.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ss.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/sv.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/sw.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ta.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/te.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/tg.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/th.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/tk.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/tr.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/uk.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/ur.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/uz.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/vi.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/moment/locale/yo.js ***!
\******************************************/
/*!******************************************!*\
!*** ./node_modules/react-dom/client.js ***!
\******************************************/
/*!******************************************!*\
!*** ./src/components/manage/sidebar.js ***!
\******************************************/
/*!*******************************************!*\
!*** ./node_modules/moment/locale/fil.js ***!
\*******************************************/
/*!*******************************************!*\
!*** ./node_modules/moment/locale/tet.js ***!
\*******************************************/
/*!*******************************************!*\
!*** ./node_modules/moment/locale/tlh.js ***!
\*******************************************/
/*!*******************************************!*\
!*** ./node_modules/moment/locale/tzl.js ***!
\*******************************************/
/*!*******************************************!*\
!*** ./node_modules/moment/locale/tzm.js ***!
\*******************************************/
/*!********************************************!*\
!*** ./node_modules/jquery/dist/jquery.js ***!
\********************************************/
/*!********************************************!*\
!*** ./node_modules/shallowequal/index.js ***!
\********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ar-dz.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ar-kw.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ar-ly.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ar-ma.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ar-sa.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ar-tn.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/bn-bd.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/de-at.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/de-ch.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-au.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-ca.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-gb.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-ie.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-il.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-in.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-nz.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/en-sg.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/es-do.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/es-mx.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/es-us.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/fr-ca.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/fr-ch.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/hy-am.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/it-ch.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ms-my.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/nl-be.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/pa-in.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/pt-br.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/tl-ph.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/ug-cn.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/zh-cn.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/zh-hk.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/zh-mo.js ***!
\*********************************************/
/*!*********************************************!*\
!*** ./node_modules/moment/locale/zh-tw.js ***!
\*********************************************/
/*!**********************************************!*\
!*** ./node_modules/moment/locale/oc-lnc.js ***!
\**********************************************/
/*!***********************************************!*\
!*** ./node_modules/moment/locale/sr-cyrl.js ***!
\***********************************************/
/*!***********************************************!*\
!*** ./node_modules/moment/locale/uz-latn.js ***!
\***********************************************/
/*!************************************************!*\
!*** ./node_modules/moment/locale/gom-deva.js ***!
\************************************************/
/*!************************************************!*\
!*** ./node_modules/moment/locale/gom-latn.js ***!
\************************************************/
/*!************************************************!*\
!*** ./node_modules/moment/locale/tzm-latn.js ***!
\************************************************/
/*!************************************************!*\
!*** ./node_modules/moment/locale/x-pseudo.js ***!
\************************************************/
/*!*************************************************!*\
!*** ./node_modules/react-router/dist/index.js ***!
\*************************************************/
/*!***************************************************!*\
!*** ./node_modules/moment/locale/ sync ^\.\/.*$ ***!
\***************************************************/
/*!***************************************************!*\
!*** ./node_modules/styled-tools/dist/es/prop.js ***!
\***************************************************/
@ -626,10 +46,6 @@
!*** ./node_modules/styled-tools/dist/es/theme.js ***!
\****************************************************/
/*!*****************************************************!*\
!*** ./node_modules/css-loader/dist/runtime/api.js ***!
\*****************************************************/
/*!*****************************************************!*\
!*** ./node_modules/react-router-dom/dist/index.js ***!
\*****************************************************/
@ -682,22 +98,10 @@
!*** ./node_modules/scheduler/cjs/scheduler.development.js ***!
\*************************************************************/
/*!**************************************************************!*\
!*** ./node_modules/css-loader/dist/runtime/noSourceMaps.js ***!
\**************************************************************/
/*!**************************************************************!*\
!*** ./node_modules/datatables.net/js/jquery.dataTables.mjs ***!
\**************************************************************/
/*!***************************************************************!*\
!*** ./node_modules/react-loader-spinner/dist/esm/helpers.js ***!
\***************************************************************/
/*!***************************************************************!*\
!*** ./node_modules/style-loader/dist/runtime/styleDomAPI.js ***!
\***************************************************************/
/*!*****************************************************************!*\
!*** ./node_modules/@emotion/stylis/dist/stylis.browser.esm.js ***!
\*****************************************************************/
@ -742,10 +146,6 @@
!*** ./node_modules/react-loader-spinner/dist/esm/loader/Watch.js ***!
\********************************************************************/
/*!********************************************************************!*\
!*** ./node_modules/style-loader/dist/runtime/insertBySelector.js ***!
\********************************************************************/
/*!*********************************************************************!*\
!*** ./node_modules/react-loader-spinner/dist/esm/loader/Blocks.js ***!
\*********************************************************************/
@ -758,10 +158,6 @@
!*** ./node_modules/react-loader-spinner/dist/esm/loader/Vortex.js ***!
\*********************************************************************/
/*!*********************************************************************!*\
!*** ./node_modules/style-loader/dist/runtime/styleTagTransform.js ***!
\*********************************************************************/
/*!**********************************************************************!*\
!*** ./node_modules/react-loader-spinner/dist/esm/loader/Circles.js ***!
\**********************************************************************/
@ -774,10 +170,6 @@
!*** ./node_modules/react-loader-spinner/dist/esm/loader/Discuss.js ***!
\**********************************************************************/
/*!**********************************************************************!*\
!*** ./node_modules/style-loader/dist/runtime/insertStyleElement.js ***!
\**********************************************************************/
/*!***********************************************************************!*\
!*** ./node_modules/react-loader-spinner/dist/esm/loader/LineWave.js ***!
\***********************************************************************/
@ -834,14 +226,6 @@
!*** ./node_modules/react-loader-spinner/dist/esm/loader/RotatingLines.js ***!
\****************************************************************************/
/*!****************************************************************************!*\
!*** ./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js ***!
\****************************************************************************/
/*!*****************************************************************************!*\
!*** ./node_modules/css-loader/dist/cjs.js!./src/components/DataTables.css ***!
\*****************************************************************************/
/*!*****************************************************************************!*\
!*** ./node_modules/react-loader-spinner/dist/esm/loader/CirclesWithBar.js ***!
\*****************************************************************************/
@ -870,10 +254,6 @@
!*** ./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js ***!
\**********************************************************************************/
/*!**********************************************************************************!*\
!*** ./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js ***!
\**********************************************************************************/
/*!****************************************************************************************************!*\
!*** ./node_modules/styled-components/node_modules/@emotion/unitless/dist/unitless.browser.esm.js ***!
\****************************************************************************************************/

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -2,6 +2,10 @@
!*** ./src/views/booklist.js ***!
\*******************************/
/*!***********************************!*\
!*** ./src/components/Filters.js ***!
\***********************************/
/*!***********************************!*\
!*** ./src/components/Sidebar.js ***!
\***********************************/

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,51 @@
/*!**************************!*\
!*** ./src/Functions.js ***!
\**************************/
/*!********************************!*\
!*** ./src/components/Data.js ***!
\********************************/
/*!********************************!*\
!*** ./src/views/dashboard.js ***!
\********************************/
/*!*********************************!*\
!*** ./src/components/Books.js ***!
\*********************************/
/*!**********************************!*\
!*** ./src/components/Charts.js ***!
\**********************************/
/*!**********************************!*\
!*** ./src/components/Genres.js ***!
\**********************************/
/*!**********************************!*\
!*** ./src/components/Readed.js ***!
\**********************************/
/*!***********************************!*\
!*** ./src/components/Ratings.js ***!
\***********************************/
/*!*************************************!*\
!*** ./src/components/Challenge.js ***!
\*************************************/
/*!*************************************!*\
!*** ./src/components/Countries.js ***!
\*************************************/
/*!***************************************!*\
!*** ./src/components/DataTables.css ***!
\***************************************/
/*!***************************************************!*\
!*** ./node_modules/moment/locale/ sync ^\.\/.*$ ***!
\***************************************************/
/*!*****************************************************************************!*\
!*** ./node_modules/css-loader/dist/cjs.js!./src/components/DataTables.css ***!
\*****************************************************************************/

File diff suppressed because one or more lines are too long

View File

@ -18,6 +18,10 @@
!*** ./src/components/Genres.js ***!
\**********************************/
/*!**********************************!*\
!*** ./src/components/Readed.js ***!
\**********************************/
/*!***********************************!*\
!*** ./src/components/Ratings.js ***!
\***********************************/