easier getter function to get themestyle
better dark theme for SideBar.js
This commit is contained in:
@ -5,7 +5,7 @@ import videocontainerstyle from "../../elements/VideoContainer/VideoContainer.mo
|
||||
|
||||
import {TagPreview} from "../../elements/Preview/Preview";
|
||||
import NewTagPopup from "../../elements/NewTagPopup/NewTagPopup";
|
||||
import PageTitle from "../../elements/PageTitle/PageTitle";
|
||||
import PageTitle, {Line} from "../../elements/PageTitle/PageTitle";
|
||||
import VideoContainer from "../../elements/VideoContainer/VideoContainer";
|
||||
|
||||
class CategoryPage extends React.Component {
|
||||
@ -56,7 +56,7 @@ class CategoryPage extends React.Component {
|
||||
this.loadTag(e.props.category)
|
||||
}
|
||||
}}>HD</Tag>
|
||||
<hr/>
|
||||
<Line/>
|
||||
<button data-testid='btnaddtag' className='btn btn-success' onClick={() => {
|
||||
this.setState({popupvisible: true})
|
||||
}}>Add a new Tag!
|
||||
|
@ -4,7 +4,7 @@ import Tag from "../../elements/Tag/Tag";
|
||||
import VideoContainer from "../../elements/VideoContainer/VideoContainer";
|
||||
|
||||
import style from "./HomePage.module.css"
|
||||
import PageTitle from "../../elements/PageTitle/PageTitle";
|
||||
import PageTitle, {Line} from "../../elements/PageTitle/PageTitle";
|
||||
|
||||
class HomePage extends React.Component {
|
||||
constructor(props, context) {
|
||||
@ -138,13 +138,13 @@ class HomePage extends React.Component {
|
||||
</PageTitle>
|
||||
<SideBar>
|
||||
<SideBarTitle>Infos:</SideBarTitle>
|
||||
<hr/>
|
||||
<Line/>
|
||||
<SideBarItem><b>{this.state.sideinfo.videonr}</b> Videos Total!</SideBarItem>
|
||||
<SideBarItem><b>{this.state.sideinfo.fullhdvideonr}</b> FULL-HD Videos!</SideBarItem>
|
||||
<SideBarItem><b>{this.state.sideinfo.hdvideonr}</b> HD Videos!</SideBarItem>
|
||||
<SideBarItem><b>{this.state.sideinfo.sdvideonr}</b> SD Videos!</SideBarItem>
|
||||
<SideBarItem><b>{this.state.sideinfo.tagnr}</b> different Tags!</SideBarItem>
|
||||
<hr/>
|
||||
<Line/>
|
||||
<SideBarTitle>Default Tags:</SideBarTitle>
|
||||
<Tag viewbinding={this.props.viewbinding}>All</Tag>
|
||||
<Tag viewbinding={this.props.viewbinding}>FullHd</Tag>
|
||||
|
@ -1,14 +1,11 @@
|
||||
import React from "react";
|
||||
import style from "./Player.module.css"
|
||||
import darktheme from "../../AppDarkTheme.module.css"
|
||||
import lighttheme from "../../AppLightTheme.module.css"
|
||||
|
||||
import {PlyrComponent} from 'plyr-react';
|
||||
import SideBar, {SideBarTitle, SideBarItem} from "../../elements/SideBar/SideBar";
|
||||
import Tag from "../../elements/Tag/Tag";
|
||||
import AddTagPopup from "../../elements/AddTagPopup/AddTagPopup";
|
||||
import PageTitle from "../../elements/PageTitle/PageTitle";
|
||||
import StaticInfos from "../../GlobalInfos";
|
||||
import PageTitle, {Line} from "../../elements/PageTitle/PageTitle";
|
||||
|
||||
|
||||
class Player extends React.Component {
|
||||
@ -49,7 +46,6 @@ class Player extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const themeStyle = StaticInfos.isDarkTheme() ? darktheme : lighttheme;
|
||||
return (
|
||||
<div id='videocontainer'>
|
||||
<PageTitle
|
||||
@ -58,13 +54,13 @@ class Player extends React.Component {
|
||||
|
||||
<SideBar>
|
||||
<SideBarTitle>Infos:</SideBarTitle>
|
||||
<hr className={themeStyle.hrcolor}/>
|
||||
<Line/>
|
||||
<SideBarItem><b>{this.state.likes}</b> Likes!</SideBarItem>
|
||||
{this.state.quality !== 0 ?
|
||||
<SideBarItem><b>{this.state.quality}p</b> Quality!</SideBarItem> : null}
|
||||
{this.state.length !== 0 ?
|
||||
<SideBarItem><b>{Math.round(this.state.length / 60)}</b> Minutes of length!</SideBarItem>: null}
|
||||
<hr/>
|
||||
<Line/>
|
||||
<SideBarTitle>Tags:</SideBarTitle>
|
||||
{this.state.tags.map((m) => (
|
||||
<Tag
|
||||
|
@ -2,8 +2,6 @@ import React from "react";
|
||||
import {Button, Col, Form} from "react-bootstrap";
|
||||
import style from "./GeneralSettings.module.css"
|
||||
import StaticInfos from "../../GlobalInfos";
|
||||
import darktheme from "../../AppDarkTheme.module.css";
|
||||
import lighttheme from "../../AppLightTheme.module.css";
|
||||
|
||||
class GeneralSettings extends React.Component {
|
||||
constructor(props) {
|
||||
@ -40,7 +38,7 @@ class GeneralSettings extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const themeStyle = StaticInfos.isDarkTheme() ? darktheme : lighttheme;
|
||||
const themeStyle = StaticInfos.getThemeStyle();
|
||||
return (
|
||||
<>
|
||||
<div className={style.GeneralForm + ' ' + themeStyle.subtextcolor}>
|
||||
|
@ -2,6 +2,7 @@ import React from "react";
|
||||
import MovieSettings from "./MovieSettings";
|
||||
import GeneralSettings from "./GeneralSettings";
|
||||
import style from "./SettingsPage.module.css"
|
||||
import StaticInfos from "../../GlobalInfos";
|
||||
|
||||
|
||||
class SettingsPage extends React.Component {
|
||||
@ -27,9 +28,10 @@ class SettingsPage extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const themestyle = StaticInfos.getThemeStyle();
|
||||
return (
|
||||
<div>
|
||||
<div className={style.SettingsSidebar}>
|
||||
<div className={style.SettingsSidebar + ' ' + themestyle.secbackground}> {/* todo: test style */}
|
||||
<div className={style.SettingsSidebarTitle}>Settings</div>
|
||||
<div onClick={() => this.setState({currentpage: "general"})}
|
||||
className={style.SettingSidebarElement}>General
|
||||
|
Reference in New Issue
Block a user