diff options
author | silverwind <me@silverwind.io> | 2021-11-16 09:16:05 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-11-16 16:16:05 +0800 |
commit | 23bd7b1211a80aa3b0dcb60ec4a1c0089ff28dd4 (patch) | |
tree | 38fafd772b6341daa87cb256ee10dfdcf5a87a48 /web_src/less/animations.less | |
parent | d789670894d09d7db96f4cd2dc3d57d2424eb753 (diff) | |
download | gitea-23bd7b1211a80aa3b0dcb60ec4a1c0089ff28dd4.tar.gz gitea-23bd7b1211a80aa3b0dcb60ec4a1c0089ff28dd4.zip |
Add copy button to markdown code blocks (#17638)
* Add copy button to markdown code blocks
Done mostly in JS because I think it's better not to try getting buttons
past the markup sanitizer.
* add svg module tests
* fix sanitizer regexp
* remove outdated comment
* vertically center button in issue comments as well
* add comment to css
* fix undefined on view file line copy
* combine animation less files
* Update modules/markup/markdown/markdown.go
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* add test for different sizes
* add cloneNode and add tests for it
* use deep clone
* remove useless optional chaining
* remove the svg node cache
* unify clipboard copy string and i18n
* remove unused var
* remove unused localization
* minor css tweaks to the button
* comment tweak
* remove useless attribute
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Diffstat (limited to 'web_src/less/animations.less')
-rw-r--r-- | web_src/less/animations.less | 52 |
1 files changed, 52 insertions, 0 deletions
diff --git a/web_src/less/animations.less b/web_src/less/animations.less new file mode 100644 index 0000000000..cdb10236fb --- /dev/null +++ b/web_src/less/animations.less @@ -0,0 +1,52 @@ +@keyframes isloadingspin { + 0% { transform: translate(-50%, -50%) rotate(0deg); } + 100% { transform: translate(-50%, -50%) rotate(360deg); } +} + +.is-loading { + background: transparent !important; + color: transparent !important; + border: transparent !important; + pointer-events: none !important; + position: relative !important; + overflow: hidden !important; +} + +.is-loading::after { + content: ""; + position: absolute; + display: block; + width: 4rem; + height: 4rem; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + animation: isloadingspin 500ms infinite linear; + border-width: 4px; + border-style: solid; + border-color: #ececec #ececec #666 #666; + border-radius: 100%; +} + +.markup pre.is-loading, +.editor-loading.is-loading { + height: 12rem; +} + +@keyframes fadein { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } +} + +@keyframes fadeout { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + } +} |