Skouter mortgage estimates. Web application with view written in PHP and Vue, but controller and models in Go.
No puede seleccionar más de 25 temas Los temas deben comenzar con una letra o número, pueden incluir guiones ('-') y pueden tener hasta 35 caracteres de largo.
 
 
 
 
 
 

177 líneas
3.6 KiB

  1. // Icon time
  2. .icon-time {
  3. border: $icon-border-width solid currentColor;
  4. border-radius: 50%;
  5. &::before {
  6. background: currentColor;
  7. content: "";
  8. height: .4em;
  9. transform: translate(-50%, -75%);
  10. width: $icon-border-width;
  11. }
  12. &::after {
  13. background: currentColor;
  14. content: "";
  15. height: .3em;
  16. transform: translate(-50%, -75%) rotate(90deg);
  17. transform-origin: 50% 90%;
  18. width: $icon-border-width;
  19. }
  20. }
  21. // Icon mail
  22. .icon-mail {
  23. &::before {
  24. border: $icon-border-width solid currentColor;
  25. border-radius: $border-radius;
  26. content: "";
  27. height: .8em;
  28. width: 1em;
  29. }
  30. &::after {
  31. border: $icon-border-width solid currentColor;
  32. border-right: 0;
  33. border-top: 0;
  34. content: "";
  35. height: .5em;
  36. transform: translate(-50%, -90%) rotate(-45deg) skew(10deg, 10deg);
  37. width: .5em;
  38. }
  39. }
  40. // Icon people
  41. .icon-people {
  42. &::before {
  43. border: $icon-border-width solid currentColor;
  44. border-radius: 50%;
  45. content: "";
  46. height: .45em;
  47. top: 25%;
  48. width: .45em;
  49. }
  50. &::after {
  51. border: $icon-border-width solid currentColor;
  52. border-radius: 50% 50% 0 0;
  53. content: "";
  54. height: .4em;
  55. top: 75%;
  56. width: .9em;
  57. }
  58. }
  59. // Icon message
  60. .icon-message {
  61. border: $icon-border-width solid currentColor;
  62. border-bottom: 0;
  63. border-radius: $border-radius;
  64. border-right: 0;
  65. &::before {
  66. border: $icon-border-width solid currentColor;
  67. border-bottom-right-radius: $border-radius;
  68. border-left: 0;
  69. border-top: 0;
  70. content: "";
  71. height: .8em;
  72. left: 65%;
  73. top: 40%;
  74. width: .7em;
  75. }
  76. &::after {
  77. background: currentColor;
  78. border-radius: $border-radius;
  79. content: "";
  80. height: .3em;
  81. left: 10%;
  82. top: 100%;
  83. transform: translate(0, -90%) rotate(45deg);
  84. width: $icon-border-width;
  85. }
  86. }
  87. // Icon photo
  88. .icon-photo {
  89. border: $icon-border-width solid currentColor;
  90. border-radius: $border-radius;
  91. &::before {
  92. border: $icon-border-width solid currentColor;
  93. border-radius: 50%;
  94. content: "";
  95. height: .25em;
  96. left: 35%;
  97. top: 35%;
  98. width: .25em;
  99. }
  100. &::after {
  101. border: $icon-border-width solid currentColor;
  102. border-bottom: 0;
  103. border-left: 0;
  104. content: "";
  105. height: .5em;
  106. left: 60%;
  107. transform: translate(-50%, 25%) rotate(-45deg);
  108. width: .5em;
  109. }
  110. }
  111. // Icon link
  112. .icon-link {
  113. &::before,
  114. &::after {
  115. border: $icon-border-width solid currentColor;
  116. border-radius: 5em 0 0 5em;
  117. border-right: 0;
  118. content: "";
  119. height: .5em;
  120. width: .75em;
  121. }
  122. &::before {
  123. transform: translate(-70%, -45%) rotate(-45deg);
  124. }
  125. &::after {
  126. transform: translate(-30%, -55%) rotate(135deg);
  127. }
  128. }
  129. // Icon location
  130. .icon-location {
  131. &::before {
  132. border: $icon-border-width solid currentColor;
  133. border-radius: 50% 50% 50% 0;
  134. content: "";
  135. height: .8em;
  136. transform: translate(-50%, -60%) rotate(-45deg);
  137. width: .8em;
  138. }
  139. &::after {
  140. border: $icon-border-width solid currentColor;
  141. border-radius: 50%;
  142. content: "";
  143. height: .2em;
  144. transform: translate(-50%, -80%);
  145. width: .2em;
  146. }
  147. }
  148. // Icon emoji
  149. .icon-emoji {
  150. border: $icon-border-width solid currentColor;
  151. border-radius: 50%;
  152. &::before {
  153. border-radius: 50%;
  154. box-shadow: -.17em -.15em, .17em -.15em;
  155. content: "";
  156. height: .1em;
  157. width: .1em;
  158. }
  159. &::after {
  160. border: $icon-border-width solid currentColor;
  161. border-bottom-color: transparent;
  162. border-radius: 50%;
  163. border-right-color: transparent;
  164. content: "";
  165. height: .5em;
  166. transform: translate(-50%, -40%) rotate(-135deg);
  167. width: .5em;
  168. }
  169. }