backtop.scss 1.1 KB

12345678910111213141516171819202122232425262728
  1. .nut-backtop {
  2. display: none;
  3. line-height: 0;
  4. position: fixed;
  5. cursor: pointer;
  6. bottom: 20px;
  7. right: 10px;
  8. z-index: 1111;
  9. &.show {
  10. display: block;
  11. }
  12. &-main {
  13. transition: all .2s ease-in-out;
  14. width: 38px;
  15. height: 38px;
  16. background: #FFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31 39'%3E%3Cg fill-rule='evenodd'%3E%3Cpath d='M1.41 0C.63 0 0 .672 0 1.5S.63 3 1.41 3h28.18C30.37 3 31 2.328 31 1.5S30.369 0 29.59 0H1.41zM17 7.5a1.5 1.5 0 0 0-3 0v30a1.5 1.5 0 1 0 3 0v-30zM8.44 12.44l-8 8a1.5 1.5 0 1 0 2.12 2.12l8-8a1.5 1.5 0 1 0-2.12-2.12z'/%3E%3Cpath d='M16.56 6.44l14 14a1.5 1.5 0 1 1-2.12 2.12l-14-14a1.5 1.5 0 1 1 2.12-2.12z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center;
  17. background-size: 20px 20px;
  18. border-radius: 50%;
  19. border: 2px solid rgba(180,180,180,.5);
  20. box-shadow: 0px 0px 2px 3px rgba(220, 220, 220, .1)
  21. }
  22. i {
  23. color: #fff;
  24. font-size: 24px;
  25. padding: 8px 12px;
  26. line-height: 0;
  27. }
  28. }