diff --git a/static/css/hover.css b/assets/css/_common/scaffolding/animation/hover.scss similarity index 100% rename from static/css/hover.css rename to assets/css/_common/scaffolding/animation/hover.scss diff --git a/assets/css/_common/scaffolding/animation/index.scss b/assets/css/_common/scaffolding/animation/index.scss new file mode 100644 index 0000000..ab096bc --- /dev/null +++ b/assets/css/_common/scaffolding/animation/index.scss @@ -0,0 +1,2 @@ +@import 'show'; +@import 'hover'; \ No newline at end of file diff --git a/assets/css/_common/scaffolding/animation/show.scss b/assets/css/_common/scaffolding/animation/show.scss new file mode 100644 index 0000000..4c0fd6b --- /dev/null +++ b/assets/css/_common/scaffolding/animation/show.scss @@ -0,0 +1,65 @@ +// tabshow animation +@-moz-keyframes tabshow { + 0% { + -webkit-transform: translateY(15px); + -moz-transform: translateY(15px); + -o-transform: translateY(15px); + -ms-transform: translateY(15px); + transform: translateY(15px); + } + 100% { + -webkit-transform: translateY(0); + -moz-transform: translateY(0); + -o-transform: translateY(0); + -ms-transform: translateY(0); + transform: translateY(0); + } +} +@-webkit-keyframes tabshow { + 0% { + -webkit-transform: translateY(15px); + -moz-transform: translateY(15px); + -o-transform: translateY(15px); + -ms-transform: translateY(15px); + transform: translateY(15px); + } + 100% { + -webkit-transform: translateY(0); + -moz-transform: translateY(0); + -o-transform: translateY(0); + -ms-transform: translateY(0); + transform: translateY(0); + } +} +@-o-keyframes tabshow { + 0% { + -webkit-transform: translateY(15px); + -moz-transform: translateY(15px); + -o-transform: translateY(15px); + -ms-transform: translateY(15px); + transform: translateY(15px); + } + 100% { + -webkit-transform: translateY(0); + -moz-transform: translateY(0); + -o-transform: translateY(0); + -ms-transform: translateY(0); + transform: translateY(0); + } +} +@keyframes tabshow { + 0% { + -webkit-transform: translateY(15px); + -moz-transform: translateY(15px); + -o-transform: translateY(15px); + -ms-transform: translateY(15px); + transform: translateY(15px); + } + 100% { + -webkit-transform: translateY(0); + -moz-transform: translateY(0); + -o-transform: translateY(0); + -ms-transform: translateY(0); + transform: translateY(0); + } +} \ No newline at end of file diff --git a/assets/css/_common/scaffolding/index.scss b/assets/css/_common/scaffolding/index.scss index 5cd24ed..2fb5cb7 100644 --- a/assets/css/_common/scaffolding/index.scss +++ b/assets/css/_common/scaffolding/index.scss @@ -11,3 +11,4 @@ @import 'pagination'; @import 'comments'; @import 'fontawesome'; +@import 'animation'; diff --git a/assets/js/utils.js b/assets/js/utils.js index abc0f0d..b71651e 100644 --- a/assets/js/utils.js +++ b/assets/js/utils.js @@ -258,12 +258,11 @@ NexT.utils = { const comms = document.querySelectorAll('.comment-wrap > div'); button.addEventListener('click', () => { button.classList.toggle('move'); - comms.forEach(function(item){ - item.style.display = item.style.display === 'none' ? 'block' : 'none'; - if (item.style.display === 'block') { - item.style.animation = "0.8s ease 0s 1 normal none running tabshow"; + comms.forEach(function(item){ + if (item.style.display === 'none') { + item.style.cssText = "display: block; animation: tabshow .8s"; } else { - item.style.removeProperty('animation'); + item.style.cssText = "display: none;" } }); }); diff --git a/layouts/partials/head/style.html b/layouts/partials/head/style.html index 7b54c39..f2f8889 100644 --- a/layouts/partials/head/style.html +++ b/layouts/partials/head/style.html @@ -22,7 +22,6 @@ {{- $scss = $scss | resources.ExecuteAsTemplate "main.scss" . }} {{- $css := $scss | toCSS (dict "targetPath" "/css/main.css" "outputStyle" "expanded") }} - {{- if .IsPage }}