Updated sticky header logic.

This commit is contained in:
Mike Cao 2023-02-09 08:22:36 -08:00
parent 45c13da262
commit f062cdbed2
8 changed files with 31 additions and 24 deletions

View file

@ -2,21 +2,25 @@
display: flex;
flex-direction: column;
justify-content: center;
min-height: 90px;
min-width: 140px;
}
.value {
min-height: 36px;
display: flex;
align-items: center;
font-size: 36px;
font-weight: 700;
white-space: nowrap;
min-height: 60px;
}
.label {
white-space: nowrap;
display: flex;
align-items: center;
gap: 5px;
white-space: nowrap;
min-height: 30px;
}
.change {

View file

@ -2,10 +2,7 @@
display: flex;
cursor: pointer;
min-height: 80px;
}
.bar > div + div {
padding-left: 20px;
gap: 20px;
}
@media only screen and (max-width: 992px) {

View file

@ -1,6 +1,6 @@
import { useMemo } from 'react';
import { useIntl } from 'react-intl';
import { Button, Icon, Text, Row, Column, Loading } from 'react-basics';
import { Button, Icon, Text, Row, Column, Container } from 'react-basics';
import Link from 'next/link';
import PageviewsChart from './PageviewsChart';
import MetricsBar from './MetricsBar';

View file

@ -18,6 +18,7 @@
.header {
min-height: 90px;
margin-bottom: 20px;
}
.metrics {
@ -25,16 +26,15 @@
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
}
.sticky {
position: fixed;
top: 0;
margin: auto;
background: var(--base50);
border-bottom: 1px solid var(--base300);
z-index: 3;
width: inherit;
}
.filter {