mirror of
https://github.com/discourse/discourse.git
synced 2024-12-02 14:56:22 +08:00
14b436923c
### UI changes
All of the UI changes described are gated behind the `use_legacy_pageviews`
site setting.
This commit changes the admin dashboard pageviews report to
use the "Consolidated Pageviews with Browser Detection" report
introduced in 2f2da72747 with
the following changes:
* The report name is changed to "Site traffic"
* The pageview count on the dashboard is counting only using the new method
* The old "Consolidated Pageviews" report is renamed as "Consolidated Legacy Pageviews"
* By default "known crawlers" and "other" sources of pageviews are hidden on the report
When `use_legacy_pageviews` is `true`, we do not show or allow running
the "Site traffic" report for admins. When `use_legacy_pageviews` is `false`,
we do not show or allow running the following legacy reports:
* consolidated_page_views
* consolidated_page_views_browser_detection
* page_view_anon_reqs
* page_view_logged_in_reqs
### Historical data changes
Also part of this change is that, since we introduced our new "Consolidated
Pageviews with Browser Detection" report, some admins are confused at either:
* The lack of data before a certain date , which didn’t exist before
we started collecting it
* Comparing this and the current "Consolidated Pageviews" report data,
which rolls up "Other Pageviews" into "Anonymous Browser" and so it
appears inaccurate
All pageview data in the new report before the date where the _first_
anon or logged in browser pageview was recorded is now hidden.
691 lines
12 KiB
SCSS
691 lines
12 KiB
SCSS
.admin-reports,
|
|
.dashboard-next {
|
|
&.admin-contents {
|
|
nav {
|
|
position: relative;
|
|
width: calc(100% + 10px);
|
|
padding-left: 10px;
|
|
margin-left: -10px;
|
|
margin-right: -10px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.dashboard-next {
|
|
.nav {
|
|
display: flex;
|
|
margin: 0 0 2em 0;
|
|
border-bottom: 1px solid var(--primary-low);
|
|
font-size: var(--font-up-1);
|
|
white-space: nowrap;
|
|
flex-wrap: nowrap;
|
|
overflow-x: auto;
|
|
|
|
// Fade-out for horizontal scroll nav
|
|
&:before {
|
|
content: "";
|
|
position: absolute;
|
|
width: 10px;
|
|
margin-left: -10px;
|
|
height: 100%;
|
|
background: linear-gradient(
|
|
to left,
|
|
rgba(var(--secondary-rgb), 1),
|
|
rgba(var(--secondary-rgb), 0)
|
|
);
|
|
}
|
|
&:after {
|
|
content: "";
|
|
position: absolute;
|
|
right: 0px;
|
|
width: 30px;
|
|
height: 100%;
|
|
background: linear-gradient(
|
|
to right,
|
|
rgba(var(--secondary-rgb), 0),
|
|
rgba(var(--secondary-rgb), 1)
|
|
);
|
|
}
|
|
|
|
.navigation-link {
|
|
.emoji {
|
|
margin-right: 0.5em;
|
|
}
|
|
}
|
|
}
|
|
|
|
.sections {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.section-columns {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
@include breakpoint(medium) {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.section-column {
|
|
min-width: calc(50% - 0.5em);
|
|
max-width: 100%;
|
|
|
|
&:last-child {
|
|
margin-left: 0.5em;
|
|
}
|
|
|
|
&:first-child {
|
|
margin-right: 0.5em;
|
|
}
|
|
|
|
@include breakpoint(medium) {
|
|
min-width: 100%;
|
|
|
|
&:last-child {
|
|
order: 1;
|
|
}
|
|
|
|
&:first-child {
|
|
order: 2;
|
|
}
|
|
}
|
|
}
|
|
|
|
@include breakpoint(medium) {
|
|
.section-column:last-child,
|
|
.section-column:first-child {
|
|
margin: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.section {
|
|
.section-title {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid var(--primary-low);
|
|
padding-bottom: 0.5em;
|
|
|
|
@media screen and (max-width: 400px) {
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
h2 {
|
|
margin: 0 0.5em 0 0;
|
|
|
|
a {
|
|
color: var(--primary);
|
|
}
|
|
}
|
|
}
|
|
|
|
.section-body {
|
|
margin-top: 1em;
|
|
|
|
> p {
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.admin-report .header {
|
|
border: 0;
|
|
padding: 0;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.charts {
|
|
display: grid;
|
|
grid-template-columns: repeat(12, 1fr);
|
|
grid-column-gap: 1em;
|
|
grid-row-gap: 1em;
|
|
|
|
.admin-report {
|
|
grid-column: span 4;
|
|
|
|
&.consolidated-page-views,
|
|
&.site-traffic {
|
|
grid-column: span 12;
|
|
}
|
|
}
|
|
|
|
@include breakpoint(medium) {
|
|
.admin-report {
|
|
grid-column: span 12;
|
|
}
|
|
}
|
|
|
|
.chart-canvas-container {
|
|
position: relative;
|
|
margin-left: -5px;
|
|
}
|
|
|
|
.chart-canvas {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.misc {
|
|
display: flex;
|
|
border: 1px solid var(--primary-low);
|
|
|
|
.storage-stats,
|
|
.last-dashboard-update {
|
|
flex: 1 1 50%;
|
|
box-sizing: border-box;
|
|
margin: 1em 0;
|
|
padding: 0 1em;
|
|
}
|
|
|
|
.storage-stats {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
border-right: 1px solid var(--primary-low);
|
|
|
|
.backups,
|
|
.uploads {
|
|
flex: 1 1 100%;
|
|
}
|
|
|
|
.uploads p:last-of-type {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 400px) {
|
|
flex-wrap: wrap;
|
|
.storage-stats,
|
|
.last-dashboard-update {
|
|
flex: 1 1 100%;
|
|
text-align: left;
|
|
}
|
|
.last-dashboard-update {
|
|
display: block;
|
|
margin: 0 20px 20px 20px;
|
|
padding: 20px 0 0 0;
|
|
border-top: 1px solid var(--primary-low);
|
|
border-left: none;
|
|
}
|
|
}
|
|
.last-dashboard-update {
|
|
text-align: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
div {
|
|
align-self: center;
|
|
h4 {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.top-referred-topics {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
.top-referred-topics,
|
|
.trending-search {
|
|
th:first-of-type {
|
|
text-align: left;
|
|
}
|
|
}
|
|
|
|
.period-chooser .period-chooser-header {
|
|
font-size: var(--font-down-2);
|
|
}
|
|
|
|
.dashboard-problems {
|
|
margin-bottom: 2em;
|
|
|
|
.problem-messages {
|
|
margin-bottom: 1em;
|
|
|
|
&.priority-high {
|
|
background-color: var(--danger-low);
|
|
border: 1px solid var(--danger-medium);
|
|
}
|
|
|
|
ul {
|
|
margin: 0 0 0 1.25em;
|
|
|
|
li.dashboard-problem {
|
|
padding: 0.5em 0.5em;
|
|
}
|
|
}
|
|
}
|
|
|
|
.d-icon-exclamation-triangle {
|
|
color: var(--danger);
|
|
}
|
|
|
|
.actions {
|
|
margin: 1em 0 0 0;
|
|
display: flex;
|
|
align-items: center;
|
|
color: var(--primary-medium);
|
|
.btn {
|
|
margin-right: 1em;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.counters-list {
|
|
display: flex;
|
|
flex: 1 0 0px;
|
|
flex-direction: column;
|
|
|
|
.counters-header {
|
|
display: grid;
|
|
flex: 1 0 auto;
|
|
grid-template-columns: 33% repeat(auto-fit, minmax(20px, 1fr));
|
|
border: 1px solid var(--primary-low);
|
|
border-bottom: 0;
|
|
font-weight: 700;
|
|
text-align: right;
|
|
align-items: center;
|
|
padding: 0.65em 0.25em;
|
|
}
|
|
|
|
.admin-report .main {
|
|
border: 1px solid var(--primary-low);
|
|
|
|
&:hover {
|
|
background-color: var(--primary-very-low);
|
|
}
|
|
}
|
|
|
|
.admin-report:not(:last-child) {
|
|
.main {
|
|
border-bottom: 0;
|
|
}
|
|
|
|
.conditional-loading-section.is-loading {
|
|
border-bottom: 0;
|
|
}
|
|
}
|
|
|
|
.admin-report .conditional-loading-section.is-loading {
|
|
display: flex;
|
|
flex-direction: row;
|
|
padding: 0.5em 0.25em;
|
|
align-items: flex-start;
|
|
justify-content: flex-start;
|
|
border: 1px solid var(--primary-low);
|
|
|
|
.title {
|
|
font-size: var(--font-0);
|
|
}
|
|
|
|
.spinner {
|
|
margin: 0;
|
|
width: 8px;
|
|
height: 8px;
|
|
margin-left: 0.5em;
|
|
}
|
|
}
|
|
|
|
.admin-report .main .report-alert {
|
|
display: flex;
|
|
flex-direction: row;
|
|
padding: 0.5em 0.25em;
|
|
align-items: center;
|
|
text-align: left;
|
|
border: 0;
|
|
|
|
&:hover {
|
|
background-color: var(--primary-very-low);
|
|
}
|
|
|
|
.d-icon {
|
|
font-size: var(--font-up-1);
|
|
margin: 0 0.25em 0 0;
|
|
color: var(--primary-low-mid);
|
|
}
|
|
}
|
|
}
|
|
|
|
.activity-metrics {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
.user-metrics {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
flex-direction: column;
|
|
|
|
.dashboard-inline-table {
|
|
flex: 1 0 auto;
|
|
max-width: 95%;
|
|
}
|
|
|
|
.table-cell {
|
|
display: flex;
|
|
flex: 0 1 auto;
|
|
margin: 0 10px 5px 0;
|
|
padding: 1px;
|
|
border-radius: 10px;
|
|
|
|
.label {
|
|
display: flex;
|
|
align-items: center;
|
|
color: var(--primary);
|
|
justify-content: center;
|
|
border-radius: 9px 0 0 9px;
|
|
padding: 0 5px 0 8px;
|
|
|
|
.d-icon {
|
|
margin-right: 5px;
|
|
font-size: var(--font-down-1);
|
|
}
|
|
}
|
|
|
|
.value {
|
|
background: var(--secondary);
|
|
border-radius: 0 9px 9px 0;
|
|
padding: 0 8px 0 5px;
|
|
}
|
|
|
|
&.user-newuser {
|
|
.label {
|
|
color: var(--primary-high);
|
|
}
|
|
}
|
|
&.user-basic,
|
|
&.user-member {
|
|
background: var(--bronze);
|
|
.label {
|
|
color: var(--secondary);
|
|
}
|
|
}
|
|
&.user-regular {
|
|
background: var(--silver);
|
|
.label {
|
|
color: var(--secondary);
|
|
}
|
|
}
|
|
&.user-leader {
|
|
background: var(--gold);
|
|
.label {
|
|
color: var(--secondary);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.rtl .dashboard-next {
|
|
.section-column {
|
|
&:last-child {
|
|
margin-right: 1em;
|
|
margin-left: 0;
|
|
}
|
|
|
|
&:first-child {
|
|
margin-left: 1em;
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
|
|
.user-metrics .table-cell {
|
|
margin: 0 0 5px 10px;
|
|
}
|
|
|
|
.table-cell {
|
|
.label {
|
|
border-radius: 0 9px 9px 0;
|
|
|
|
.d-icon {
|
|
margin-right: 0;
|
|
margin-left: 5px;
|
|
}
|
|
}
|
|
|
|
.value {
|
|
border-radius: 9px 0 0 9px;
|
|
padding: 0 5px 0 8px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.users-by-trust-level,
|
|
.users-by-type {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
.community-health.section {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
.dashboard-moderation,
|
|
.dashboard-security {
|
|
.section-body {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
.main-section {
|
|
display: grid;
|
|
grid-template-columns: repeat(12, 1fr);
|
|
grid-column-gap: 1em;
|
|
grid-row-gap: 1em;
|
|
|
|
> * {
|
|
grid-column: span 12;
|
|
}
|
|
|
|
.admin-dashboard-security-bottom-outlet,
|
|
.admin-dashboard-moderation-bottom-outlet {
|
|
display: grid;
|
|
grid-template-columns: repeat(12, 1fr);
|
|
grid-column-gap: 1em;
|
|
grid-row-gap: 1em;
|
|
}
|
|
}
|
|
|
|
.admin-report {
|
|
grid-column: span 12;
|
|
}
|
|
}
|
|
|
|
.dashboard-moderation {
|
|
.admin-dashboard-moderation-top {
|
|
display: grid;
|
|
grid-template-columns: repeat(12, 1fr);
|
|
grid-column-gap: 1em;
|
|
grid-row-gap: 1em;
|
|
}
|
|
}
|
|
|
|
.version-checks {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.section-title {
|
|
flex: 1 1 100%;
|
|
border-bottom: 1px solid var(--primary-low);
|
|
padding-bottom: 0.5em;
|
|
}
|
|
|
|
h2 {
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
.version-check {
|
|
display: flex;
|
|
flex: 1 1 50%;
|
|
flex-wrap: wrap;
|
|
align-items: flex-start;
|
|
align-self: flex-start;
|
|
justify-content: space-between;
|
|
padding-top: 1em;
|
|
|
|
.update-header {
|
|
flex: 1 1 100%;
|
|
|
|
@media screen and (max-width: 650px) {
|
|
margin: 0;
|
|
}
|
|
|
|
tr {
|
|
border: none;
|
|
}
|
|
|
|
th {
|
|
background: transparent;
|
|
padding: 0;
|
|
}
|
|
}
|
|
|
|
h2 {
|
|
flex: 1 1 100%;
|
|
}
|
|
|
|
.version-number {
|
|
font-size: var(--font-up-2);
|
|
line-height: var(--line-height-small);
|
|
box-sizing: border-box;
|
|
font-weight: bold;
|
|
margin-bottom: 2em;
|
|
margin-right: 1em;
|
|
flex: 1 1 27%;
|
|
|
|
h3 {
|
|
flex: 1 0 auto;
|
|
margin: 0;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
h4 {
|
|
font-size: var(--font-down-2);
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
.sha-link {
|
|
display: inline-flex;
|
|
font-size: var(--font-down-2);
|
|
font-weight: normal;
|
|
}
|
|
}
|
|
|
|
.version-status {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0 0 1em 0;
|
|
flex: 1 1 24%;
|
|
box-sizing: border-box;
|
|
padding-right: 20px;
|
|
min-width: 250px;
|
|
@include breakpoint(medium) {
|
|
max-width: unset;
|
|
}
|
|
.face {
|
|
margin: 0 0.75em 0 0;
|
|
font-size: var(--font-up-3);
|
|
}
|
|
}
|
|
&.critical .version-notes .normal-note {
|
|
display: none;
|
|
}
|
|
&.normal .version-notes .critical-note {
|
|
display: none;
|
|
}
|
|
.fa {
|
|
font-size: var(--font-up-4);
|
|
}
|
|
.up-to-date {
|
|
color: var(--success);
|
|
}
|
|
.updates-available {
|
|
color: var(--danger);
|
|
}
|
|
.critical-updates-available {
|
|
color: var(--danger);
|
|
}
|
|
}
|
|
|
|
.update-nag {
|
|
.d-icon {
|
|
font-size: var(--font-up-3);
|
|
}
|
|
}
|
|
|
|
.dashboard-next.general {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.dashboard-new-features {
|
|
&.ordered-first {
|
|
order: -1;
|
|
}
|
|
|
|
&:not(.ordered-first) {
|
|
.new-features-dismiss {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.section-footer {
|
|
margin: 1.5em;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
.btn {
|
|
margin-left: 1em;
|
|
}
|
|
}
|
|
}
|
|
|
|
.whats-new,
|
|
.dashboard {
|
|
.admin-config-area-card__title {
|
|
font-size: var(--font-up-1);
|
|
margin-bottom: 1em;
|
|
}
|
|
.admin-new-feature-item__learn-more {
|
|
margin-bottom: 1em;
|
|
display: inline-block;
|
|
}
|
|
}
|
|
|
|
.admin-new-feature-item {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
margin-bottom: 1.5em;
|
|
border-bottom: 1px solid var(--primary-low);
|
|
&:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
&__new-feature-emoji {
|
|
font-size: 1.2em;
|
|
padding-left: 0;
|
|
padding-right: 0.5em;
|
|
}
|
|
|
|
&__content {
|
|
padding-right: 0.5em;
|
|
width: 100%;
|
|
}
|
|
&__header {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
font-weight: bold;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
&__screenshot {
|
|
width: 100%;
|
|
}
|
|
&__new-feature-version {
|
|
margin-left: auto;
|
|
color: var(--primary-low-mid);
|
|
}
|
|
}
|