Info
Dimensions
+Templating
++
diff --git a/public/sass/base/_type.scss b/public/sass/base/_type.scss index f165d40e2eb..7dd6c2f94e7 100644 --- a/public/sass/base/_type.scss +++ b/public/sass/base/_type.scss @@ -290,3 +290,46 @@ a.external-link { .pointer { cursor: pointer; } + +.markdown-html { + img { + max-width: 100%; + } + + ul { + padding-left: $spacer*1.5; + margin-bottom: $spacer; + } + + table { + td, th { + padding: $spacer*.5 $spacer; + } + th { + font-weight: normal; + background: $table-bg-accent; + } + } + + table, th, td { + border: 1px solid $table-border; + border-collapse: collapse; + } + + a { + text-decoration: underline; + color: $external-link-color; + &:hover { + color: lighten($external-link-color, 10%); + } + } + + p:last-child { + margin-bottom: 0; + } + + ul:last-child { + margin-bottom: 0; + } +} + diff --git a/public/sass/components/_alerts.scss b/public/sass/components/_alerts.scss index 4434fa680f0..859e3b88f8c 100644 --- a/public/sass/components/_alerts.scss +++ b/public/sass/components/_alerts.scss @@ -6,8 +6,6 @@ // Base styles // ------------------------- - - .alert { padding: 0.5rem 2rem 0.5rem 1rem; margin-bottom: $line-height-base; @@ -30,9 +28,11 @@ .alert-error { background-color: $errorBackground; } + .alert-info { background-color: $infoBackground; } + .alert-warning { background-color: $state-warning-bg; } diff --git a/public/sass/components/_drop.scss b/public/sass/components/_drop.scss index 570c1862ef0..6f3aff23cef 100644 --- a/public/sass/components/_drop.scss +++ b/public/sass/components/_drop.scss @@ -15,7 +15,6 @@ $easing: cubic-bezier(0, 0, 0.265, 1.00); &.drop-open { display: block; } - } .drop-element, .drop-element * { @@ -30,8 +29,11 @@ $easing: cubic-bezier(0, 0, 0.265, 1.00); } .drop-help { - ul { - padding-left: $spacer; + a { + color: $white; + &:hover { + color: darken($white, 10%); + } } } @@ -41,9 +43,12 @@ $easing: cubic-bezier(0, 0, 0.265, 1.00); display: none; } } + @include drop-theme("help", $popover-help-bg, $popover-help-color); +@include drop-theme("error", $errorBackground, $popover-color); @include drop-theme("popover", $popover-bg, $popover-color); @include drop-animation-scale("drop", "help", $attachmentOffset: $attachmentOffset, $easing: $easing); +@include drop-animation-scale("drop", "error", $attachmentOffset: $attachmentOffset, $easing: $easing); @include drop-animation-scale("drop", "popover", $attachmentOffset: $attachmentOffset, $easing: $easing); diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index 42498c47ac3..004ab86fb76 100644 --- a/public/sass/components/_gf-form.scss +++ b/public/sass/components/_gf-form.scss @@ -244,6 +244,11 @@ $gf-form-margin: 0.25rem; padding-left: $spacer; color: $text-color-weak; + &--bold { + color: $text-color-emphasis; + padding-left: 0; + } + &--right-absolute { position: absolute; right: $spacer; diff --git a/public/sass/components/_panel_text.scss b/public/sass/components/_panel_text.scss index 6e0301cecc5..8b137891791 100644 --- a/public/sass/components/_panel_text.scss +++ b/public/sass/components/_panel_text.scss @@ -1,8 +1 @@ -.panel-text-content { - ul { - margin: 0 0 $spacer $spacer * 1.5; - } - li {line-height: 2;} - a { color: $external-link-color; } -} diff --git a/public/sass/components/_view_states.scss b/public/sass/components/_view_states.scss index edbff235cd4..a1ed89f9888 100644 --- a/public/sass/components/_view_states.scss +++ b/public/sass/components/_view_states.scss @@ -29,6 +29,8 @@ .dashnav-refresh-action, .dashnav-zoom-out, .dashnav-action-icons, + .panel-info-corner--info, + .panel-info-corner--links, .dashnav-move-timeframe { opacity: 0; transition: all 1.5s ease-in-out 1s; diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss index 11933e0d76b..24dc6f1a238 100644 --- a/public/sass/pages/_dashboard.scss +++ b/public/sass/pages/_dashboard.scss @@ -73,6 +73,11 @@ div.flot-text { display: none; } +.panel-help-text { + margin-left: 10px; + display: none; +} + .panel-loading { position:absolute; top: -3px; @@ -84,26 +89,59 @@ div.flot-text { text-align: center; } -.panel-error { - color: $white; +.panel-info-corner { + color: $text-color; + cursor: pointer; position: absolute; + display: none; left: 0; - padding: 0px 17px 6px 5px; + width: 27px; + height: 27px; top: 0; z-index: 10; - i { + + .fa { position: relative; top: -2px; + left: -5px; + font-size: 90%; + } + + &--info { + display: block; + background: $blue-dark; + .fa:before { + content: "\f129"; + } + } + + &--links { + display: block; + background: $blue-dark; + .fa { + left: -3px; + } + .fa:before { + content: "\f08e"; + } + } + + &--error { + display: block; + background: $errorBackground !important; + .fa:before { + content: "\f12a"; + } } } -.panel-error-arrow { +.panel-info-corner-inner { width: 0; height: 0; position: absolute; - border-left: 31px solid transparent; - border-right: 30px solid transparent; - border-bottom: 27px solid $panel-bg; + border-left: 27px solid transparent; + border-right: 0px solid transparent; + border-bottom: 26px solid $panel-bg; left: 0; bottom: 0; } diff --git a/public/sass/pages/_plugins.scss b/public/sass/pages/_plugins.scss index ed4d39d316f..075a7f1649c 100644 --- a/public/sass/pages/_plugins.scss +++ b/public/sass/pages/_plugins.scss @@ -37,32 +37,6 @@ overflow: hidden; } -.plugin-markdown-readme { - img { - max-width: 100%; - } - - ul { - padding-left: $spacer*1.5; - margin-bottom: $spacer*2; - } - - table { - td, th { - padding: $spacer*.5 $spacer; - } - th { - font-weight: normal; - background: $table-bg-accent; - } - } - - table, th, td { - border: 1px solid $table-border; - border-collapse: collapse; - } -} - .get-more-plugins-link { color: $text-muted; font-size: $font-size-sm; diff --git a/public/test/test-main.js b/public/test/test-main.js index 4e77a7eae54..54fbc7d2910 100644 --- a/public/test/test-main.js +++ b/public/test/test-main.js @@ -12,6 +12,7 @@ paths: { 'mousetrap': 'vendor/npm/mousetrap/mousetrap.js', 'eventemitter3': 'vendor/npm/eventemitter3/index.js', + 'remarkable': 'vendor/npm/remarkable/dist/remarkable.js', 'tether': 'vendor/npm/tether/dist/js/tether.js', 'tether-drop': 'vendor/npm/tether-drop/dist/js/drop.js', 'moment': 'vendor/moment.js',