diff --git a/README.md b/README.md index e4ced07..522d8c3 100644 --- a/README.md +++ b/README.md @@ -20,6 +20,7 @@ Templates: - profile ([demo](https://dansup.github.io/bulma-templates/templates/profile.html) | [source](https://raw.githubusercontent.com/dansup/bulma-templates/master/templates/profile.html)) - projects ([demo](https://dansup.github.io/bulma-templates/templates/projects.html) | [source](https://raw.githubusercontent.com/dansup/bulma-templates/master/templates/projects.html)) - register ([demo](https://dansup.github.io/bulma-templates/templates/register.html) | [source](https://raw.githubusercontent.com/dansup/bulma-templates/master/templates/register.html)) +- status page ([demo](https://dansup.github.io/bulma-templates/templates/statuspage.html) | [source](https://raw.githubusercontent.com/dansup/bulma-templates/master/templates/statuspage.html)) - timeline ([demo](https://dansup.github.io/bulma-templates/templates/timeline.html) | [source](https://raw.githubusercontent.com/dansup/bulma-templates/master/templates/timeline.html)) - video player ([demo](https://dansup.github.io/bulma-templates/templates/video-player.html) | [source](https://raw.githubusercontent.com/dansup/bulma-templates/master/templates/video-player.html)) diff --git a/css/statuspage.css b/css/statuspage.css new file mode 100644 index 0000000..27f01e6 --- /dev/null +++ b/css/statuspage.css @@ -0,0 +1,109 @@ +body { + font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"; +} +.logo { + +} +.logo img { + width:120px; +} +.container { + padding-top:50px; + max-width: 968px; +} +.section { + margin-top:40px; + border: 1px solid #efefef; + border-radius: 5px; +} +.status-header { + padding: 40px 40px 80px 40px; +} +.status-header .indicator { + display: inline-block; + width: 15px; + height: 15px; + border-radius: 100%; + margin-right: 20px; + background: #17d766; + background: -moz-linear-gradient(top, #17d766 0%, #17d766 50%, #16cf62 51%, #16cf62 100%); + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#17d766), color-stop(50%,#17d766), color-stop(51%,#16cf62), color-stop(100%,#16cf62)); + background: -webkit-linear-gradient(top, #17d766 0%,#17d766 50%,#16cf62 51%,#16cf62 100%); + background: -ms-linear-gradient(top, #17d766 0%,#17d766 50%,#16cf62 51%,#16cf62 100%); + background: linear-gradient(to bottom, #17d766 0%,#17d766 50%,#16cf62 51%,#16cf62 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17d766', endColorsGradientType=0); + opacity: 0.8; + filter:alpha(opacity=80); +} +.status-header .title { + display: inline-block; +} +.status-header .subtitle { + display: block; + margin-left: 35px; +} +.status-uptime { + border-top: 1px solid #efefef; + border-bottom: 1px solid #efefef; + padding: 15px 95px 0 95px; + margin: 0 -20px -20px -20px; +} +.status-uptime .title { + display: inline-block; + font-size: 14px; + color: #bbb; +} +.status-uptime .uptime { + display: inline-block; + margin-left: 60px; + font-size: 14px; + color: #bbb; +} +.status-list { + padding:95px; +} +.status-list .label { + font-size: 16px; + font-weight: bold; +} +.status-list .amount { + font-size: 16px; + font-weight: bold; + color: #bbb; +} +.status-tweets { +} +.status-tweets .twitter { + padding: 0 15px 15px 15px; + margin: -20px -20px 50px -20px; + border-bottom: 1px solid #efefef; +} +.status-tweets .icon { + display: inline-block; + padding-left:20px; + color: #11bff2; +} +.status-tweets .username { + display: inline-block; + padding-left: 30px; +} +.status-tweets .updates { + padding: 0 40px 40px 40px; +} +.status-tweets .update { + padding-top: 40px; +} +.status-tweets .update .timestamp { + font-weight: bold; + color: #bbb; +} +.status-tweets .updates .event { + font-size: 16px; + line-height: 1.6; +} +.status-footer { + padding-left: 20px; +} +.status-footer a { + padding: 0 10px; +} \ No newline at end of file diff --git a/images/statuspage.png b/images/statuspage.png new file mode 100644 index 0000000..fb455ed Binary files /dev/null and b/images/statuspage.png differ diff --git a/index.html b/index.html index f242005..e1d506d 100644 --- a/index.html +++ b/index.html @@ -200,6 +200,18 @@

A modern register page

+
+ +

+ Status Page + + v 0.1.0 + +

+

A modern status page

+
+ +

diff --git a/templates/statuspage.html b/templates/statuspage.html new file mode 100644 index 0000000..d1dc5dc --- /dev/null +++ b/templates/statuspage.html @@ -0,0 +1,90 @@ + + + + + + + Status Page - Free Bulma template + + + + + +
+ +
+
+
+
All services are online.
+
As of August 1, 2016 at 11:08PM MST.
+
+
+
Services
+
Uptime of the past 90 days
+
+
+
+
API
+
99%
+
99%
+
+
+
+
library.js
+
99%
+
99%
+
+
+
+
website
+
100%
+
100%
+
+
+
+
something hacky
+
40%
+
40%
+
+
+
+
something unreliable
+
14%
+
14%
+
+
+
+
+
+ +
+
+
July 29 at 5:39pm
+
We're experiencing higher than normal load on our batch infrastructure. Webhooks are about an hour delayed. API calls are not impacted
+
+
+
July 23 at 9:21pm
+
Sorry about that! Our systems are showing everything as caught up now. Let us know if you're still seeing problems!
+
+
+
+
+
+
+

+ Legal + About + Jobs +

+
+
+
+ + \ No newline at end of file