Commit 91f464f8 authored by Mantas Vilčinskas's avatar Mantas Vilčinskas
Browse files

Design updates - dark mode finished, mini fixes

parent 87a3e086
......@@ -98,7 +98,7 @@ git submodule add https://github.com/cstate/cstate
1. Clone this repository in the command line:
```bash
git clone --recurisve https://github.com/cstate/cstate.git
git clone --recursive -b master https://github.com/cstate/cstate.git
```
2. Navigate to the theme directory:
......
......@@ -172,6 +172,21 @@ params:
# STRING; `monthly`, `yearly`, `none`
incidentHistoryFormat: "yearly"
# Disable dark mode
#
# If your OS and browser support the
# `prefers-color-scheme` media query,
# cState will automatically switch to
# a darker user interface.
#
# cState uses its built-in colors for
# most of the interface to ensure
# a good user experience.
#
# Default: false
# BOOLEAN; `true`, `false`
disableDarkMode: false
# Should we show the logo or the title
# of the status page?
#
......
---
title: Testing New cState Features
date: 2019-10-04 18:05:00
resolvedWhen: 2019-10-04 18:05:00
informational: true
section: issue
---
......
......@@ -82,11 +82,11 @@
{{ else }}
<strong class="error">
{{ if eq .Params.severity "down" }}
{{ else if eq .Params.severity "disrupted" }}
{{ else }}
{{ end }}
{{ T "downtimeOngoing" }}</strong>
{{ end }}
......
......@@ -82,11 +82,11 @@
<!-- Marker -->
<strong class="error">
{{ if eq .Params.severity "down" }}
{{ else if eq .Params.severity "disrupted" }}
{{ else }}
{{ end }}
{{ T "downtimeOngoing" }}</strong>
......
......@@ -29,7 +29,7 @@
margin: 0;
background: #fff;
color: #4d4d4d;
font: 100%/1.5 'Inter', "Inter UI", BlinkMacSystemFont, -apple-system, "San Francisco Text", "Roboto", "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font: 100%/1.5 "Inter", "Inter UI", BlinkMacSystemFont, -apple-system, "San Francisco Text", "Roboto", "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
box-sizing: border-box;
-webkit-tap-highlight-color: rgba(0,0,0, 0.25);
}
......@@ -66,7 +66,7 @@
h1, h2, h4 {
font-weight: normal;
color: #000;
font-family: 'Inter', "Inter UI", "Segoe UI", BlinkMacSystemFont, -apple-system, "San Francisco Display", "Roboto", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-family: "Inter", "Inter UI", "Segoe UI", BlinkMacSystemFont, -apple-system, "San Francisco Display", "Roboto", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
letter-spacing: -0.4px;
}
......@@ -332,30 +332,64 @@
}
}
/**
* Dark theme
*/
{{ if not .Site.Params.disableDarkMode }}
/**
* Dark theme
*/
@media (prefers-color-scheme: dark) {
/* Basics */
html, body { background: #181a1b; color: #ccc9c1; }
h1, h2, h3, h4, a, .bold { color: #fafafa; }
hr { border-bottom-color: #3d3d3d; }
/* Sections */
.footer { background: #1b1d1e; }
.components {
border: 2px solid #ddd;
border-bottom: 0;
border-color: #3a3a3a;
}
@media (prefers-color-scheme: dark) {
html, body { background: #181a1b; color: #ccc9c1; }
h1, h2, h3, h4, a, .bold { color: #e8e6e3; }
hr { border-bottom-color: #3d3d3d; }
.footer { background: #1b1d1e; }
.date { color: #c3bfb6; }
.components { border: 2px solid #ddd; border-bottom: 0; border-color: #3a3a3a; }
.component { border-bottom: 2px solid #ddd; color: #e8e6e3; border-bottom-color: #3a3a3a; }
.tag { background-image: initial; background-color: #1d1f20; }
.tag:hover { background: #222; }
.issue:hover {background-color: #1b1d1e }
.error { color: #ff4242; }
.hinted, .faded { color: #c1bcb3; }
.warning {color: #ff8b52; }
.ok { color: #7fff7f; }
.component[data-status="disrupted"]
.component-status { color: #ff8b52; }
.component[data-status="ok"]
.component-status { color: #7fff7f; }
.component {
border-bottom: 2px solid #ddd;
color: #e8e6e3;
border-bottom-color: #3a3a3a;
}
.tabs { border-bottom-color: #3d3d3d; }
.tab--current {
border-color: #3d3d3d;
border-bottom-color: #181a1b;
}
.tab--other { color: #757575; }
.tab--other:hover { color: #fff; }
.date { color: #c3bfb6; }
.tag { background-color: #1d1f20; }
.tag:hover { background: #222; }
.issue:hover,
.category__head:hover { background-color: #212121; }
/* Colors for dark mode */
.hinted, .faded { color: #c1bcb3; }
.error { color: #ff4242; }
.warning {color: #ffde7f; }
.ok { color: #7fff7f; }
.component[data-status="ok"]
.component-status { color: #7fff7f; }
.component[data-status="disrupted"]
.component-status { color: #ffde7f; }
.component[data-status="notice"]
.component-status { color: #83a4e8; }
.component[data-status="down"]
.component-status { color: #ff8181; }
}
{{ end }}
</style>
{{ if .Site.Params.enableCustomHTML }}
{{ partial "custom/meta" . }}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment