dante2-editor 0.2.0

data/app/styles/dante/_scaffold.scss

@@ -0,0 +1,24 @@
+.notesSource {
+
+  & {
+    padding: 0;
+    margin: 0;
+    position: relative;
+    color: rgba(0,0,0,0.8);
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    -moz-font-feature-settings: liga on;
+  }
+
+  *,
+  *:before,
+  *:after {
+    box-sizing: border-box;
+  }
+
+}
+
+.dante-paste{
+  display:none;
+}

data/app/styles/dante/_tooltip.scss

@@ -0,0 +1,130 @@
+.inlineTooltip {
+
+  // BASE
+  position: absolute;
+  z-index: 900;
+  width: $tooltip-size;
+  height: $tooltip-size;
+  -webkit-transition: opacity 100ms, width 0 linear 250ms;
+  transition: opacity 100ms, width 0 linear 250ms;
+  padding: 0;
+  font-size: 0;
+
+  opacity: 0;
+  pointer-events: none;
+
+  &.is-active {
+    opacity: 1;
+    pointer-events: auto;
+  }
+  &.is-scaled {
+    -webkit-transition-delay: 0;
+    transition-delay: 0;
+    width: auto;
+  }
+}
+
+// MENU
+.inlineTooltip-menu {
+  display: inline-block;
+  margin-left: $tooltip-size + $tooltip-menu-spacing;
+}
+
+// BUTTON
+.inlineTooltip-button {
+
+  // BASE
+  & {
+    background-color: white;
+    float: left;
+    margin-right: $tooltip-button-spacing;
+    display: inline-block;
+    position: relative;
+    outline: 0;
+    padding: 0;
+    vertical-align: bottom;
+    box-sizing: border-box;
+    border-radius: $tooltip-border-radius;
+    cursor: pointer;
+    font-size: 14px;
+    text-decoration: none;
+    font-family: $dante-font-family-sans;
+    letter-spacing: -0.02em;
+    font-weight: 400;
+    font-style: normal;
+    white-space: nowrap;
+    text-rendering: auto;
+    text-align: center;
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    -moz-font-feature-settings: "liga" on;
+    width: $tooltip-size;
+    height: $tooltip-size;
+    line-height: $tooltip-line-height;
+    -webkit-transition: 100ms border-color, 100ms color;
+    transition: 100ms border-color, 100ms color;
+    //background: rgba($tooltip-color, $tooltip-background-opacity);
+    border: $tooltip-border-width solid;
+    border-color: rgba($tooltip-color, $tooltip-color-opacity);
+    color: rgba($tooltip-color, $tooltip-color-opacity);
+  }
+
+  &:hover {
+    border-color: rgba($tooltip-color, $tooltip-color-opacity-hover);
+    color: rgba($tooltip-color, $tooltip-color-opacity-hover);
+  }
+
+  // SCALE
+  &.scale {
+    & {
+       -webkit-transform: scale(0);
+           -ms-transform: scale(0);
+               transform: scale(0);
+      -webkit-transition: -webkit-#{$tooltip-forward-transition}, $tooltip-default-transition;
+              transition: $tooltip-forward-transition, $tooltip-default-transition;
+    }
+    .is-scaled & {
+       -webkit-transform: scale(1);
+           -ms-transform: scale(1);
+               transform: scale(1);
+      -webkit-transition: -webkit-#{$tooltip-backward-transition}, $tooltip-default-transition;
+              transition: $tooltip-backward-transition, $tooltip-default-transition;
+    }
+
+    @while $tooltip-items > 0 {
+      &:nth-child(#{$tooltip-items + 1}) {
+        -webkit-transition-delay: #{$tooltip-item-delay * $tooltip-items + "ms"};
+                transition-delay: #{$tooltip-item-delay * $tooltip-items + "ms"};
+      }
+      $tooltip-items: $tooltip-items - 1;
+    }
+  }
+
+  // CONTROL
+  &.control {
+    & {
+      display: block;
+      position: absolute;
+      margin-right: $tooltip-menu-spacing;
+    }
+    & {
+      -webkit-transition: -webkit-#{$tooltip-forward-transition}, $tooltip-default-transition;
+              transition: $tooltip-forward-transition, $tooltip-default-transition;
+       -webkit-transform: rotate(0);
+           -ms-transform: rotate(0);
+               transform: rotate(0);
+    }
+    .is-scaled & {
+      -webkit-transition: -webkit-#{$tooltip-backward-transition}, $tooltip-default-transition;
+              transition: $tooltip-backward-transition, $tooltip-default-transition;
+       -webkit-transform: rotate(45deg);
+           -ms-transform: rotate(45deg);
+               transform: rotate(45deg);
+            border-color: rgba($tooltip-color, $tooltip-color-opacity-hover);
+                   color: rgba($tooltip-color, $tooltip-color-opacity-hover);
+    }
+  }
+
+}
+

data/app/styles/dante/_utilities.scss

