wip

Gemfile

@@ -40,6 +40,7 @@ gem "webpacker" # Transpile app-like JavaScript. Read more: https://github.com/r
 gem "turbolinks", "~> 5" # Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
 gem "hamlit" # Faster haml templates
 gem "bootstrap" # Internet Style
+gem "jquery-rails" # We need jquery because bootstrap
 
 gem "commonmarker" # Rendering markdown. Used to render readme on homepage
 

README.markdown

@@ -9,6 +9,7 @@ Updates - need to be integrated into the documentation
 - Added views from devise into the application so they can manually be managed [devise-bootstrap-views](https://github.com/hisea/devise-bootstrap-views)
 
 - re: active_model_serializers version - is what discourse uses - https://github.com/discourse/discourse/blob/master/Gemfile
+- remove credentials, explain what to do when setting up again
 
 TODO:
 

app/assets/javascripts/application.js

@@ -11,6 +11,7 @@
 // about supported directives.
 //
 //= require rails-ujs
-//= require activestorage
 //= require turbolinks
-//= require_tree .
+//= require jquery3
+//= require popper
+//= require bootstrap-sprockets

app/assets/stylesheets/application.scss

@@ -0,0 +1,3 @@
+/*= require_self */
+
+@import "bootstrap";

app/assets/stylesheets/documentation.scss

@@ -0,0 +1,295 @@
+/*= require_self */
+//= require swagger-ui
+
+@import "bootstrap";
+
+$gray-lightest: #f4f6f7;
+$gray-lighterer: #eef2f3;
+$gray-lighter: #ecf0f1;
+$gray-light: #a7a7a7;
+$gray: #bebebe;
+
+$form-font-weight: 400;
+
+#header {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  z-index: 1000;
+  border-top: 1px solid lighten($gray-lighter, 2%);
+  border-bottom: 1px solid darken($gray-lighter, 7%);
+  padding: 14px;
+  @include transition(transform 200ms linear);
+  &.headroom--pinned {
+    @include translate(0, 0%);
+  }
+  &.headroom--unpinned {
+    @include translate(0, -100%);
+  }
+}
+
+body.swagger-section {
+  // Ensure the floating header doesn't cover up important things
+  padding-top: 60px;
+}
+
+.swagger-section {
+  // Ensure we override the swagger-ui styles
+  .content-header#header {
+    background: $gray-lighter;
+    a#logo {
+      font-size: 1.5em;
+      font-weight: bold;
+      text-decoration: none;
+      background: transparent url("/assets/documentation_v2/logo_small.png")
+        no-repeat left center;
+      padding: 20px 0 20px 40px;
+      color: black;
+    }
+    form#api_selector {
+      clear: both;
+      margin-top: 0;
+      // @include clearfix;
+      display: block;
+      width: 100%;
+      position: relative;
+      padding-top: 0;
+    }
+    .api-header-group {
+      padding: 0 10px 0.25em;
+      label {
+        font-weight: $form-font-weight;
+        color: $gray;
+        margin-bottom: 0.3em;
+      }
+      input {
+        box-shadow: none;
+      }
+    }
+    .api-header-url {
+      input {
+        background: none;
+        border: none;
+      }
+    }
+
+    a#explore {
+      color: white;
+      float: right;
+      margin: 0.25em 10px 10px 0;
+    }
+  }
+
+  .outside-info {
+    padding: 60px 0 40px;
+    h2 {
+      margin: 0.5em 0;
+    }
+    em {
+      font-style: italic;
+    }
+  }
+
+  .content {
+    min-height: 10px;
+  }
+  .sandbox_header {
+    padding: 5px 2px;
+  }
+  input.submit {
+    @extend .btn;
+    @extend .btn-primary;
+  }
+
+  .swagger-ui-wrap {
+    max-width: 100%;
+  }
+}
+
+@media (min-width: 599px) {
+  .swagger-section #header form#api_selector {
+    width: 91.5%;
+    float: left;
+    padding-top: 0.3em;
+    .api-header-group {
+      float: left;
+      margin-right: 2%;
+      position: relative;
+      padding: 0;
+    }
+    .api-header-url {
+      width: 33%;
+      label {
+        padding-left: 0.5em;
+      }
+    }
+    .api-header-key {
+      width: 53%;
+    }
+    a#explore {
+      float: left;
+      width: 10%;
+      margin: 1.45em 0 0;
+      padding-left: 0;
+      padding-right: 0;
+    }
+  }
+}
+
+.swagger-section .container {
+  h2 {
+    font-size: 24px;
+  }
+  strong {
+    font-weight: bold;
+  }
+  .alert {
+    line-height: 1.2em;
+  }
+  p {
+    padding-bottom: 0.5em;
+  }
+  pre {
+    margin: 0.5em 0 2em;
+    code {
+      background: none;
+    }
+  }
+  .access-tokens {
+    margin-left: 0.25em;
+    li {
+      background: white;
+      border-radius: 4px;
+      padding: 0.25em 0.5em;
+      margin: 0 0 0.25em;
+    }
+    p {
+      margin: 0;
+      padding: 0.1em 0;
+    }
+  }
+  ol {
+    list-style-type: decimal;
+    padding-left: 2em;
+  }
+  .less-strong {
+    color: $gray;
+    font-size: 0.8em;
+  }
+
+  .authentication-notes {
+    margin-top: 40px;
+    h3 {
+      margin-top: 1.5em;
+    }
+  }
+}
+
+.applications-panel {
+  margin: 100px 0 0;
+  padding: 40px 0;
+  background: $gray-lightest;
+  border-top: 1px solid $gray-lighter;
+  .applications-list {
+    margin: 0;
+    li {
+      padding: 0.5em 1em 0.25em;
+      background: white;
+      margin: 1em 0 0;
+      border-radius: 4px;
+    }
+    .authorize-new-explain {
+      margin: 0;
+      padding: 1em 0 0 0;
+    }
+  }
+  .application-info {
+    padding-bottom: 0.5em;
+    position: relative;
+    .tokens-table {
+      margin-bottom: 0;
+      pre,
+      .btn {
+        margin: 0;
+        padding: 0.25em 0.5em;
+      }
+    }
+  }
+  .listed-app-name {
+    margin: 0;
+    display: block;
+    width: 90%;
+    span {
+      @include rotate(90deg);
+      margin-right: 0.75em;
+      -webkit-transition: all 0.1s ease-out;
+      -moz-transition: all 0.1s ease-out;
+      -o-transition: all 0.1s ease-out;
+      transition: all 0.1s ease-out;
+      float: left;
+      display: block;
+      font-size: 10px;
+      font-family: helvetica;
+    }
+    a:active span {
+      -webkit-transition: all 0.1s ease-out;
+      -moz-transition: all 0.1s ease-out;
+      -o-transition: all 0.1s ease-out;
+      transition: all 0.1s ease-out;
+    }
+    .listed-app-name:active,
+    &.uncollapsed {
+      span {
+        @include rotate(0deg);
+      }
+    }
+  }
+}
+
+.swagger-section #api_info {
+  // We're going to do a better job introducing this ourselves
+  display: none;
+}
+
+.api-info-header {
+  padding: 0 0 40px;
+}
+.api-info-footer {
+  padding: 40px 0;
+}
+
+footer#footer {
+  clear: both;
+  width: 100%;
+  height: 80px;
+}
+
+@media (min-width: 599px) {
+  .api-info-footer {
+    padding: 60px 0 40px;
+  }
+}
+
+#resources_container {
+  .toggleEndpointList {
+    font-weight: 600;
+  }
+  //   input { @extend .form-control; }
+}
+
+.access-tokens {
+  li {
+    .btn {
+      padding: 0.25em 0.5em;
+      margin-left: 0.5em;
+    }
+  }
+}
+
+.add-token-form {
+  label {
+    font-weight: $form-font-weight;
+    margin-right: 0.5em;
+  }
+}

app/controllers/api/v1/root_v1.rb

@@ -9,7 +9,7 @@ class RootV1 < API::Base
         doc_version: "v1"
         hide_documentation_path: true,
         info: {
-          title: "Grape Swagger base app",
+          title: "Grape Doorkeeper base app",
           description: "This is the base api provided by the awesome sample app - https://github.com/sethherr/grape-doorkeeper"
         }
 

db/migrate/20180902201811_devise_create_users.rb

@@ -33,7 +33,7 @@ def change
       # t.datetime :locked_at
 
       # Omniauthable
-      t.string   "provider"
+      t.string   :provider
 
 
       t.timestamps null: false