diff options
25 files changed, 492 insertions, 99 deletions
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 328575f..58825c5 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -6,13 +6,22 @@ Thanks for taking the time to contribute. Folks like you are more than welcome! Cool, [just create an issue](https://github.com/cstate/cstate/issues)! -## I want to help contribute a new feature. +## I want to write code. -Great. Here are some things to keep in mind: +First of all: -+ Keep it as simple as possible. -+ Keep it as light as possible. -+ Try to make it readable. +**Never merge to master. Merge to dev.** + +Some guidelines. You want to make sure that you have: + +* Looked, if there was an issue for the thing you are trying to achieve +* If there isn't, create one and discuss your proposal in that issue. + +The code you write should be readable to humans. If it is not immediately obvious, add some comments. + +## I want to translate + +[Read this](https://github.com/cstate/cstate/wiki/Translations#add-your-translations). ## Wait, my question has not been answered. @@ -1,6 +1,6 @@ <p align="center"><img src="https://raw.githubusercontent.com/cstate/cstate/master/images/highlight.svg?sanitize=true" alt="cState example illustration"></p> -<p align="center"><a href="https://github.com/cstate/cstate/releases"><img src="https://img.shields.io/github/release/cstate/cstate/all.svg?style=flat-square" alt="GitHub release" /></a> <a href="https://github.com/cstate/cstate/commits/master"><img src="https://img.shields.io/github/last-commit/cstate/cstate.svg?style=flat-square" alt="GitHub last commit" /></a> <a href="https://github.com/cstate/cstate/tree/master/"><img src="https://img.shields.io/github/repo-size/cstate/cstate.svg?style=flat-square" alt="GitHub repo size in bytes" /></a> <a href="https://discord.gg/EvQZdhT"><img src="https://img.shields.io/badge/discord-support-7289DA.svg?logo=discord&style=flat-square" alt="Discord Chat" /></a> <a href="https://twitter.com/cstate"><img src="https://img.shields.io/twitter/follow/mistermantas.svg?style=social&label=Follow" alt="Twitter" /></a> <a href="https://github.com/ivbeg/awesome-status-pages"><img src="https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg" alt="Awesome status page" /></a></p> +<p align="center"><a href="https://github.com/cstate/cstate/releases"><img src="https://img.shields.io/github/release/cstate/cstate/all.svg?style=flat-square" alt="GitHub release" /></a> <a href="https://github.com/cstate/cstate/commits/master"><img src="https://img.shields.io/github/last-commit/cstate/cstate.svg?style=flat-square" alt="GitHub last commit" /></a> <a href="https://github.com/cstate/cstate/tree/master/"><img src="https://img.shields.io/github/repo-size/cstate/cstate.svg?style=flat-square" alt="GitHub repo size in bytes" /></a> <a href="https://discord.gg/zYCjzys"><img src="https://img.shields.io/badge/discord-support-7289DA.svg?logo=discord&style=flat-square" alt="Discord Chat" /></a> <a href="https://twitter.com/cstate"><img src="https://img.shields.io/twitter/follow/mistermantas.svg?style=social&label=Follow" alt="Twitter" /></a> <a href="https://github.com/ivbeg/awesome-status-pages"><img src="https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg" alt="Awesome status page" /></a></p> > Über fast, backwards compatible (IE8+), tiny, and simple status page built with Hugo. Completely _free_ with Netlify & GitHub Pages. @@ -17,6 +17,7 @@ + [Updating](#updating-) + [FAQ](#faq-) + [Contribute](#contribute-) +* [Donate](#donate-) + [License](#license-) *** @@ -29,8 +30,9 @@ + Works not just on mobile, but also on the archaic Internet Explorer 8 + Makes you accountable, showcasing how long it took for an issue to be resolved + Great for data manipulation and viewing — has RSS, tag-like system feeds ++ Customizable views, colors, and other elements -**Fast, reliable, and free** +**Fast, reliable, and free (even to host)** + Built with [Hugo](https://gohugo.io), a hyperfast Golang generator + Secure, ready for HTTPS, thanks to [JAMstack](https://jamstack.org/) @@ -41,6 +43,7 @@ + Edit your status page from a simple config file + Comes pre-equipped with Netlify CMS for quick admin updates + Extensive documentation on the [wiki](https://github.com/cstate/cstate/wiki) ++ [Read-only API available](https://github.com/cstate/cstate/wiki/API) ## Getting started 💻 @@ -56,7 +59,7 @@ We encourage you to use [Netlify](https://www.netlify.com) for cState. These are + Publish directory: **public** + Add one build environment variable + Key: **HUGO_VERSION** - + Value: **0.48** + + Value: **0.48** (or later) **The easy way** @@ -76,6 +79,11 @@ If you want to do this from any branch in this repository, follow the manual ins ```bash mkdir themes; cd themes; ``` +2. Start Git on this folder: + +```bash +git init +``` 3. Now simply add a Git submodule pointing to this repository, like so: @@ -90,7 +98,7 @@ git submodule add https://github.com/cstate/cstate 1. Clone this repository in the command line: ```bash -git clone https://github.com/cstate/cstate.git +git clone --recurisve https://github.com/cstate/cstate.git ``` 2. Navigate to the theme directory: @@ -170,6 +178,15 @@ Time to break that down. Check out [the wiki](https://github.com/cstate/cstate/wiki). +## Donate ❤️ + +cState is only a hobby project of @mistermantas, but it’s a prideful one. + +Support the developer and ensure the future of the project by donating for a cuppa tea, some ice cream, or if you are feeling generous — a large size pizza. + +* [PayPal](https://paypal.me/AlbinaV} +* or you can make a bank transfer. For info, [get in touch](https://mnts.lt) + ## Contribute 💥 > Want to become a maintainer? Hit me up! [@mistermantas](https://twitter.com/mistermantas) diff --git a/exampleSite/config.yml b/exampleSite/config.yml index 74d30b4..a894d26 100644 --- a/exampleSite/config.yml +++ b/exampleSite/config.yml @@ -83,7 +83,7 @@ defaultContentLanguage: en # What is the hostname or path to the root? # Where is the site hosted? # -# 💥 cState & Hugo don’t support '/' in +# ❗ cState & Hugo don’t support '/' in # production use. It will break RSS # feeds and breaks permalinks since # version 3. If you are just testing, @@ -99,6 +99,35 @@ baseURL: https://cstate.mnts.lt ############################################################ params: + # Before setting up your systems, you need + # to first define at least one category. + # + # Categories are shown in the order that + # you define in this config file. + # + # Categories can have a: + # - name + # - description + # - closed boolean `closed: true` + # That would collapse the category upon first load + # and the user can expand by clicking on the category + # (Requires JavaScript.) + # - untitled boolean `untitled: true` + # This would complerely hide the name of the category. + # This is useful, if you do not want to use categories + # because you need to set an 'Uncategorized' category. + # Or it can be used alongside other categories. + # + # For help, see the wiki: + # https://github.com/cstate/cstate/wiki/Customization + categories: + - name: North Coast + description: The main servers are located here. + closed: true + - name: East Coast + - name: Uncategorized + untitled: true + # These are your systems. Change them to # change the amount of components. # @@ -106,10 +135,15 @@ params: # https://github.com/cstate/cstate/wiki/Customization systems: - name: Gateway + category: North Coast + - name: Backup Gateway + category: East Coast - name: API description: The guts of the application. + category: Uncategorized - name: Media Proxy description: This is the service responsible for serving images, audio, and video. It is reliant on our CDN. + category: Uncategorized # What date format to use? # @@ -129,6 +163,15 @@ params: # BOOLEAN; `true`, `false` useLargeHeaderDesign: false + # Should incident history be separated + # like in an archive view? + # + # Note: This WILL disable pagination. + # + # Default: `yearly` + # STRING; `monthly`, `yearly`, `none` + incidentHistoryFormat: "yearly" + # Should we show the logo or the title # of the status page? # @@ -229,3 +272,16 @@ preserveTaxonomyNames: true taxonomies: affected: affected + +outputs: + page: + - html + - json + section: + - html + - json + - rss + home: + - html + - json + - rss diff --git a/exampleSite/content/issues/2018-01-17-sending-dms-impacted.md b/exampleSite/content/issues/2018-01-17-sending-dms-impacted.md index 0af6136..b96139f 100644 --- a/exampleSite/content/issues/2018-01-17-sending-dms-impacted.md +++ b/exampleSite/content/issues/2018-01-17-sending-dms-impacted.md @@ -1,8 +1,8 @@ --- title: Issues Sending DMs -date: 2018-01-17 16:24:00 +date: 2017-12-17 16:24:00 resolved: true -resolvedWhen: 2018-01-17 16:58:00 +resolvedWhen: 2017-12-17 16:58:00 # Possible severity levels: down, disrupted, notice severity: disrupted affected: diff --git a/exampleSite/content/issues/2018-05-25-us-east-conn-issues.md b/exampleSite/content/issues/2018-05-25-us-east-conn-issues.md index 524035b..8d56cf2 100644 --- a/exampleSite/content/issues/2018-05-25-us-east-conn-issues.md +++ b/exampleSite/content/issues/2018-05-25-us-east-conn-issues.md @@ -1,13 +1,14 @@ --- title: US East Connection Issues -date: 2018-05-25 04:13:00 +date: 2018-04-25 04:13:00 resolved: true -resolvedWhen: 2018-05-25 04:13:59 +resolvedWhen: 2018-04-25 04:13:59 # Possible severity levels: down, disrupted, notice severity: down affected: - API - Media Proxy + - Gateway section: issue --- diff --git a/exampleSite/content/issues/2018-06-13-maintenance-window.md b/exampleSite/content/issues/2018-06-13-maintenance-window.md index 6b75810..dae3afb 100644 --- a/exampleSite/content/issues/2018-06-13-maintenance-window.md +++ b/exampleSite/content/issues/2018-06-13-maintenance-window.md @@ -1,7 +1,8 @@ --- title: Maintenance Window date: 2018-06-13 15:54:00 -resolved: false +resolved: true +resolvedWhen: 2018-06-13 16:54:00 # Possible severity levels: down, disrupted, notice severity: disrupted affected: diff --git a/exampleSite/content/issues/2019-10-04-testing-cstate-functions.md b/exampleSite/content/issues/2019-10-04-testing-cstate-functions.md new file mode 100644 index 0000000..e8e2250 --- /dev/null +++ b/exampleSite/content/issues/2019-10-04-testing-cstate-functions.md @@ -0,0 +1,11 @@ +--- +title: Testing New cState Features +date: 2019-10-04 18:05:00 +resolvedWhen: 2019-10-04 18:05:00 +informational: true +section: issue +--- + +There is a new feature in cState version 4 that lets you make what are called _informational_ posts. The main difference is that there will be no _Unresolved_ or _Resolved in under a minute_ text on the pages. + +This is essentially a page with a date and title.
\ No newline at end of file diff --git a/exampleSite/content/issues/2019-10-08-testing-new-pipeline.md b/exampleSite/content/issues/2019-10-08-testing-new-pipeline.md new file mode 100644 index 0000000..c30358c --- /dev/null +++ b/exampleSite/content/issues/2019-10-08-testing-new-pipeline.md @@ -0,0 +1,13 @@ +--- +title: New Pipeline Rollout +date: 2019-10-05 16:24:00 +resolved: false +resolvedWhen: 2019-10-05 16:58:00 +# Possible severity levels: down, disrupted, notice +severity: disrupted +affected: + - API +section: issue +--- + +There may be disruptions in the rollout.
\ No newline at end of file diff --git a/images/screenshot.png b/images/screenshot.png Binary files differindex 59f49e8..92daee0 100644 --- a/images/screenshot.png +++ b/images/screenshot.png diff --git a/images/tn.png b/images/tn.png Binary files differindex 52f9ba2..4511244 100644 --- a/images/tn.png +++ b/images/tn.png diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 51a09e8..48596df 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -2,7 +2,9 @@ <body class="default single"> <div class="contain"> <a href="{{ .Site.BaseURL }}">← {{ T "goBack" }} <em>{{ .Site.Title }}</em></a> - <hr> + + <div class="padding"></div> + {{ .Content }} </div> diff --git a/layouts/_default/single.json b/layouts/_default/single.json new file mode 100644 index 0000000..634e2bc --- /dev/null +++ b/layouts/_default/single.json @@ -0,0 +1,8 @@ +{ + "is": "page", + "title": "{{ .Title }}", + "createdAt": "{{ .Date }}", + "filename": "{{ .File.LogicalName }}", + "permalink": "{{ .Permalink }}", + "body": {{ jsonify .Content }} +}
\ No newline at end of file diff --git a/layouts/index.html b/layouts/index.html index be887c8..c02224a 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -38,7 +38,13 @@ <!-- All incidents + pagination --> <div class="contain contain--more" id="incidents"> - {{ partial "index/incidents" . }} + {{ if eq .Site.Params.incidentHistoryFormat "yearly" }} + {{ partial "index/incidents-yearly" . }} + {{ else if eq .Site.Params.incidentHistoryFormat "monthly" }} + {{ partial "index/incidents-monthly" . }} + {{ else }} + {{ partial "index/incidents" . }} + {{ end }} <div class="padding"></div> </div> diff --git a/layouts/index.json b/layouts/index.json new file mode 100644 index 0000000..c2a2c49 --- /dev/null +++ b/layouts/index.json @@ -0,0 +1,59 @@ +{{ $incidents := where .Site.RegularPages "Params.section" "issue" }} +{{ $active := where $incidents "Params.resolved" "=" false }} +{{ $isNotice := where $active "Params.severity" "=" "notice" }} +{{ $isDisrupted := where $active "Params.severity" "=" "disrupted" }} +{{ $isDown := where $active "Params.severity" "=" "down" }} +{ + "is": "index", + "cStateVersion": "4.0", + "apiVersion": "1.0", + "title": "{{ .Site.Title }}", + "languageCodeHTML": "{{ .Site.LanguageCode }}", + "languageCode": "{{ T "languageCode" }}", + "baseURL": "{{ .Site.BaseURL }}", + "description": "{{ .Site.Params.Description }}", + "logo": "{{ .Site.Params.logo | absURL }}", + "categories": [ + {{ range $i, $e := .Site.Params.categories }}{{ if $i }},{{ end }} + { + "name": "{{ .name }}",{{ if .description }} + "description": "{{ .description }}",{{ end }} + "hideTitle": {{ if .untitled }}true{{ else }}false{{ end }}, + "closedByDefault": {{ if .closed }}true{{ else }}false{{ end }} + } + {{ end }} + ], + "systems": [ + {{ range $i, $e := .Site.Params.systems }}{{ if $i }},{{ end }} + { + "name": "{{ .name }}",{{ if .description }} + "description": "{{ .description }}",{{ end }} + "category": "{{ .category }}" + } + {{ end }} + ], + + + "buildDate": "{{ now.Format "2006-01-02" }}", + "buildTime": "{{ now.Format "15:04" }}", + "buildTimezone": "{{ now.Format "MST" }}", + "summaryStatus":{{ if $isDown }} + "down", + {{ else }} + {{ if $isDisrupted }} + "disrupted", + {{ else }} + {{ if $isNotice }} + "notice", + {{ else }} + "ok", + {{ end }}{{ end }}{{ end }} + "colorBrand": "{{ .Site.Params.Brand }}", + "colorOk": "{{ .Site.Params.Ok }}", + "colorDisrupted": "{{ .Site.Params.Disrupted }}", + "colorDown": "{{ .Site.Params.Down }}", + "colorNotice": "{{ .Site.Params.Notice }}", + "alwaysKeepBrandColor": "{{ .Site.Params.alwaysKeepBrandColor }}", + + "googleAnalytics": "{{ .Site.Params.googleAnalytics }}" +}
\ No newline at end of file diff --git a/layouts/issues/issue.html b/layouts/issues/issue.html index c344f57..24cadd8 100644 --- a/layouts/issues/issue.html +++ b/layouts/issues/issue.html @@ -24,7 +24,8 @@ {{ end }} </small></p> - {{ if .Params.Resolved }} + {{ if .Params.informational }} + {{ else if .Params.Resolved }} {{ $t := (time .Params.ResolvedWhen) }} {{ $timeDiff := (sub $t.Unix .Date.Unix) }} {{ $diffInMin := (div $timeDiff 60) }} @@ -79,7 +80,15 @@ {{ end }} {{ end }} {{ else }} - <strong class="error">{{ T "downtimeOngoing" }}</strong> + <strong class="error"> + {{ if eq .Params.severity "down" }} + ◼ + {{ else if eq .Params.severity "disrupted" }} + ▲ + {{ else }} + ◆ + {{ end }} + {{ T "downtimeOngoing" }}</strong> {{ end }} <hr> diff --git a/layouts/issues/single.json b/layouts/issues/single.json new file mode 100644 index 0000000..36b0f67 --- /dev/null +++ b/layouts/issues/single.json @@ -0,0 +1,13 @@ +{ + "is": "issue", + "title": "{{ .Title }}", + "createdAt": "{{ .Date }}", + "permalink": "{{ .Permalink }}", + "severity": "{{ .Params.severity }}", + "resolved": "{{ .Params.resolved }}", + "informational": "{{ .Params.informational }}", + "resolvedAt": "{{ .Params.resolvedWhen }}", + "affected": [{{ range $i, $e := .Params.Affected }}{{ if $i }}, {{ end }}"{{ . }}"{{ end }}], + "filename": "{{ .File.LogicalName }}", + "body": {{ jsonify .Content }} +}
\ No newline at end of file diff --git a/layouts/issues/small.html b/layouts/issues/small.html index ef30b75..9349046 100644 --- a/layouts/issues/small.html +++ b/layouts/issues/small.html @@ -6,7 +6,23 @@ {{ $isDown := where $active "Params.severity" "=" "down" }} <a href="{{ .Permalink }}" class="issue no-underline"> - {{ if .Params.Resolved }} + {{ if .Params.informational }} + + <small class="date float-right"> + {{ if .Site.Params.dateFormat }} + {{ .Date.Format .Site.Params.dateFormat }} + {{ else }} + {{ .Date.Format "January 2, 2006 at 3:04 PM" }} + {{ end }} + </small> + + <h3> + {{ .Title }} ℹ + </h3> + <span class="faded">{{ .Summary | truncate 200 }} + </span> + + {{ else if .Params.Resolved }} <small class="date float-right"> {{ if .Site.Params.dateFormat }} {{ .Date.Format .Site.Params.dateFormat }} @@ -49,24 +65,30 @@ </div> {{ end }} {{ end }} - - {{ else }} - <small class="date float-right"> - {{ if .Site.Params.dateFormat }} - {{ .Date.Format .Site.Params.dateFormat }} - {{ else }} - {{ .Date.Format "January 2, 2006 at 3:04 PM" }} - {{ end }} - </small> + <small class="date float-right"> + {{ if .Site.Params.dateFormat }} + {{ .Date.Format .Site.Params.dateFormat }} + {{ else }} + {{ .Date.Format "January 2, 2006 at 3:04 PM" }} + {{ end }} + </small> - <h3> - {{ .Title }} - </h3> + <h3> + {{ .Title }} + </h3> - <!-- Marker --> - <div class="error">{{ T "downtimeOngoing" }}</div> + <!-- Marker --> + <strong class="error"> + {{ if eq .Params.severity "down" }} + ◼ + {{ else if eq .Params.severity "disrupted" }} + ▲ + {{ else }} + ◆ + {{ end }} + {{ T "downtimeOngoing" }}</strong> {{ end }} </a> diff --git a/layouts/partials/index/autorefresh.html b/layouts/partials/index/autorefresh.html index b419e2f..e69de29 100644 --- a/layouts/partials/index/autorefresh.html +++ b/layouts/partials/index/autorefresh.html @@ -1,8 +0,0 @@ -{{ if .Site.Params.autoRefresh }} - <div class="faded right"> - <small><em>{{ T "autoRefreshNotice" }}</em></small> - </div> - <div class="padding-s"></div> - {{ else }} - <div class="padding"></div> -{{ end }}
\ No newline at end of file diff --git a/layouts/partials/index/components.html b/layouts/partials/index/components.html index 128b887..135349a 100644 --- a/layouts/partials/index/components.html +++ b/layouts/partials/index/components.html @@ -5,49 +5,97 @@ {{ $isDisrupted := where $active "Params.severity" "=" "disrupted" }} {{ $isDown := where $active "Params.severity" "=" "down" }} -<div class="components"> - {{ $systems := .Site.Params.systems }} - {{ range $systems }} - {{ $activeComponentIssues := where $active "Params.affected" "intersect" (slice .name) }} - - {{ $thisIsNotice := where $activeComponentIssues "Params.severity" "=" "notice" }} - {{ $thisIsDisrupted := where $activeComponentIssues "Params.severity" "=" "disrupted" }} - {{ $thisIsDown := where $activeComponentIssues "Params.severity" "=" "down" }} - - <div class="component" data-status="{{ if $thisIsDown }}down{{ else }}{{ if $thisIsDisrupted }}disrupted{{ else }}{{ if $thisIsNotice }}notice{{ else }}ok{{ end }}{{ end }}{{ end }}"> - <a href="/affected/{{ .name | urlize }}" class="no-underline"> - {{ .name }} - </a> - - {{ with .description }} - <span class="tooltip tooltip--small"> - <span class="faded">(?)</span> - - <span class="tooltip__text"> - {{ . }} - </span> +<!-- Individual info --> +<div class="categories"> + {{ $systems := .Site.Params.systems }} + {{ $categories := .Site.Params.categories }} + + <script> + function toggleCategoryHead(el) { + if (el.parentNode.className == 'category category--open') { + el.parentNode.className = 'category category--closed'; + } else { + el.parentNode.className = 'category category--open'; + } + } + </script> + + {{ range $categories }} + <div class="category {{ if .closed }}category--closed{{ else }}category--open{{ end }}" id="{{ .name | urlize }}"> + {{ if not .untitled }} + <div class="bold padding clicky category__head" onclick="toggleCategoryHead(this)"> + <span class="hide-without-js"> + <span class="category__closed-marker">⯈</span> + <span class="category__open-marker">⯆</span> + </span> + + <b> + {{ .name }} + </b> + + {{ with .description }} + <span class="tooltip tooltip--small"> + <span class="faded">(?)</span> + + <span class="tooltip__text"> + {{ . }} </span> - {{ end }} - - <span class="component-status"> - {{ if $thisIsDown }} - <b>{{ T "thisIsDown" }}</b> - {{ else }} - {{ if $thisIsDisrupted }} - <b>{{ T "thisIsDisrupted" }}</b> - {{ else }} - {{ if $thisIsNotice }} - <b>{{ T "thisIsNotice" }}</b> - {{ else }} - {{ T "thisIsOk" }} - {{ end }}{{ end }}{{ end }} </span> + {{ end }} + + </div> + {{ else }} + <div class="padding"></div> + {{ end }} + + {{ $categorySystems := where $systems "category" "=" .name }} - {{ with .partial }} - <div> - {{ partial . . }} + <div class="components"> + {{ range $categorySystems }} + {{ $activeComponentIssues := where $active "Params.affected" "intersect" (slice .name) }} + + {{ $thisIsNotice := where $activeComponentIssues "Params.severity" "=" "notice" }} + {{ $thisIsDisrupted := where $activeComponentIssues "Params.severity" "=" "disrupted" }} + {{ $thisIsDown := where $activeComponentIssues "Params.severity" "=" "down" }} + + <div class="component" data-status="{{ if $thisIsDown }}down{{ else }}{{ if $thisIsDisrupted }}disrupted{{ else }}{{ if $thisIsNotice }}notice{{ else }}ok{{ end }}{{ end }}{{ end }}"> + <a href="/affected/{{ .name | urlize }}" class="no-underline"> + {{ .name }} + </a> + + {{ with .description }} + <span class="tooltip tooltip--small"> + <span class="faded">(?)</span> + + <span class="tooltip__text"> + {{ . }} + </span> + </span> + {{ end }} + + <span class="component-status"> + {{ if $thisIsDown }} + {{ T "thisIsDown" }} + {{ else }} + {{ if $thisIsDisrupted }} + {{ T "thisIsDisrupted" }} + {{ else }} + {{ if $thisIsNotice }} + {{ T "thisIsNotice" }} + {{ else }} + {{ T "thisIsOk" }} + {{ end }}{{ end }}{{ end }} + </span> + + {{ with .partial }} + <div> + {{ partial . . }} + </div> + {{ end }} </div> - {{ end }} + {{ end }} </div> - {{ end }} - </div>
\ No newline at end of file + </div> + {{ end }} + +</div>
\ No newline at end of file diff --git a/layouts/partials/index/incidents-monthly.html b/layouts/partials/index/incidents-monthly.html new file mode 100644 index 0000000..263bc52 --- /dev/null +++ b/layouts/partials/index/incidents-monthly.html @@ -0,0 +1,29 @@ +{{ $incidents := where .Site.RegularPages "Params.section" "issue" }} + + + +{{ range ($incidents.GroupByDate "1") }} + <div class="padding"></div> + <hr> + <p class="center" id="archive-{{ range first 1 .Pages }}{{ .Date.Format "2006" }}{{ end }}-{{ .Key }}"><a href="#archive-{{ range first 1 .Pages }}{{ .Date.Format "2006" }}{{ end }}-{{ .Key }}" class="no-underline"> + <b> + <!-- Hugo requires a '0' in the month + which is why this check exists --> + {{ if gt .Key 9 }} + {{ $month := printf "2006-%s-02" .Key }} + {{ $monthDate := $month | time }} + {{ $monthDate.Format "January" }} + {{ else }} + {{ $month := printf "2006-0%s-02" .Key }} + {{ $monthDate := $month | time }} + {{ $monthDate.Format "January" }} + {{ end }} + {{ range first 1 .Pages }}{{ .Date.Format "2006" }}{{ end }} + </b><small class="faded">({{ len .Pages }})</small> + </a></p> + <hr> + + {{ range .Pages }} + {{ .Render "small" }} + {{ end }} +{{ end }} diff --git a/layouts/partials/index/incidents-yearly.html b/layouts/partials/index/incidents-yearly.html new file mode 100644 index 0000000..d07be9d --- /dev/null +++ b/layouts/partials/index/incidents-yearly.html @@ -0,0 +1,14 @@ +{{ $incidents := where .Site.RegularPages "Params.section" "issue" }} + + +{{ range ($incidents.GroupByDate "2006") }} + <div class="padding"></div> + <hr> + <p class="center" id="archive-{{ .Key }}"><a href="#archive-{{ .Key }}" class="no-underline"><strong>{{ .Key }}</strong> + <span class="faded">({{ len .Pages }})</span> + </a></p><hr> + + {{ range .Pages }} + {{ .Render "small" }} + {{ end }} +{{ end }} diff --git a/layouts/partials/index/summary.html b/layouts/partials/index/summary.html index d8e3108..de6bceb 100644 --- a/layouts/partials/index/summary.html +++ b/layouts/partials/index/summary.html @@ -20,5 +20,5 @@ {{ end }}{{ end }}{{ end }} </strong> - <span class="summary__date float-right" onclick="location.reload()"></span> + <div class="summary__date clicky float-right" onclick="location.reload()"></div> </div>
\ No newline at end of file diff --git a/layouts/partials/js.html b/layouts/partials/js.html index 388b706..54a0176 100644 --- a/layouts/partials/js.html +++ b/layouts/partials/js.html @@ -3,7 +3,7 @@ * Dev toolset */ - console.log('cState v3.1.0 - Stable 2019-04-08 - https://github.com/cstate/cstate'); + console.log('cState v4.0.0 - Dev 2019-10-06 - https://github.com/cstate/cstate'); document.getElementsByTagName('html')[0].className = 'js'; /** diff --git a/layouts/partials/meta.html b/layouts/partials/meta.html index 6a6f790..a5f6472 100644 --- a/layouts/partials/meta.html +++ b/layouts/partials/meta.html @@ -12,7 +12,7 @@ {{ range .AlternativeOutputFormats -}} {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }} {{ end -}} - <meta name="generator" content="cState v3.1.0 - Stable 2019-04-08"> + <meta name="generator" content="cState v4.0.0 - Dev 2019-10-06"> <meta name="theme-color" content="#{{ .Site.Params.brand }}"> <script> var themeBrandColor = '#{{ .Site.Params.brand }}'; @@ -20,6 +20,8 @@ var themeNoticeColor = '#{{ .Site.Params.notice }}'; var themeDisruptedColor = '#{{ .Site.Params.disrupted }}'; var themeDownColor = '#{{ .Site.Params.down }}'; + + </script> <!-- Sources --> <style> @@ -27,7 +29,7 @@ margin: 0; background: #fff; color: #4d4d4d; - font: 100%/1.5 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); } @@ -64,7 +66,8 @@ h1, h2, h4 { font-weight: normal; color: #000; - font-family: "Segoe UI", BlinkMacSystemFont, -apple-system, "San Francisco Text", "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; } h3 { @@ -108,6 +111,24 @@ .right { text-align: right; } .padding-s { padding: 6px; } .padding { padding: 12px; } + .clicky { cursor: pointer; } + + + /** + * Categories + */ + + /* Categories themselves */ + .js .category--open .category__closed-marker { display: none; } + .js .category--closed .components { display: none; } + .js .category--closed .category__open-marker { display: none; } + + /* Markers */ + .js .hidden-with-js { display: none; } + .hide-without-js { display: none; } + .js span.hide-without-js { display: inline; } + .js div.hide-without-js { display: block; } + /** * UI elements @@ -181,11 +202,6 @@ color: #fff; } - .summary__date { - display: block; - cursor: pointer; - } - .summary__date:hover { color: #ccc; } @@ -267,11 +283,13 @@ */ .issue { display: block; padding: 14px 24px; } - .issue:hover { background: #f5f5f5; } - .issue:active { background: #eee; } + .issue:hover, .category__head:hover { background: #f5f5f5; } + .issue:active, .category__head:active { background: #eee; } .issue h3 { line-height: 1.25; } + .category__head { margin-top: 20px; } + /** * Specific to the status @@ -313,6 +331,31 @@ display: inline; } } + + /** + * Dark theme + */ + + @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; } + } </style> {{ if .Site.Params.enableCustomHTML }} {{ partial "custom/meta" . }} diff --git a/static/admin/config.yml b/static/admin/config.yml index 5bee7cb..1b64060 100644 --- a/static/admin/config.yml +++ b/static/admin/config.yml @@ -29,6 +29,7 @@ collections: - {label: "Title", name: "title", widget: "string"} - {label: "Start date & time (your time) ⌚", name: "date", widget: "datetime"} - {label: "Mark as resolved ✔", name: "resolved", widget: "boolean", required: false, default: false} + - {label: "Mark as informational ℹ", name: "informational", widget: "boolean", required: false, default: false} - {label: "End date & time (your time) ⌛", name: "resolvedWhen", widget: "datetime", required: false} - label: "Affected systems (use exact name, separated by commas) 🧐" name: "affected" @@ -38,9 +39,9 @@ collections: name: "severity" widget: "select" options: - - { label: "High (Down)", value: "down" } - - { label: "Medium (Disrupted)", value: "disrupted" } - - { label: "Low (Announcement)", value: "notice" } + - { label: "High (Down) ◼ ", value: "down" } + - { label: "Medium (Disrupted) ▲", value: "disrupted" } + - { label: "Low (Announcement) ◆", value: "notice" } - label: "Markdown body (sequence of events, description, post-mortem)" name: "body" widget: "markdown" @@ -113,9 +114,20 @@ collections: allow_add: true fields: - {label: "Name", name: "name", widget: string} + - {label: "Category", hint: "All systems need a category. For more, read the migration docs: https://github.com/cstate/cstate/wiki/Usage#v3-to-v4", name: "category", widget: string} - {label: "Description", name: "description", widget: string, required: false} - {label: "Partial", hint: "Custom HTML feature: https://github.com/cstate/cstate/wiki/Customization#custom-html", name: "partial", widget: string, required: false} - # Components + # Categories + - label: "Categories" + name: "categories" + widget: "list" + allow_add: true + fields: + - {label: "Name", name: "name", widget: string} + - {label: "Description", name: "description", widget: string, required: false} + - {label: "Should this category be open by default", name: "closed", widget: "boolean", required: false} + - {label: "Should the name of this category be shown? If you want to create the appearance of an Uncategorized category, enable this.", name: "untited", widget: "boolean", required: false} + # Tabs - label: "Tabs" hint: 'You can add extra tabs below the main homepage summary, for example, to external sites, monitoring services, as shown in the example below. Try Uptime Robot!' name: "customTabs" @@ -172,6 +184,15 @@ collections: min: 1 max: 100 default: 10 + # Incidents view format + - label: 'Should the incident history be sorted by year or month?' + name: 'incidentHistoryFormat' + hint: 'Enabling sorting disables pagination. More: https://github.com/cstate/cstate/wiki/Customization#enable-sorting--archives-by-year-or-month-v40' + widget: 'select' + options: + - { label: "Show by year", value: "yearly" } + - { label: "Show by month", value: "monthly" } + - { label: "No sorting; enable pagination", value: "none" } # Brand color - label: 'Header: always keep brand color the same' name: 'alwaysKeepBrandColor' @@ -224,3 +245,22 @@ collections: widget: "hidden" fields: - {label: "affected", name: "affected", widget: "hidden", default: "affected"} + - label: "outputs (Do not touch!)" + name: outputs + widget: "hidden" + fields: + - label: "page" + name: page + widget: "list" + allow_add: false + default: ['html', 'json'] + - label: "section" + name: section + widget: "list" + allow_add: false + default: ['html', 'json', 'rss'] + - label: "home" + name: home + widget: "list" + allow_add: false + default: ['html', 'json', 'rss']
\ No newline at end of file |