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

use css modules in app styles

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-08-30 11:26:41 +03:00
parent 4307df638a
commit 364daa319e
3 changed files with 9 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/App/App.js
View file

@ -2,7 +2,7 @@ const React = require('react');
const { Router } = require('stremio-router'); const { Router } = require('stremio-router');
const { KeyboardNavigation, ServicesProvider } = require('stremio/services'); const { KeyboardNavigation, ServicesProvider } = require('stremio/services');
const routerViewsConfig = require('./routerViewsConfig'); const routerViewsConfig = require('./routerViewsConfig');
require('./styles'); const styles = require('./styles');
const App = () => { const App = () => {
const onPathNotMatch = React.useCallback(() => { const onPathNotMatch = React.useCallback(() => {
@ -18,6 +18,7 @@ const App = () => {
<React.StrictMode> <React.StrictMode>
<ServicesProvider services={services}> <ServicesProvider services={services}>
<Router <Router
className={styles['router']}
homePath={'/'} homePath={'/'}
viewsConfig={routerViewsConfig} viewsConfig={routerViewsConfig}
onPathNotMatch={onPathNotMatch} onPathNotMatch={onPathNotMatch}

9
src/App/styles.less
View file

@ -1,7 +1,10 @@
@import (inline, once, css) 'stremio-colors/css/stremio-colors.css'; @import (inline, once, css) 'stremio-colors/css/stremio-colors.css';
@import (inline, once, css) 'router/styles.css';
@import (reference) 'common/screen-sizes.less'; @import (reference) 'common/screen-sizes.less';
:global {
@import (once, less) 'router/styles.css';
}
@font-face { @font-face {
font-family: 'Roboto'; font-family: 'Roboto';
src: url('/fonts/Roboto-Light.ttf') format('truetype'); src: url('/fonts/Roboto-Light.ttf') format('truetype');
@ -85,7 +88,7 @@
background-color: var(--color-backgroundlight); background-color: var(--color-backgroundlight);
} }
html, body, #app { html, body, :global(#app) {
position: relative; position: relative;
z-index: 0; z-index: 0;
width: 100vw; width: 100vw;
@ -95,7 +98,7 @@ html, body, #app {
font-family: 'Roboto', 'sans-serif'; font-family: 'Roboto', 'sans-serif';
overflow: auto; overflow: auto;
.routes-container { .router {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }

3
webpack.config.js
View file

@ -44,8 +44,7 @@ module.exports = {
importLoaders: 2, importLoaders: 2,
modules: { modules: {
getLocalIdent: (context, localIdentName, localName, options) => { getLocalIdent: (context, localIdentName, localName, options) => {
if (context.resourcePath.startsWith(path.resolve(__dirname, 'src/routes')) || if (context.resourcePath.startsWith(path.resolve(__dirname, 'src/routes'))) {
context.resourcePath.startsWith(path.resolve(__dirname, 'src/App'))) {
localIdentName = '[local]'; localIdentName = '[local]';
} else { } else {
localIdentName = '[local]-[hash:base64:5]'; localIdentName = '[local]-[hash:base64:5]';