Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

breaking changes in app styles

Browse source
This commit is contained in:
NikolaBorislavovHristov 2018-11-15 15:55:54 +02:00
parent 2335e6d7a0
commit d396d9038b
4 changed files with 116 additions and 122 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/app/app.js
View file

@ -6,13 +6,10 @@ import styles from './styles';
class App extends PureComponent {
render() {
return (
<div className={styles['app']}>
<Router
routerContainerClassName={styles['router-container']}
routeContainerClassName={styles['route-container']}
config={routerConfig}
/>
</div>
);
}
}

108
src/app/styles.less
View file

@ -1,116 +1,10 @@
@import 'stremio-colors';
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-LightItalic.ttf') format('truetype');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Italic.ttf') format('truetype');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-SemiBoldItalic.ttf') format('truetype');
font-weight: 600;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-BoldItalic.ttf') format('truetype');
font-weight: 700;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-ExtraBold.ttf') format('truetype');
font-weight: 800;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-ExtraBoldItalic.ttf') format('truetype');
font-weight: 800;
font-style: italic;
}
@font-face {
font-family: 'Lato';
src: url('/fonts/Lato.ttf') format('truetype');
}
@font-face {
font-family: 'LatoLight';
src: url('/fonts/Lato-Light.ttf') format('truetype');
}
* {
margin: 0px;
padding: 0px;
border: none;
list-style: none;
user-select: none;
box-sizing: border-box;
text-decoration: none;
font-weight: normal;
}
html, body, .app {
position: relative;
width: 100vw;
height: 100vh;
min-width: 1000px;
min-height: 650px;
overflow: hidden;
background-color: @colorbgmain;
font: 13px / 18px 'Open Sans', 'LatoLight', 'Arial', 'Helvetica', 'sans-serif';
}
.router-container {
position: relative;
width: 100%;
height: 100%;
.route-container {
.route-container {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: @colorbgmain;
}
}

6
src/common/Router/Router.js
View file

@ -1,4 +1,4 @@
import React, { Component } from 'react';
import React, { Component, Fragment } from 'react';
import pathToRegexp from 'path-to-regexp';
import PathUtils from 'path';
import UrlUtils from 'url';
@ -95,13 +95,13 @@ class Router extends Component {
render() {
return (
<div className={this.props.routerContainerClassName}>
<Fragment>
{
this.state.views
.filter(({ element }) => React.isValidElement(element))
.map(({ path, element }) => <div key={path} className={this.props.routeContainerClassName}>{element}</div>)
}
</div>
</Fragment>
);
}
}

103
src/index.html
View file

@ -4,6 +4,109 @@
<head>
<meta charset="UTF-8">
<title>Stremio - All you can watch!</title>
<style>
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-LightItalic.ttf') format('truetype');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Italic.ttf') format('truetype');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-SemiBoldItalic.ttf') format('truetype');
font-weight: 600;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-BoldItalic.ttf') format('truetype');
font-weight: 700;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-ExtraBold.ttf') format('truetype');
font-weight: 800;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/fonts/OpenSans-ExtraBoldItalic.ttf') format('truetype');
font-weight: 800;
font-style: italic;
}
@font-face {
font-family: 'Lato';
src: url('/fonts/Lato.ttf') format('truetype');
}
@font-face {
font-family: 'LatoLight';
src: url('/fonts/Lato-Light.ttf') format('truetype');
}
* {
margin: 0px;
padding: 0px;
border: none;
list-style: none;
user-select: none;
box-sizing: border-box;
text-decoration: none;
font-weight: normal;
}
html, body, #app {
position: relative;
width: 100vw;
height: 100vh;
min-width: 1000px;
min-height: 650px;
overflow: hidden;
font: 13px / 18px 'Open Sans', 'LatoLight', 'Arial', 'Helvetica', 'sans-serif';
z-index: 0;
}
</style>
</head>
<body>