icons.scss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. // icon
  2. .icon {
  3. display: inline-block;
  4. vertical-align: middle;
  5. background-repeat: no-repeat;
  6. background-size: 100% 100%;
  7. &-checked {
  8. width: 20px;
  9. height: 20px;
  10. background-image: url(../images/icon-checked.png);
  11. }
  12. &-doubt {
  13. background-image: url(../images/icon-doubt.png);
  14. width: 50px;
  15. height: 50px;
  16. }
  17. &-help {
  18. background-image: url(../images/icon-help.png);
  19. width: 32px;
  20. height: 32px;
  21. }
  22. &-back {
  23. background-image: url(../images/icon-back.png);
  24. width: 32px;
  25. height: 32px;
  26. }
  27. &-two-gray {
  28. background-image: url(../images/icon-two-gray.png);
  29. width: 12px;
  30. height: 10px;
  31. }
  32. &-two-white {
  33. background-image: url(../images/icon-two-white.png);
  34. width: 12px;
  35. height: 10px;
  36. }
  37. &-three-gray {
  38. background-image: url(../images/icon-three-gray.png);
  39. width: 16px;
  40. height: 10px;
  41. }
  42. &-three-white {
  43. background-image: url(../images/icon-three-white.png);
  44. width: 16px;
  45. height: 10px;
  46. }
  47. &-four-gray {
  48. background-image: url(../images/icon-four-gray.png);
  49. width: 18px;
  50. height: 10px;
  51. }
  52. &-four-white {
  53. background-image: url(../images/icon-four-white.png);
  54. width: 18px;
  55. height: 10px;
  56. }
  57. // column
  58. &-column {
  59. &-one {
  60. background-image: url(../images/icon-column-one.png);
  61. width: 20px;
  62. height: 20px;
  63. }
  64. &-one-act {
  65. background-image: url(../images/icon-column-one-act.png);
  66. width: 20px;
  67. height: 20px;
  68. }
  69. &-two {
  70. background-image: url(../images/icon-column-two.png);
  71. width: 20px;
  72. height: 20px;
  73. }
  74. &-two-act {
  75. background-image: url(../images/icon-column-two-act.png);
  76. width: 20px;
  77. height: 20px;
  78. }
  79. &-three {
  80. background-image: url(../images/icon-column-three.png);
  81. width: 20px;
  82. height: 20px;
  83. }
  84. &-three-act {
  85. background-image: url(../images/icon-column-three-act.png);
  86. width: 20px;
  87. height: 20px;
  88. }
  89. &-four {
  90. background-image: url(../images/icon-column-four.png);
  91. width: 20px;
  92. height: 20px;
  93. }
  94. &-four-act {
  95. background-image: url(../images/icon-column-four-act.png);
  96. width: 20px;
  97. height: 20px;
  98. }
  99. }
  100. }