@@ -0,0 +1,59 @@
+@mixin clearfix {
+  &:before, &:after {
+    content: " ";
+    display: table;
+  }
+  &:after {
+    clear: both;
+  }
+
+  *zoom: 1;
+}
+
+
+@mixin box-sizing {
+  *,
+  *:before,
+  *:after {
+    box-sizing: border-box;
+  }
+}
+
+
+
+@keyframes spinner {
+    to {transform: rotate(360deg);}
+}
+
+@-webkit-keyframes spinner {
+    to {-webkit-transform: rotate(360deg);}
+}
+
+.dante--spinner {
+  min-width: 24px;
+  min-height: 24px;
+}
+
+.dante--spinner:before {
+  content: 'Loading…';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 16px;
+  height: 16px;
+  margin-top: -10px;
+  margin-left: -10px;
+}
+
+.dante--spinner:not(:required):before {
+  content: '';
+  border-radius: 50%;
+  border: 2px solid rgba(0, 0, 0, .3);
+  border-top-color: rgba(0, 0, 0, .6);
+  animation: spinner .6s linear infinite;
+  -webkit-animation: spinner .6s linear infinite;
+}
+
+.hidden {
+  display: none !important;
+}

data/app/styles/dante/_variables.scss

@@ -0,0 +1,96 @@
+// NEW VARIABLES
+
+// General
+
+$dante-font-family-sans-serif: 'comic-sans';
+
+$dante-visual-debugger:        false !default;
+
+$dante-text-color:             #000000 !default;
+$dante-inversed-color:         #FFFFFF !default;
+$dante-accent-color:           #5BD974 !default;
+$dante-control-color:          #333333 !default;
+$dante-popover-color:          #FFFFFF !default;
+
+// Editor
+$dante-editor-font-size:       18px !default;
+$dante-editor-line-height:     1.9 !default;
+
+// Menu
+$dante-menu-height:            42px !default;
+$dante-menu-background:        $dante-control-color !default;
+$dante-menu-color:             $dante-inversed-color !default;
+
+$dante-menu-border-radius:     5px !default;
+$dante-menu-box-shadow:        1px 2px 3px -2px #222 !default;
+
+$dante-menu-icon-size:         16px !default;
+$dante-menu-icon-color:        $dante-inversed-color !default;
+$dante-menu-icon-accent:       $dante-accent-color !default;
+
+$dante-menu-border-width:      0px !default;
+$dante-menu-border-color:      none !default;
+
+$dante-menu-caret-size:        8px !default;
+
+
+// Tooltip
+
+// Popover
+
+
+
+// OLD VARIABLES
+
+$dante-font-family-sans:              'jaf-bernino-sans', 'Open Sans', "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+$dante-font-family-serif:             'freight-text-pro', 'Merriweather', Georgia,Cambria, "Times New Roman", Times,serif;
+$dante-font-family-mono:              Menlo, Monaco, Consolas, "Courier New", "Courier", monospace;
+
+$dante-font-family-base:              $dante-font-family-sans;
+$dante-font-size-base:                14px;
+$line-height-base:              1.428571429; // 20/14
+
+/* DEPRECATED */ $active-color: $dante-accent-color;
+
+/* DEPRECATED */ $menu-tone: $dante-menu-background;
+/* DEPRECATED */ $menu-factor: 5%;
+/* DEPRECATED */ $menu-background: $dante-menu-background;
+/* DEPRECATED */ $menu-shadow: $dante-menu-box-shadow;
+/* DEPRECATED */ $menu-border-width: $dante-menu-border-width;
+/* DEPRECATED */ $menu-border-color: $dante-menu-border-color;
+/* DEPRECATED */ $menu-border-radius: $dante-menu-border-radius;
+
+/* DEPRECATED */ $menu-border:                   $menu-border-width solid $menu-border-color;
+/* DEPRECATED */ $menu-color:                    $dante-menu-icon-color;
+/* DEPRECATED */ $menu-color-active:             $dante-menu-icon-accent;
+
+/* DEPRECATED */ $menu-caret-size:               $dante-menu-caret-size;
+/* DEPRECATED */ $menu-caret-color:              darken($menu-tone,$menu-factor);
+
+
+
+/* DEPRECATED */ $menu-height: $dante-menu-height;
+$menu-button-height:            $menu-height - ($menu-border-width * 2);
+
+$tooltip-color:                 black;
+$tooltip-color-opacity:         0.44;
+$tooltip-color-opacity-hover:   0.9;
+$tooltip-background-opacity:    0;
+$tooltip-border-width:          1px;
+$tooltip-border-radius:         999em;
+
+$tooltip-button-spacing:        9px;
+$tooltip-menu-spacing:          22px;
+
+$tooltip-items:                 10; // Fix this and remove it
+$tooltip-item-delay:            30;
+$tooltip-size:                  32px;
+$tooltip-line-height:           $tooltip-size;
+
+$tooltip-caret-size:            12px;
+
+$tooltip-default-transition:    100ms border-color, 100ms color;
+$tooltip-forward-transition:    transform 100ms;
+$tooltip-backward-transition:   transform 250ms;
+
+/* DEPRECATED */ $debugger: $dante-visual-debugger;

data/app/styles/dante/blame.scss

