_home.less 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. .home {
  2. padding-bottom: @footer-margin * 2;
  3. .logo {
  4. margin-bottom: @20;
  5. }
  6. .hero {
  7. h1 {
  8. font-size: 4.5em;
  9. font-weight: 400;
  10. }
  11. h2 {
  12. margin-top: 0;
  13. font-size: 2em;
  14. }
  15. }
  16. }
  17. .prompt {
  18. &.box {
  19. border-radius: 10px !important;
  20. padding: 50px;
  21. margin-top: 30px !important;
  22. }
  23. }
  24. .signup {
  25. padding-top: @15;
  26. padding-bottom: @footer-margin * 2;
  27. }
  28. .home-main {
  29. p {
  30. font-size: 16px;
  31. color: #586069;
  32. }
  33. .ui.icon.header {
  34. font-weight: 400;
  35. }
  36. &.bg {
  37. background-image: linear-gradient(180deg, rgba(255,255,255,0) 50%, #fff),linear-gradient(70deg, #cde7ff 32%, #d3ffdd);
  38. }
  39. .align {
  40. margin-top: 1em;
  41. }
  42. .desc {
  43. padding-right: 8em;
  44. padding-left: 8em;
  45. font-family: monospace !important;
  46. font-size: 1.2em;
  47. }
  48. &.btn {
  49. &.home {
  50. margin-top: 50px;
  51. margin-left: 8px;
  52. margin-right: 8px;
  53. }
  54. &.register {
  55. background: #21ba45 !important;
  56. border-radius: 2em !important;
  57. height: 2.5em;
  58. text-transform: uppercase;
  59. font-size: 12px;
  60. letter-spacing: 0.03em;
  61. &:hover {
  62. color: #f5f5f5 !important;
  63. }
  64. }
  65. &.signin {
  66. text-transform: uppercase;
  67. font-size: 12px;
  68. letter-spacing: 0.03em;
  69. }
  70. }
  71. &.prompt {
  72. background-image: url(https://cdn.gitote.in/img/pattern.svg);
  73. background-position: center 30%;
  74. background-size: 25% auto;
  75. background-color: #f3f3f3;
  76. padding-top: @25;
  77. padding-bottom: 12px;
  78. }
  79. &.padding {
  80. padding-top: 4em;
  81. padding-bottom: 4em;
  82. }
  83. &.getstarted {
  84. background: @primary !important;
  85. h1 {
  86. color: @white-100;
  87. font-weight: 400;
  88. padding-top: 1em;
  89. padding-bottom: 1em;
  90. }
  91. }
  92. &.gradient-bg {
  93. background-image: linear-gradient(180deg,hsla(0,0%,100%,0) 50%,#fff),linear-gradient(70deg,#eaf5ff 32%,#f6fff8);
  94. }
  95. }
  96. .home-head {
  97. padding-top: 6.9em !important;
  98. padding-bottom: 6.9em !important;
  99. }
  100. // Mobile
  101. @media (max-width: 1020px) {
  102. .home-main {
  103. .desc, &.prompt {
  104. display: none !important;
  105. }
  106. }
  107. }