theming of previews and sidebar

This commit is contained in:
2020-08-03 18:38:22 +00:00
parent 226f718348
commit 8bea726e98
5 changed files with 27 additions and 9 deletions

View File

@ -38,8 +38,8 @@ class Preview extends React.Component {
render() {
const themeStyle = StaticInfos.isDarkTheme() ? darktheme : lighttheme;
return (
<div className={style.videopreview + ' ' + themeStyle.previewhover} onClick={() => this.itemClick()}>
<div className={style.previewtitle}>{this.state.name}</div>
<div className={style.videopreview + ' ' + themeStyle.secbackground + ' '+ themeStyle.preview} onClick={() => this.itemClick()}>
<div className={style.previewtitle + ' '+ themeStyle.lighttextcolor}>{this.state.name}</div>
<div className={style.previewpic}>
{this.state.previewpicture != null ?
<img className={style.previewimage}

View File

@ -1,6 +1,5 @@
.previewtitle {
height: 20px;
color: #3d3d3d;
text-align: center;
font-weight: bold;
max-width: 266px;
@ -36,8 +35,6 @@
float: left;
margin-left: 25px;
margin-top: 25px;
/*background-color: #7F7F7F;*/
background-color: #a8c3ff;
cursor: pointer;
opacity: 0.85;
border-radius: 20px;

View File

@ -1,9 +1,13 @@
import React from "react";
import style from "./SideBar.module.css"
import StaticInfos from "../../GlobalInfos";
import darktheme from "../../AppDarkTheme.module.css";
import lighttheme from "../../AppLightTheme.module.css";
class SideBar extends React.Component {
render() {
return (<div className={style.sideinfo}>
const themeStyle = StaticInfos.isDarkTheme() ? darktheme : lighttheme;
return (<div className={style.sideinfo + ' '+ themeStyle.secbackground}>
{this.props.children}
</div>);
}
@ -11,8 +15,9 @@ class SideBar extends React.Component {
export class SideBarTitle extends React.Component {
render() {
const themeStyle = StaticInfos.isDarkTheme() ? darktheme : lighttheme;
return (
<div className={style.sidebartitle}>{this.props.children}</div>
<div className={style.sidebartitle + ' '+ themeStyle.subtextcolor}>{this.props.children}</div>
);
}
}