@@ -0,0 +1,246 @@
+div[contenteditable="false"] {
+  a.markup--anchor {
+    cursor: pointer;
+  }
+}
+
+figure figcaption .public-DraftStyleDefault-block {
+    text-align: center;
+}
+
+.aspectRatioPlaceholder {
+  .image-upoader-loader{
+    position: absolute;
+    bottom: 0px;
+    left: 0%;
+    background-color: #fff;
+    width: 100%;
+    /* height: 3px; */
+    text-align: center;
+    top: 0px;
+    vertical-align: text-bottom;
+    opacity: 0.7;
+    p{
+      line-height: 5px;
+      /* font-weight: 700; */
+      /* text-transform: uppercase; */
+      font-size: 14px;
+      margin-top: 49%;
+    }
+  }
+}
+
+a[rel=token], .markup--query {
+    color: #00ab6b;
+    text-decoration: none;
+    background-image: none!important;
+}
+
+
+.typeahead--mention {
+    padding-top: 10px;
+}
+.typeahead .popover-inner {
+    padding: 0;
+    overflow: hidden;
+    min-width: 100px;
+}
+
+.typeahead .typeahead-item:first-child {
+  padding-top: 7px;
+}
+
+.typeahead--mention .typeahead-item {
+  padding: 6px 15px;
+  font-size: 13px;
+}
+
+.typeahead-item.is-active, .typeahead-item:hover  {
+  background: #02b875;
+  color: #fff;
+}
+.typeahead .typeahead-item {
+  cursor: pointer;
+  padding: 5px 10px;
+  line-height: 2;
+  font-size: 12px;
+  text-align: left;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.typeahead .dante-avatar {
+  //float: left;
+  margin: 0 6px 0 -2px;
+}
+
+.avatar-image--icon {
+  width: 32px;
+  height: 32px;
+}
+.avatar-image {
+  display: inline-block;
+  vertical-align: middle;
+  border-radius: 100%;
+}
+
+.typeahead-item .avatar-image {
+  width: 32px;
+  height: 32px;
+}
+
+.typeahead--mention .popover-arrow {
+    display: none;
+}
+
+.markup--user {
+  color: #00ab6b;
+  text-decoration: none;
+}
+
+
+
+//popover card styles
+
+.popover--card {
+  .popover-arrow{
+    top: -14px;
+  }
+
+  .popover--bottom .popover-arrow:after {
+      transform: rotate(45deg) translate(6px,6px);
+      box-shadow: -1px -1px 1px -1px rgba(0,0,0,.44);
+  }
+
+  .popover-arrow:after {
+      content: '';
+      display: block;
+      width: 14px;
+      height: 14px;
+      background: #fff;
+  }
+}
+
+.popover--animated.is-active {
+  visibility: visible;
+  opacity: 1;
+  transition: visibility 0s linear 0s,opacity .2s 0s;
+}
+
+.popover.is-active {
+  visibility: visible;
+}
+
+.popover--animated {
+  visibility: hidden;
+  opacity: 0;
+  transition: visibility 0s linear .2s,opacity .2s 0s;
+}
+
+.popoverCard {
+  text-align: left;
+}
+
+.popoverCard-meta {
+  width: 192px;
+}
+.u-floatLeft {
+  float: left!important;
+}
+
+.u-floatRight {
+  float: right!important;
+}
+
+.popoverCard-title {
+  font-size: 18px;
+  margin-bottom: 5px;
+  margin-top: 0px;
+}
+
+.link {
+  color: inherit;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.popoverCard-description {
+  overflow: hidden;
+  color: rgba(0,0,0,.44);
+}
+
+.u-clearfix:after {
+    clear: both;
+}
+.u-clearfix:after, .u-clearfix:before {
+    display: table;
+    content: " ";
+}
+
+.dante-avatar {
+  display: block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  line-height: normal;
+}
+
+.avatar-image--small {
+  width: 60px;
+  height: 60px;
+}
+.avatar-image {
+  display: inline-block;
+  vertical-align: middle;
+  border-radius: 100%;
+}
+
+.popoverCard-actions {
+  border-top: solid 1px rgba(0,0,0,.15);
+  margin-top: 10px;
+  padding-top: 10px;
+}
+
+.popoverCard-stats {
+  font-size: 14px;
+  line-height: 36px;
+}
+
+.popoverCard-stat {
+  margin-right: 10px;
+  color: rgba(0,0,0,.44);
+}
+
+.popoverCard-count {
+  padding-left: 5px;
+  color: rgba(0,0,0,.6);
+}
+
+// popover-align
+
+
+
+
+// uploader tooltip
+
+.graf--layoutOutsetLeft {
+    margin-left: -160px;
+}
+
+.graf--layoutFillWidth {
+    margin-left: -200px;
+    margin-right: -200px;
+}
+
+.graf--layoutOutsetLeft {
+    width: 75%;
+}
+.graf--layoutInsetLeft, .graf--layoutOutsetLeft {
+    float: left;
+    margin-right: 30px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+}
+
+// .graf--layoutOutsetLeft