Skouter mortgage estimates. Web application with view written in PHP and Vue, but controller and models in Go.
25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.
 
 
 
 
 
 

177 satır
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. }