disco_app 0.10.4

data/app/assets/stylesheets/disco_app/admin/_nav.scss

@@ -0,0 +1,184 @@
+//
+// nav.scss
+// Styles for admin navigation.
+// --------------------------------------------------
+
+.next-nav {
+  z-index: 221;
+  width: 240px;
+  position: fixed;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  -webkit-transition: -webkit-transform 200ms ease;
+  transition: -webkit-transform 200ms ease;
+  transition: transform 200ms ease;
+  transition: transform 200ms ease, -webkit-transform 200ms ease;
+  overflow: hidden;
+}
+
+.next-nav__panel {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+  -webkit-overflow-scrolling: touch;
+}
+
+.next-nav__panel--primary {
+  z-index: 1;
+  width: 240px;
+  background-color: #31373d;
+  -webkit-transition: background-color 200ms ease;
+  transition: background-color 200ms ease;
+}
+
+.next-nav--is-expanded .next-nav__panel--primary {
+  background-color: #212529;
+}
+
+.next-nav__logo {
+  height: 56px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  padding-left: 20px;
+  background-color: #272c30;
+  -webkit-transition: background-color 200ms ease;
+  transition: background-color 200ms ease;
+  overflow: hidden;
+}
+
+.next-nav--is-expanded .next-nav__logo {
+  background-color: #212529;
+}
+
+.next-nav__logo--disco .next-nav__svg-logo {
+  -webkit-transition: none;
+  transition: none;
+  -webkit-transform: translate3d(-5px, 0, 0);
+  transform: translate3d(-5px, 0, 0);
+}
+
+.next-nav__svg-logo {
+  width: 102px;
+  height: auto;
+  -webkit-transition: -webkit-transform 200ms ease;
+  transition: -webkit-transform 200ms ease;
+  transition: transform 200ms ease;
+  transition: transform 200ms ease, -webkit-transform 200ms ease;
+}
+
+.next-nav__list {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.next-nav__list--primary {
+  background-color: #31373d;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: absolute;
+  top: 56px;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+.next-nav__item {
+  display: block;
+  min-height: 40px;
+}
+
+.next-nav__link {
+  color: rgba(0,0,0,0.9);
+  font-size: 1.07143rem;
+  line-height: 1.42857rem;
+  font-weight: 400;
+  text-transform: initial;
+  letter-spacing: initial;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  font-weight: 500;
+  color: #c3cfd8;
+  padding: 0 10px 0 20px;
+  height: 40px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  background-color: transparent;
+  border: none;
+  cursor: pointer;
+  line-height: normal;
+
+  @media screen and (min-width: 640px) {
+    font-size: 1rem;
+  }
+}
+
+.next-nav__link:hover, .next-nav__link:focus, .next-nav__link:active, .next-nav__link.next-nav__link--is-selected {
+  text-decoration: none;
+  color: #ffffff;
+}
+
+.next-nav__link--is-selected {
+  background-color: #454e57;
+}
+
+.next-nav__text {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  display: block;
+  color: #c3cfd8;
+  -webkit-transition: opacity 200ms ease, -webkit-transform 200ms ease;
+  transition: opacity 200ms ease, -webkit-transform 200ms ease;
+  transition: transform 200ms ease, opacity 200ms ease;
+  transition: transform 200ms ease, opacity 200ms ease, -webkit-transform 200ms ease;
+  -webkit-box-flex: 1;
+  -webkit-flex-grow: 1;
+  -ms-flex-positive: 1;
+  flex-grow: 1;
+  -webkit-flex-basis: 0%;
+  -ms-flex-preferred-size: 0%;
+  flex-basis: 0%;
+  margin-left: 10px;
+}
+
+.next-nav__link:hover .next-nav__text, .next-nav__link:focus .next-nav__text, .next-nav__link:active .next-nav__text, .next-nav__link.next-nav__link--is-selected .next-nav__text {
+  color: #ffffff;
+}
+
+.next-nav__link .next-icon {
+  fill: #798c9c;
+  -webkit-transition: opacity 200ms ease;
+  transition: opacity 200ms ease;
+}
+
+.next-nav__link:hover .next-icon, .next-nav__link:focus .next-icon, .next-nav__link:active .next-icon, .next-nav__link.next-nav__link--is-selected .next-icon {
+  fill: #ffffff;
+}

data/app/assets/stylesheets/disco_app/admin.scss

@@ -0,0 +1,11 @@
+//
+// Styles for the Disco application admin.
+// --------------------------------------------------
+
+// Import the core.
+@import 'disco_app';
+
+// Admin-specific styling.
+@import 'admin/layout';
+@import 'admin/nav';
+@import 'admin/header';

data/app/assets/stylesheets/disco_app/disco_app.scss

@@ -0,0 +1,21 @@
+//
+// Styles for Disco applications.
+// --------------------------------------------------
+
+// Variables
+$font-family: -apple-system, "BlinkMacSystemFont", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", sans-serif;
+
+// Mixins and utilities.
+@import 'mixins/flexbox';
+
+// UI Kit - Core and our addons.
+@import 'ui-kit/ui-kit';
+@import 'ui-kit/ui-type';
+@import 'ui-kit/ui-icons';
+@import 'ui-kit/ui-layout';
+@import 'ui-kit/ui-forms';
+@import 'ui-kit/ui-stack';
+@import 'ui-kit/ui-empty-state';
+@import 'ui-kit/ui-footer-help';
+@import 'ui-kit/ui-page-actions';
+@import 'ui-kit/ui-tabs';

data/app/assets/stylesheets/disco_app/frame/_buttons.scss

@@ -0,0 +1,54 @@
+//
+// Buttons
+// --------------------------------------------------
+
+// Base button
+.btn {
+  cursor: pointer;
+  display: inline-block;
+  height: 32px;
+  line-height: 30px;
+  padding: 0 9px;
+  border-radius: 4px;
+
+  white-space: nowrap;
+  vertical-align: middle;
+  font-family: $font-family;
+  font-size: 13px;
+
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+  -webkit-appearance: none;
+
+  &:hover {
+    text-decoration: none;
+  }
+}
+
+// Default button
+.btn, .btn-default {
+  background-color: #fcfcfc;
+  border: 1px solid #e3e3e3;
+  color: #0078bd;
+
+  &:hover, &:focus, &.focus {
+    background-color: #efefef;
+    border-color: #d6d6d6;
+    color: #0078bd;
+  }
+}
+
+// Primary button
+.btn-primary {
+  background-color: #0078bd;
+  border: 1px solid #0078bd;
+  color: #fff;
+
+  &:hover, &:focus, &.focus {
+    background-color: #3491c8;
+    border-color: #2a74a0;
+    color: #fff;
+  }
+}

data/app/assets/stylesheets/disco_app/frame/_forms.scss

@@ -0,0 +1,26 @@
+//
+// Forms
+// --------------------------------------------------
+
+form {
+  margin: 40px 0;
+}
+
+input[type="text"],
+input[type="url"], {
+  vertical-align: top;
+  height: 32px;
+  font-family: $font-family;
+  font-size: 13px;
+  padding: 5px;
+  margin: 0;
+  border: 1px solid #ccc;
+  display: inline-block;
+  color: #222;
+  border-radius: 4px;
+
+  &:focus, &.focus {
+    border: 1px solid #0078bd;
+    outline: 0;
+  }
+}

data/app/assets/stylesheets/disco_app/frame/_layout.scss

@@ -0,0 +1,77 @@
+//
+// Layout
+// --------------------------------------------------
+
+* {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+#sidebar {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  width: $sidebar-width;
+
+  background: #31373d;
+  box-shadow: -1px 0 0 #2b3136 inset;
+}
+
+#header {
+  position: absolute;
+  top: 0;
+  left: $sidebar-width;
+  right: 0;
+  height: $header-height;
+
+  background: #ffffff;
+  border-bottom: 1px solid #e6e6e6;
+  border-color: rgba(0,0,0, .07);
+}
+
+#header-title {
+  position: absolute;
+  bottom: 12px;
+  left: 20px;
+
+  max-width: 718px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+#header-title-icon {
+  margin: 5px 10px 0 0;
+  float: left;
+}
+
+#header-actions {
+  position: absolute;
+  bottom: 12px;
+  right: 20px;
+
+  .btn {
+    margin: 0 0 0 5px;
+  }
+}
+
+#content-wrapper {
+  position: absolute;
+  top: $header-height;
+  left: $sidebar-width;
+  bottom: 0;
+  right: 0;
+}
+
+#content {
+  width: 100%;
+  height: 100%;
+  border: none;
+}
+
+#iframe {
+  padding: 40px 0;
+  text-align: center;
+}

data/app/assets/stylesheets/disco_app/frame/_type.scss

@@ -0,0 +1,25 @@
+//
+// Type
+// --------------------------------------------------
+
+// Base
+html, body {
+  font-family: $font-family;
+  font-size: 13px;
+}
+
+// Headers
+h1 {
+  font-size: 24px;
+  line-height: 32px;
+  height: 32px;
+  font-family: $font-family;
+  font-weight: 300;
+  margin: 0;
+  padding: 0;
+}
+
+// Text utilities
+.text-muted {
+  color: #ccc;
+}

data/app/assets/stylesheets/disco_app/frame.scss

@@ -0,0 +1,10 @@
+// Set variables
+$font-family: -apple-system, "BlinkMacSystemFont", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", sans-serif;
+$sidebar-width: 197px;
+$header-height: 57px;
+
+// Include components
+@import "frame/layout";
+@import "frame/type";
+@import "frame/buttons";
+@import "frame/forms";