Separate backtotop css (#523)

Author: jarrodmillman

assets/theme-css/backtotop.css

@@ -0,0 +1,52 @@
+#backtotop {
+  position: fixed;
+  right: 0;
+  opacity: 0;
+  visibility: hidden;
+  bottom: 25px;
+  margin: 0 25px 0 0;
+  z-index: 9999;
+  transition: 0.35s;
+  transform: scale(0.7);
+  transition: all 0.5s;
+}
+#backtotop.visible {
+  opacity: 1;
+  visibility: visible;
+  transform: scale(1);
+}
+#backtotop.visible a:hover {
+  outline: none;
+  opacity: 0.9;
+  background: #f39200;
+}
+#backtotop a {
+  outline: none;
+  text-decoration: none;
+  border: 0;
+  display: block;
+  width: 46px;
+  height: 46px;
+  background-color: #66676b;
+  opacity: 1;
+  transition: all 0.3s;
+  border-radius: 50%;
+  text-align: center;
+  font-size: 26px;
+}
+body #backtotop a {
+  outline: none;
+  color: #fff;
+}
+#backtotop a:after {
+  outline: none;
+  content: "⮝";
+  position: relative;
+  display: block;
+  top: 50%;
+  -webkit-transform: translateY(-55%);
+  transform: translateY(-55%);
+}
+#backtotop.visible #backtotop-color:hover {
+  background: var(--colorYellow);
+}

assets/theme-css/fresh.css

@@ -17,55 +17,6 @@
   background-position: 50%;
   margin: -100px 0 0 -100px;
 }
-#backtotop {
-  position: fixed;
-  right: 0;
-  opacity: 0;
-  visibility: hidden;
-  bottom: 25px;
-  margin: 0 25px 0 0;
-  z-index: 9999;
-  transition: 0.35s;
-  transform: scale(0.7);
-  transition: all 0.5s;
-}
-#backtotop.visible {
-  opacity: 1;
-  visibility: visible;
-  transform: scale(1);
-}
-#backtotop.visible a:hover {
-  outline: none;
-  opacity: 0.9;
-  background: #f39200;
-}
-#backtotop a {
-  outline: none;
-  text-decoration: none;
-  border: 0;
-  display: block;
-  width: 46px;
-  height: 46px;
-  background-color: #66676b;
-  opacity: 1;
-  transition: all 0.3s;
-  border-radius: 50%;
-  text-align: center;
-  font-size: 26px;
-}
-body #backtotop a {
-  outline: none;
-  color: #fff;
-}
-#backtotop a:after {
-  outline: none;
-  content: "⮝";
-  position: relative;
-  display: block;
-  top: 50%;
-  -webkit-transform: translateY(-55%);
-  transform: translateY(-55%);
-}
 .stuck {
   position: fixed !important;
   top: 0 !important;

assets/theme-css/styles.css

@@ -96,10 +96,6 @@ a > code {
   margin-left: 0.5em;
 }
 
-#backtotop.visible #backtotop-color:hover {
-  background: var(--colorYellow);
-}
-
 @media only screen and (max-width: 600px) {
   .flex-column {
     margin: 0 30px;