pattern.scss 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. @import "vars";
  2. @import "mixins";
  3. #pattern {
  4. #background-position {
  5. height: 210px;
  6. position: relative;
  7. .position-icon {
  8. position: absolute;
  9. top: 50%;
  10. left: 50%;
  11. width: 120px;
  12. height: 120px;
  13. border: 2px solid $dark;
  14. border-radius: 4px;
  15. margin: -50px -60px;
  16. .radio {
  17. position: absolute;
  18. display: inline-block;
  19. &.top-left {top: -30px; left: 0; margin-left: -30px; }
  20. &.top-center {top: -30px; left: 50%; margin-left: -30px; }
  21. &.top-right {top: -30px; right: 0; margin-right: -30px; }
  22. &.center-left {top: 50%; margin-top: -30px; left: 0; margin-left: -30px; }
  23. &.center-center {top: 50%; margin-top: -30px; left: 50%; margin-left: -30px; }
  24. &.center-right {top: 50%; margin-top: -30px; right: 0; margin-right: -30px; }
  25. &.bottom-left {bottom: 0; margin-bottom: -30px; left: 0; margin-left: -30px; }
  26. &.bottom-center {bottom: 0; margin-bottom: -30px; left: 50%; margin-left: -30px; }
  27. &.bottom-right {bottom: 0; margin-bottom: -30px; right: 0; margin-right: -30px; }
  28. }
  29. }
  30. .icon-label {
  31. pointer-events: none;
  32. margin-top: 62px;
  33. }
  34. }
  35. }