tenon 1.0.52 → 1.0.53

data/app/assets/javascripts/tenon/tenon_manifest.js

@@ -21,8 +21,7 @@
 //= require jquery.twoLevelSort
 //= require jquery.ui.sortable
 //= require js-routes
-//= require medium-editor
-//= require ./medium_customizations
+//= require ./medium-on-tenon
 //= require select2
 //= require uri
 

data/app/assets/stylesheets/tenon/colors-named.css.scss

@@ -17,6 +17,6 @@ $tc-med-grey: $tn-med-grey;
 $tc-dark-grey: $tn-dark-grey;
 
 // Medium Editor
-$medium-editor-toolbar-border: transparentize(#fff, 0.6);
-$medium-editor-toolbar-hover: $medium-editor-toolbar-border;
-$medium-editor-toolbar-active: $medium-editor-toolbar-border;
+// $medium-editor-toolbar-border: transparentize(#fff, 0.6);
+// $medium-editor-toolbar-hover: $medium-editor-toolbar-border;
+// $medium-editor-toolbar-active: $medium-editor-toolbar-border;

data/app/assets/stylesheets/tenon/ui/medium-editor.css.scss

@@ -1,3 +1,80 @@
+// Anchor - asset and cancel buttons:
+.medium-editor-cancel, .medium-editor-link-to-asset {
+  &:hover {
+    text-decoration: none;
+    &:before {
+      color: lighten($tn-primary, 40%);
+    }
+  }
+  &:before {
+    font-family: 'FontAwesome';
+    font-size: 20px;
+    font-weight: 400;
+    position: relative;
+    top: 2px;
+    color: white;
+  }
+}
+.medium-editor-cancel:before {
+  content: '\f057';
+}
+.medium-editor-link-to-asset:before {
+  content: '\f1c1';
+}
+
+// Set z-index below tooltips:
+.medium-editor-toolbar {
+  z-index: 1000;
+}
+
+// Open link in new window checkbox styles:
+.medium-editor-toolbar-form-anchor {
+  input {
+    height: 56px;
+    &.medium-editor-toolbar-anchor-target {
+      position: absolute;
+      z-index: 1;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      display: block;
+      width: 100%;
+      height: 30px;
+      margin: 0;
+      cursor: pointer;
+      opacity: 0;
+      &:checked + .medium-editor-toolbar-anchor-target-label:before {
+        // content: '\f08e'; // external-light
+        content: '\f14c'; // external-dark
+      }
+    }
+  }
+  .medium-editor-toolbar-anchor-target-wrap {
+    position: relative;
+    top: 2px;
+    display: inline-block;
+    margin: 0;
+    padding: 0;
+  }
+  label.medium-editor-toolbar-anchor-target-label {
+    display: inline-block;
+    width: auto;
+    margin: 0 6px;
+    padding: 0;
+    &:before {
+      font-family: 'FontAwesome';
+      font-size: 18px;
+      line-height: 30px;
+      display: block;
+      content: '\f0c8'; // square-dark
+      // content: '\f096'; // square-light
+      color: white;
+    }
+  }
+}
+
+// Color updates:
 .medium-toolbar-arrow-under:after {
   border-color: $tn-primary transparent transparent;
 }
@@ -8,7 +85,6 @@
 
 .medium-editor-toolbar-form-anchor {
   background: $tn-primary;
-
   input {
     background: $tn-primary;
   }
@@ -19,22 +95,19 @@
 }
 
 .medium-editor-toolbar {
+  border: 1px solid lighten($tn-primary, 10%);
   background-color: $tn-primary;
-  border: 1px solid $medium-editor-toolbar-border;
-
   li .medium-editor-button-active {
-    background-color: $medium-editor-toolbar-active;
+    background-color: darken($tn-primary, 10%);
   }
-
   li button {
-    border-right: 1px solid $medium-editor-toolbar-border;
-
+    border-right: 1px solid lighten($tn-primary, 10%);
     &:hover {
-      background-color: $medium-editor-toolbar-hover;
+      background-color: lighten($tn-primary, 10%);
     }
   }
 }
 
 .medium-editor-placeholder:after {
-  color: $medium-editor-toolbar-border;
+  color: lighten($tn-primary, 10%);
 }

data/app/assets/stylesheets/tenon/ui/tenon-content.css.scss

@@ -3,9 +3,7 @@
     display: none;
   }
   &.mobile-breakpoint {
-    .one, .two, .three, .four, .five, .six,
-
-    .seven, .eight, .nine, .ten, .eleven, .twelve {
+    .one, .two, .three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve {
       @include span-columns(12);
     }
     .wrapped-image {
@@ -19,15 +17,15 @@
 
 .tn-tc-main-actions {
   a {
-    @include transition(all 0.2s ease);
+    @include transition(all .2s ease);
+    font-size: $tn-font-large;
     margin: $tn-margin $tn-margin 0 0;
     text-transform: uppercase;
-    font-size: $tn-font-large;
     span {
+      font-size: $tn-font-small;
       position: relative;
       top: -2px;
       padding-left: 5px;
-      font-size: $tn-font-small;
     }
     &:hover {
       text-decoration: none;
@@ -41,16 +39,16 @@
   // @import "styleguides/styleguide";
   // @extend body;
   .tn-tc-row {
-    @include transition(box-shadow 0.2s ease-in);
-    @include transition(border 0.2s ease-in);
+    @include transition(box-shadow .2s ease-in);
+    @include transition(border .2s ease-in);
+    min-height: 50px;
     margin-bottom: 10px;
     padding: 0;
-    min-height: 50px;
     &.ui-sortable-helper {
       overflow: hidden;
       box-sizing: content-box;
-      padding: 5px 10px;
       max-height: 200px;
+      padding: 5px 10px;
       border: 1px solid $tn-dark-grey;
       background: $tn-light-grey;
       box-shadow: 1px 1px 5px $tn-dark-grey;
@@ -60,7 +58,9 @@
       max-height: 200px;
       border: 1px dashed $tn-dark-grey;
     }
-
+    i {
+      font-size: 1em;
+    }
     .tn-tc-bottombar {
       display: none;
     }
@@ -71,20 +71,19 @@
   .drag-anchor {
     float: left;
   }
-
   .tn-tc-topbar, .tn-tc-bottombar {
     padding: 0;
     // background-color: $tn-med-grey;
     .actions {
-      @include transition(all 0.2s ease);
-      color: $tn-dark-grey;
-      text-align: right;
+      @include transition(all .2s ease);
       position: relative;
+      text-align: right;
+      color: $tn-dark-grey;
       i {
-        @include transition(all 0.2s ease);
+        @include transition(all .2s ease);
       }
       a {
-        @include transition(all 0.2s ease);
+        @include transition(all .2s ease);
         display: inline-block;
         padding: 10px 0 5px;
         color: $tn-dark-grey;
@@ -138,25 +137,25 @@
     min-height: 100%;
   }
   .editable-text {
-    padding: 5px;
     min-height: 50px;
+    padding: 5px;
     outline: none;
     background: #fff;
-    p {
-      margin-top: 0;
+    h3, h4, p, ul, ol {
+      margin: 0 0 $tn-margin;
       padding-top: 0;
     }
   }
   a.add-image {
     span {
+      font-family: $tn-open-sans;
+      line-height: 200px;
       display: block;
       height: 200px;
+      text-align: center;
+      color: $tn-dark-grey;
       border: 4px dashed $tn-dark-grey;
       background: $tn-med-grey;
-      color: $tn-dark-grey;
-      text-align: center;
-      font-family: $tn-open-sans;
-      line-height: 200px;
     }
   }
   .wrapped-image {
@@ -166,7 +165,6 @@
         padding: 0;
       }
     }
-
     &.left {
       float: left;
       padding: 5px 10px 0 5px;
@@ -191,20 +189,22 @@
     overflow: hidden;
     img {
       display: block;
+      width: auto;
       max-width: 100%;
       margin: 0 auto;
-      width: auto;
     }
-    &.stretch img { width: 100%; }
+    &.stretch img {
+      width: 100%;
+    }
   }
   textarea.caption, div.tn-tc-caption {
+    font-size: $tn-font-small;
+    width: 100%;
     margin: 0;
     padding: 5px;
-    width: 100%;
-    background: $tn-dark-grey;
-    color: #fff;
-    font-size: $tn-font-small;
     resize: none;
+    color: #fff;
+    background: $tn-dark-grey;
   }
   textarea.caption:-moz-placeholder {
     color: #fff;
@@ -213,7 +213,7 @@
     color: $tn-light-grey;
   }
   .one, .two, .three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve {
-    @include transition(width 0.2s ease);
+    @include transition(width .2s ease);
   }
 }
 
@@ -235,8 +235,7 @@
 
 .image-controls {
   @include transition(none);
-  &.full-width-image, &.three-column-image, &.four-column-image,
-  &.stacked-image-and-text {
+  &.full-width-image, &.three-column-image, &.four-column-image, &.stacked-image-and-text {
     .grow-image, .shrink-image, .swap-sides {
       display: none;
     }
@@ -245,24 +244,23 @@
     outline: none;
     background: lighten($tn-primary, 10%);
   }
-
   .link-form {
     z-index: $tn-z-medium-editor-controls;
   }
 }
 
 [contenteditable=true]:empty:not(:focus):before {
-  color: $tn-med-grey;
   content: attr(data-placeholder);
+  color: $tn-med-grey;
 }
 
 a.open-embed-modal {
-  @include transition(all 0.2s ease);
+  @include transition(all .2s ease);
+  font-size: $tn-font-small;
   display: block;
   padding: 5px 0;
-  color: $tn-dark-grey;
   text-transform: uppercase;
-  font-size: $tn-font-small;
+  color: $tn-dark-grey;
 }
 
 .tn-tc-row:hover a.open-embed-modal {

data/lib/tenon/version.rb

@@ -1,3 +1,3 @@
 module Tenon
-  VERSION = '1.0.52'
+  VERSION = '1.0.53'
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: tenon
 version: !ruby/object:Gem::Version
-  version: 1.0.52
+  version: 1.0.53
 platform: ruby
 authors:
 - factor[e] design initiative
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-12-30 00:00:00.000000000 Z
+date: 2015-01-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: better_errors
@@ -999,7 +999,7 @@ files:
 - app/assets/javascripts/tenon/features/tenon_content/wrapped_sizing.js.coffee
 - app/assets/javascripts/tenon/features/video_feeds.js.coffee
 - app/assets/javascripts/tenon/manifest.json
-- app/assets/javascripts/tenon/medium_customizations.js
+- app/assets/javascripts/tenon/medium-on-tenon.js
 - app/assets/javascripts/tenon/templates/assets/asset_field.jst.eco
 - app/assets/javascripts/tenon/templates/assets/asset_progress.jst.eco
 - app/assets/javascripts/tenon/templates/assets/asset_row.jst.eco
@@ -1502,7 +1502,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.4.5
+rubygems_version: 2.2.2
 signing_key: 
 specification_version: 4
 summary: A highly flexible mountable Rails CMS built for rapid application development.

data/app/assets/javascripts/tenon/medium_customizations.js

@@ -1,65 +0,0 @@
-MediumEditor.prototype.toolbarFormAnchor = function () {
-  var anchor = document.createElement('div'),
-    input = document.createElement('input'),
-    a = document.createElement('a'),
-    button = document.createElement('a');
-    icon = document.createElement('i');
-
-  a.setAttribute('href', '#');
-  a.innerHTML = '×';
-  a.className = 'medium-editor-cancel';
-
-  button.id = 'medium-editor-link-to-asset';
-  button.setAttribute('href', '/tenon/item_assets/new?hide_upload=true');
-  button.setAttribute('data-modal-remote', 'true');
-  button.setAttribute('data-tooltip', 'true');
-  button.setAttribute('title', 'Link to an Asset');
-  button.setAttribute('data-modal-title', 'Link to Asset');
-  button.setAttribute('data-modal-handler', 'Tenon.features.tenonContent.AssetLink');
-
-  icon.className = 'fa fa-file-pdf-o';
-
-  button.appendChild(icon);
-
-  input.setAttribute('type', 'text');
-  input.setAttribute('placeholder', this.options.anchorInputPlaceholder);
-
-  anchor.className = 'medium-editor-toolbar-form-anchor';
-  anchor.id = 'medium-editor-toolbar-form-anchor';
-  anchor.appendChild(input);
-  anchor.appendChild(button);
-  anchor.appendChild(a);
-
-  return anchor;
-};
-
-MediumEditor.prototype.bindAnchorForm = function () {
-    var linkCancel = this.anchorForm.querySelector('a.medium-editor-cancel'),
-        self = this;
-    this.anchorForm.addEventListener('click', function (e) {
-      if ( !$(e.target).is('#medium-editor-link-to-asset *, #medium-editor-link-to-asset') ) {
-        e.stopPropagation();
-      }
-    });
-    this.anchorInput.addEventListener('keyup', function (e) {
-        if (e.keyCode === 13) {
-            e.preventDefault();
-            self.createLink(this);
-        }
-    });
-    this.anchorInput.addEventListener('click', function (e) {
-        // make sure not to hide form when cliking into the input
-        e.stopPropagation();
-        self.keepToolbarAlive = true;
-    });
-    this.anchorInput.addEventListener('blur', function () {
-        // self.keepToolbarAlive = false;
-        self.checkSelection();
-    });
-    linkCancel.addEventListener('click', function (e) {
-        e.preventDefault();
-        self.showToolbarActions();
-        restoreSelection(self.savedSelection);
-    });
-    return this;
-};