diff options
author | Douwe Maan <douwe@gitlab.com> | 2018-02-02 22:26:14 +0300 |
---|---|---|
committer | Douwe Maan <douwe@gitlab.com> | 2018-02-02 22:26:14 +0300 |
commit | 974bb446bf834bcf3ead9b69b0809e62b28a1bc9 (patch) | |
tree | 898d1fa54e02cc870464f79c94e70a43a1714784 /app/assets | |
parent | ee600a84d29d1ecbfdb3e9cb1a55c610ed65ab10 (diff) | |
parent | 57f8b24fe2d54df4dfcc3ddcb5796e41093f0fd7 (diff) |
Merge branch '24167__color_label' into 'master'
Add Colors to GitLab Flavored Markdown
Closes #24167
See merge request gitlab-org/gitlab-ce!16095
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/gfm_auto_complete.js | 2 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/gfm.scss | 28 |
2 files changed, 29 insertions, 1 deletions
diff --git a/app/assets/javascripts/gfm_auto_complete.js b/app/assets/javascripts/gfm_auto_complete.js index df20e1e9c88..57a1fa107e5 100644 --- a/app/assets/javascripts/gfm_auto_complete.js +++ b/app/assets/javascripts/gfm_auto_complete.js @@ -461,7 +461,7 @@ class GfmAutoComplete { const accentAChar = decodeURI('%C3%80'); const accentYChar = decodeURI('%C3%BF'); - const regexp = new RegExp(`^(?:\\B|[^a-zA-Z0-9_${atSymbolsWithoutBar}]|\\s)${resultantFlag}(?!${atSymbolsWithBar})((?:[A-Za-z${accentAChar}-${accentYChar}0-9_'.+-]|[^\\x00-\\x7a])*)$`, 'gi'); + const regexp = new RegExp(`^(?:\\B|[^a-zA-Z0-9_\`${atSymbolsWithoutBar}]|\\s)${resultantFlag}(?!${atSymbolsWithBar})((?:[A-Za-z${accentAChar}-${accentYChar}0-9_'.+-]|[^\\x00-\\x7a])*)$`, 'gi'); return regexp.exec(targetSubtext); } diff --git a/app/assets/stylesheets/framework/gfm.scss b/app/assets/stylesheets/framework/gfm.scss index 5621505996d..e378e84ca1b 100644 --- a/app/assets/stylesheets/framework/gfm.scss +++ b/app/assets/stylesheets/framework/gfm.scss @@ -16,3 +16,31 @@ background-color: $user-mention-bg-hover; } } + +.gfm-color_chip { + display: inline-block; + margin: 0 0 2px 4px; + vertical-align: middle; + border-radius: 3px; + + $chip-size: 0.9em; + $bg-size: $chip-size / 0.9; + $bg-pos: $bg-size / 2; + + width: $chip-size; + height: $chip-size; + background: $white-light; + background-image: linear-gradient(135deg, $gray-dark 25%, transparent 0%, transparent 75%, $gray-dark 0%), + linear-gradient(135deg, $gray-dark 25%, transparent 0%, transparent 75%, $gray-dark 0%); + background-size: $bg-size $bg-size; + background-position: 0 0, $bg-pos $bg-pos; + + > span { + display: inline-block; + width: 100%; + height: 100%; + margin-bottom: 2px; + border-radius: 3px; + border: 1px solid $black-transparent; + } +} |