_welcome.scss 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. #welcome .jumbotron {
  2. background: $primary;
  3. color: lighten($primary, 35%);
  4. margin-top: -20px;
  5. }
  6. #welcome .jumbotron__header,
  7. .jumbotron h1 {
  8. font-weight: bold;
  9. color: white;
  10. margin-top: 0;
  11. }
  12. #welcome .jumbotron__body {
  13. max-width: 80%;
  14. margin-bottom: 0;
  15. line-height: 1.6em;
  16. }
  17. #welcome .jumbotron__header, .jumbotron h1 {
  18. font-weight: lighter;
  19. }
  20. #welcome h2 {
  21. margin-bottom: 20px;
  22. }
  23. #welcome .steps {
  24. max-width: 80%;
  25. padding-left: 0;
  26. list-style: none;
  27. counter-reset: welcome-steps;
  28. }
  29. #welcome .steps > .steps__item {
  30. margin-bottom: 2.5em;
  31. padding: 19px;
  32. border: 1px solid $gray-lighter;
  33. border-radius: 4px;
  34. overflow: hidden;
  35. // The step number.
  36. &:before {
  37. content: counter(welcome-steps);
  38. counter-increment: welcome-steps;
  39. width: 50px;
  40. height: 50px;
  41. float: left;
  42. margin-right: 1em;
  43. background: $gray-lighter;
  44. border: 1px solid darken($gray-lighter, 10%);
  45. border-radius: 50%;
  46. font: bold 2em monospace;
  47. text-align: center;
  48. line-height: 49px;
  49. }
  50. .body {
  51. float: left;
  52. }
  53. h2 {
  54. font-weight: bold;
  55. margin-top: 0;
  56. }
  57. p:last-child {
  58. margin-bottom: 0;
  59. }
  60. }