diff --git a/lib/gollum/assets.rb b/lib/gollum/assets.rb index c01ed0b8..cd09478e 100644 --- a/lib/gollum/assets.rb +++ b/lib/gollum/assets.rb @@ -18,6 +18,7 @@ module Precious self.class.class_variable_get(:@@base_url) end include ::Precious::Views::RouteHelpers + include ::Precious::Views::OcticonHelpers end env end diff --git a/lib/gollum/public/gollum/fonts/FontAwesome.otf b/lib/gollum/public/gollum/fonts/FontAwesome.otf deleted file mode 100644 index 8b0f54e4..00000000 Binary files a/lib/gollum/public/gollum/fonts/FontAwesome.otf and /dev/null differ diff --git a/lib/gollum/public/gollum/fonts/fontawesome-webfont.eot b/lib/gollum/public/gollum/fonts/fontawesome-webfont.eot deleted file mode 100755 index 7c79c6a6..00000000 Binary files a/lib/gollum/public/gollum/fonts/fontawesome-webfont.eot and /dev/null differ diff --git a/lib/gollum/public/gollum/fonts/fontawesome-webfont.svg b/lib/gollum/public/gollum/fonts/fontawesome-webfont.svg deleted file mode 100755 index 45fdf338..00000000 --- a/lib/gollum/public/gollum/fonts/fontawesome-webfont.svg +++ /dev/null @@ -1,414 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/lib/gollum/public/gollum/fonts/fontawesome-webfont.ttf b/lib/gollum/public/gollum/fonts/fontawesome-webfont.ttf deleted file mode 100755 index e89738de..00000000 Binary files a/lib/gollum/public/gollum/fonts/fontawesome-webfont.ttf and /dev/null differ diff --git a/lib/gollum/public/gollum/fonts/fontawesome-webfont.woff b/lib/gollum/public/gollum/fonts/fontawesome-webfont.woff deleted file mode 100755 index 8c1748aa..00000000 Binary files a/lib/gollum/public/gollum/fonts/fontawesome-webfont.woff and /dev/null differ diff --git a/lib/gollum/public/gollum/javascript/editor/gollum.editor.js.erb b/lib/gollum/public/gollum/javascript/editor/gollum.editor.js similarity index 100% rename from lib/gollum/public/gollum/javascript/editor/gollum.editor.js.erb rename to lib/gollum/public/gollum/javascript/editor/gollum.editor.js diff --git a/lib/gollum/public/gollum/javascript/gollum.dialog.js.erb b/lib/gollum/public/gollum/javascript/gollum.dialog.js similarity index 100% rename from lib/gollum/public/gollum/javascript/gollum.dialog.js.erb rename to lib/gollum/public/gollum/javascript/gollum.dialog.js diff --git a/lib/gollum/public/gollum/javascript/gollum.js.erb b/lib/gollum/public/gollum/javascript/gollum.js.erb index 645abdf0..4d49a5c3 100755 --- a/lib/gollum/public/gollum/javascript/gollum.js.erb +++ b/lib/gollum/public/gollum/javascript/gollum.js.erb @@ -459,10 +459,13 @@ $(document).ready(function() { url: routePath('last_commit_info'), data: {path: $("#page-info-toggle").data('pagepath')}, success: function ( data ) { + $("#last-edit").next(".dotted-spinner").toggleClass('hidden'); + $("#last-edit-in-progress").remove(); $("#last-edit").html('Last edited by ' + data.author + ', ' + data.date); } }); - $("#last-edit").html(' Getting commit info...'); + $("#last-edit").next(".dotted-spinner").toggleClass('hidden').after(' Getting commit info...'); + $("#page-info-toggle").toggle(); }) } @@ -482,7 +485,19 @@ $(document).ready(function() { $('span.critic.comment').filter(function() {return $(this).text()!="";}).before('‡'); } - $('.markdown-body p, .markdown-body span, .markdown-body pre, .markdown-body table').attr('dir','auto'); + if($('#wiki-content').length ){ + // Set text direction auto + $('.markdown-body p, .markdown-body span, .markdown-body pre, .markdown-body table').attr('dir','auto'); + + // Copy anchors for each editable header and give the new anchor the 'edit' class, to display an "edit section" link + $('a.anchor').each(function (index, anchor) { + header = $(anchor).closest(':header'); + if (header.hasClass('editable')){ + var newUrl = routePath('edit') + '/' + pageName() + $(anchor).attr('href'); + $(anchor).clone().addClass('edit').attr('href', newUrl).appendTo(header); + } + }); + } if( $('#wiki-history').length ){ var lookup = {}; diff --git a/lib/gollum/public/gollum/stylesheets/_spinners.scss b/lib/gollum/public/gollum/stylesheets/_spinners.scss new file mode 100755 index 00000000..9b1f8c31 --- /dev/null +++ b/lib/gollum/public/gollum/stylesheets/_spinners.scss @@ -0,0 +1,245 @@ +/* +================================================================================ +SPINNERS +================================================================================ +A Sass mixin to generate a pure CSS3 loading/busy indicator. +https://github.com/franzheidl/spinners +Franz Heidl 2014 +MIT License +-------------------------------------------------------------------------------- +USAGE + +Default: + +.my-spinner { + @include spinner(); +} + + +Custom: + +.my-spinner { + @include spinner(1.25em, 3px solid #555, .7s, background rgba(0, 0, 0, .2); +} + +All arguments are optional. + +Acceppts any valid CSS dimensional declaration, e.g px, em, rem as an argument for size. + +Use either shorthand border declarations or individual 'border-[property] [value]' (no colon!) pairs for the style. + +Pass any number of seconds referring to the duration of one full rotation for animation speed. + +-------------------------------------------------------------------------------- +*/ + + +@mixin spinner-keyframes { + @-webkit-keyframes spinner-animation { + 0% { + -webkit-transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(360deg); + } + } + @-moz-keyframes spinner-animation { + 0% { + -moz-transform: rotate(0deg); + } + 100% { + -moz-transform: rotate(360deg); + } + } + @-ms-keyframes spinner-animation { + 0% { + -ms-transform: rotate(0deg); + } + 100% { + -ms-transform: rotate(360deg); + } + } + @-o-keyframes spinner-animation { + 0% { + -o-transform: rotate(0deg); + } + 100% { + -o-transform: rotate(100deg); + } + } + @keyframes spinner-animation { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } + } +} + + + +@include spinner-keyframes(); + + + +@mixin spinner($args...) { + $prefixes: -webkit- -moz- -o- -ms- ""; + $dimensional-units: ('px', 'em', 'rem', '%', 'ex'); + $border-props: 'border-width' 'border-style' 'border-color'; + $border-styles: solid dotted dashed double; + $size: 1em; + $border-width: 3px; + $border-style: solid; + $border-color: #1277c2; + $border: $border-width $border-style $border-color; + $duration: .65s; + $background: transparent; // + + // Parse arguments: + @if $args { + @each $arg in $args { + @if length($arg) == 1 { + @if type-of($arg) == number { + @if unit($arg) != "" { + @if unit($arg) == 's' { + $duration: $arg; + } + @else if isIn($dimensional-units, unit($arg)) { + $size: $arg; + } + @else { + @warn "Spinner: \"#{$arg}\" is not a valid size or duration declaration!"; + } + } + @else { + @warn "Spinner: \"#{$arg}\" is not a valid size or duration declaration!"; + } + } + } + @else if length($arg) == 2 { + $prop: nth($arg, 1); + $val: nth($arg, 2); + @if isIn($border-props, $prop) { + @if $prop == 'border-width' { + @if unit($val) == 'px' { + $border-width: $val; + } + @else { + @warn "Spinner: \"#{unit($val)}\" is not a valid border-width! Using default border-width."; + } + } + @else if $prop == 'border-style' { + @if isIn($border-styles, $val) { + $border-style: $val; + } + @else { + @warn "Spinner: \"#{$val}\" is not a valid border-style! Using default border-style."; + } + } + @else if $prop == 'border-color' { + @if type-of($val) == color { + $border-color: $val; + } + @else { + @warn "Spinner: \"#{$val}\" is not a valid border-color! Using default border-color."; + } + } + } + @else if $prop == 'background' { + @if type-of($val) == color { + $background: $val; + } + @else { + @warn "Spinner: \"#{nth($val)}\" is not a valid color for background! Using default \"transparent\"."; + } + } + @else { + @warn "Spinner: \"#{nth($arg, 1)}\" is not a valid border property! Using default border."; + } + $border: $border-width $border-style $border-color; + } + @else if length($arg) == 3 { + @if isValidBorder($arg) { + $border: $arg; + } + @else { + @warn "Spinner: \"#{$arg}\" is not a valid shorthand border declaration! Using default border."; + } + } + } + } + + + + background-color: transparent; + border: $border; + border-radius: 50%; + border-top-color: $background; + border-right-color: $background; + width: $size; + height: $size; + display: inline-block; + vertical-align: middle; + @each $prefix in $prefixes { + #{$prefix}box-sizing: border-box; + } + @each $prefix in $prefixes { + #{$prefix}animation: spinner-animation $duration infinite linear; + } +} + + + +@function isValidBorder($border) { + $validBorderTypes: color string number; + $borderStyles: solid dotted dashed double; + $validBorder: false; + $types: (); + + @if length($border) == length($validBorderTypes) { + @each $val in $border { + @if type-of($val) == number { + @if unit($val) == "" { + @return false; + } + } + @else if type-of($val) == string { + @if not isIn($borderStyles, $val) { + @return false; + } + } + $types: append($types, type-of($val)); + } + $validBorder: hasIdenticalValues($validBorderTypes, $types); + } + + @return $validBorder; +} + + + +@function hasIdenticalValues($arr1, $arr2) { + $id: false; + @each $val in $arr1 { + @if isIn($arr2, $val) { + $id: true; + } + @else { + @return false; + } + } + @return $id; +} + + + +@function isIn($arr1, $val) { + $hasVal: false; + @each $item in $arr1 { + @if $item == $val { + $hasVal: true; + } + } + @return $hasVal; +} diff --git a/lib/gollum/public/gollum/stylesheets/app.scss b/lib/gollum/public/gollum/stylesheets/app.scss index 8942c8d9..6a128f05 100644 --- a/lib/gollum/public/gollum/stylesheets/app.scss +++ b/lib/gollum/public/gollum/stylesheets/app.scss @@ -4,4 +4,5 @@ //= require criticmarkup //= require tables //= require emoji -//= require template \ No newline at end of file +//= require template +//= require spinner \ No newline at end of file diff --git a/lib/gollum/public/gollum/stylesheets/editor.scss b/lib/gollum/public/gollum/stylesheets/editor.scss index a3591ece..42a8ed59 100644 --- a/lib/gollum/public/gollum/stylesheets/editor.scss +++ b/lib/gollum/public/gollum/stylesheets/editor.scss @@ -264,11 +264,6 @@ a#function-search { @include editor-button(16); } #gollum-editor-body-ace { & + div { display: none; - font-size: 1.5em; - - > i { - font-size: 1em; - } } &.dragging { @@ -276,7 +271,7 @@ a#function-search { @include editor-button(16); } } &.uploading { - opacity: 0.5; + opacity: 1; & + div { display: block; diff --git a/lib/gollum/public/gollum/stylesheets/spinner.scss b/lib/gollum/public/gollum/stylesheets/spinner.scss new file mode 100644 index 00000000..ed486416 --- /dev/null +++ b/lib/gollum/public/gollum/stylesheets/spinner.scss @@ -0,0 +1,9 @@ +@import "_spinners"; + +.dotted-spinner { + @include spinner(1.4em, border-style dotted); + vertical-align: top; + &.hidden { + display: none; + } +} \ No newline at end of file diff --git a/lib/gollum/public/gollum/stylesheets/template.scss b/lib/gollum/public/gollum/stylesheets/template.scss.erb similarity index 79% rename from lib/gollum/public/gollum/stylesheets/template.scss rename to lib/gollum/public/gollum/stylesheets/template.scss.erb index 60bd29e8..f399f4ef 100644 --- a/lib/gollum/public/gollum/stylesheets/template.scss +++ b/lib/gollum/public/gollum/stylesheets/template.scss.erb @@ -2,72 +2,6 @@ @import "_base", "_breakpoint", "_features"; -/*! - * Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome - * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) - */ -@font-face { - font-family: 'FontAwesome'; - src: asset-url('fontawesome-webfont.eot?v=4.0.3'); - src: asset-url('fontawesome-webfont.eot?#iefix&v=4.0.3') format('embedded-opentype'), asset-url('fontawesome-webfont.woff?v=4.0.3') format('woff'), asset-url('fontawesome-webfont.ttf?v=4.0.3') format('truetype'), asset-url('fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg'); - font-weight: normal; - font-style: normal; -} - -.fa { - display: inline-block; - font: normal normal 16px FontAwesome; - line-height: 1; - text-decoration: none; - @include font-smoothing(on); -} - -.fa-link:before { - content: "\f0c1"; -} - -.fa-spinner:before { - content: "\f110"; -} - -.fa-spin { - @include generic-animation(spin 2s infinite linear); -} -@-moz-keyframes spin { - 0% { - -moz-transform: rotate(0deg); - } - 100% { - -moz-transform: rotate(359deg); - } -} -@-webkit-keyframes spin { - 0% { - -webkit-transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(359deg); - } -} -@-o-keyframes spin { - 0% { - -o-transform: rotate(0deg); - } - 100% { - -o-transform: rotate(359deg); - } -} -@keyframes spin { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(359deg); - transform: rotate(359deg); - } -} - /* margin & padding reset*/ * { @include reset-box-leave-border; @@ -144,28 +78,40 @@ a { line-height: 1.7; overflow: hidden; word-wrap: break-word; - + + .anchor { + display: inline-block; + position: absolute; + opacity: 0; + background: url('data:image/svg+xml;utf8,<%= rocticon_css(:link) %>') no-repeat; + background-size: 0.6em 1.35em; + padding-right: 0.5em; + padding-top: 0.4em; + margin-left: -0.8em; + width: 1em; + height: 1em; + text-decoration: none; + transition-property: opacity; + transition: 0.1s; + transition-delay: 0.5s; + } + + *:hover > .anchor, .anchor:focus{ + opacity: 1; + } + + .anchor.edit { + margin-left: 2em !important; + margin-top: 0.5em; + height: 0.5em; + background: url('data:image/svg+xml;utf8,<%= rocticon_css(:pencil) %>') no-repeat; + } + a { &.absent { color: $red; } - &.anchor { - display: block; - padding-right: 6px; - padding-left: 30px; - margin-left: -30px; - cursor: pointer; - position: absolute; - top: 0; - left: 0; - bottom: 0; - - &:focus { - outline: none; - } - } - &[id].wiki-toc-anchor { color: inherit; text-decoration: none; @@ -188,32 +134,6 @@ a { } h1, h2, h3, h4, h5, h6 { - margin: 1em 0 15px; - padding: 0; - font-weight: bold; - line-height: 1.7; - cursor: text; - position: relative; - text-rendering: optimizeLegibility; - @include font-smoothing(on); - - .fa-link { - display: none; - text-decoration: none; - color: #000; - } - - &:hover { - a.anchor .fa-link { - text-decoration: none; - line-height: 1; - padding-left: 8px; - margin-left: -30px; - top: 15%; - display: inline-block; - } - } - tt, code { font-size: inherit; } @@ -224,9 +144,7 @@ a { } h1 { - font-size: 2.5em; border-bottom: $border-standard; - color: #000; margin-top: 20px; margin-bottom: 10px; @@ -236,9 +154,7 @@ a { } h2 { - font-size: 2em; border-bottom: 1px solid #eee; - color: #000; } h3 { diff --git a/lib/gollum/templates/editor.mustache b/lib/gollum/templates/editor.mustache index cd784114..57e021a9 100644 --- a/lib/gollum/templates/editor.mustache +++ b/lib/gollum/templates/editor.mustache @@ -99,9 +99,8 @@ -
- - Uploading file ... +
+

Uploading file...

{{#header}} diff --git a/lib/gollum/templates/wiki_content.mustache b/lib/gollum/templates/wiki_content.mustache index d091d13b..31e42d14 100644 --- a/lib/gollum/templates/wiki_content.mustache +++ b/lib/gollum/templates/wiki_content.mustache @@ -44,7 +44,7 @@