move table components to row 1 if showing less than 1 day of data

This commit is contained in:
Danny van Kooten 2018-10-10 16:43:36 +02:00
parent f92d04a4ba
commit fc5bd47f53
3 changed files with 6 additions and 2 deletions

View File

@ -136,6 +136,8 @@ class Chart extends Component {
@bind
redrawChart() {
let data = this.state.data;
// hide chart & bail if we're trying to show less than 1 day worth of data
this.base.parentNode.style.display = data.length <= 1 ? 'none' : '';
if(data.length <= 1) {
return;

View File

@ -12,6 +12,7 @@ import Table from '../components/Table.js';
import Chart from '../components/Chart.js';
import { bind } from 'decko';
import Client from '../lib/client.js';
import classNames from 'classnames';
const defaultSite = {
id: window.localStorage.getItem('site_id') || 1,
@ -146,7 +147,7 @@ class Dashboard extends Component {
return (
<div class="app-page ">
<div class={"rapper animated fadeInUp delayed_02s " + state.period }>
<div class={`rapper animated fadeInUp delayed_02s ${state.period} ` + classNames({ ltday: state.before - state.after < 86400 })}>
<header class="section">
<nav class="main-nav">

View File

@ -129,7 +129,8 @@ body { font: 400 16px "overpass", sans-serif; color: #222; text-align: center; p
.box-pages { grid-column: 2; grid-row: 2 ; }
.box-referrers { grid-column: 3; grid-row: 2; }
.today .box-pages, .today .box-referrers{ grid-row: 1; }
/* since we hide chart for views with less than a day worth of data, move tables to row 1 */
.ltday .box-pages, .ltday .box-referrers{ grid-row: 1; }
.half { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 12px; align-items: center; }
.half div { text-align: right; }