Merge branch 'master' of gitlab.com:medlabboulder/communityrule into 84-configuration-glitch

README.md

@@ -13,3 +13,11 @@ To contribute governance templates, copy an existing one at `_template/[template
 The app currently depends on Vue.js. Major scripts are located at `assets/js/`.
 
 To get involved, [contact MEDLab](mailto:medlab@colorado.edu).
+
+# Run Locally
+
+1. [Install Jekyll Prerequisites](https://jekyllrb.com/docs/installation)
+2. Install Jekyll and the bundler with `gem install jekyll bundler`
+3. Install project dependencies with `bundle install`
+4. Run the webserver with `bundle exec jekyll serve`
+5. View your site locally at [https://localhost:4000]](https://localhost:4000)

_includes/vue-rule-script.html

@@ -232,7 +232,6 @@
         <div class="btn-group" v-if="!legacy && !view">
             <vue-button class="primary is-large" @click="handleClickPublish" :icon="icons.publish" :loading="publishing">Publish</vue-button>
             <vue-button class="is-large" @click="handleClickDownload" :icon="icons.download">Download</vue-button>
-            <vue-button class="is-large" @click="handleClickExport" :icon="icons.export">Export</vue-button>
             <vue-button class="is-large" @click="handleClickImport" :icon="icons.upload">Import <div class="btn-cover">coming soon!</div></vue-button>
         </div>
         <div class="btn-group" v-if="view && !legacy">

_sass/_rule-app.scss

@@ -24,9 +24,17 @@ $mobile: 420px;
 
   background-color: transparent;
   border: 1px solid $color-secondary;
+
   &.has-icon {
     padding-left: .25em;
+    display: flex;
+    align-items: center;
+
+    img {
+      margin-right: .25em
+    }
   }
+
   &.is-large {
     font-size: 1.2em;
   }
@@ -46,7 +54,9 @@ $mobile: 420px;
     cursor: pointer;
     color: $color-secondary;
     border-color: black;
+    background-color: lightgray;
   }
+
   &.primary {
     background-color: $color-primary;
     color:darken($color-primary, 80%);
@@ -413,6 +423,11 @@ h2 .icon img {
     padding: .5rem 1rem;
     text-align: center;
     flex: 1 1 auto;
+
+    img { 
+      margin-right: .25em;
+    }
+
     &.active {
       background-color: #fff;
       margin-bottom: -1px;

assets/js/vue.rules.js

@@ -714,13 +714,6 @@ const app = Vue.createApp({
 
       this.saveFile(`${this.ruleExport.ruleID}.md`, output, 'text/markdown');
     },
-    /**
-     * Handles the click event for downloading the rule as a JSON file
-     */
-    handleClickExport() {
-      const output = this.json;
-      this.saveFile(`${this.ruleExport.ruleID}.json`, output, 'application/json');
-    },
     /**
      * IE10+ Firefox, and Chrome method for saving a file
      * https://stackoverflow.com/a/33542499