Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 1 | /** |
| 2 | * Used for section layout. This should be used for the page container |
| 3 | * Mark up |
Derick Montague | 30d7c63 | 2019-07-31 22:35:48 -0500 | [diff] [blame] | 4 | <section class="section"> |
| 5 | <div class="section-header"> |
| 6 | <h2 class="section-title">Section Title</h2> |
| 7 | ... any element added here will be right aligned |
| 8 | </div> |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 9 | <div class="section-content"> |
| 10 | ... |
| 11 | </div> |
| 12 | <div class="section-content"> |
| 13 | ... |
| 14 | </div> |
Derick Montague | 30d7c63 | 2019-07-31 22:35:48 -0500 | [diff] [blame] | 15 | </section> |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 16 | */ |
| 17 | |
| 18 | .section { |
| 19 | margin-bottom: 3rem; |
| 20 | } |
| 21 | |
Derick Montague | 30d7c63 | 2019-07-31 22:35:48 -0500 | [diff] [blame] | 22 | .section-header { |
| 23 | display: flex; |
| 24 | justify-content: space-between; |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 25 | border-bottom: 1px solid $border-color-01; |
| 26 | padding-bottom: 0.5rem; |
| 27 | margin-bottom: 1.5rem; |
| 28 | } |
| 29 | |
Derick Montague | 30d7c63 | 2019-07-31 22:35:48 -0500 | [diff] [blame] | 30 | .section-title { |
| 31 | margin-bottom: 0; |
| 32 | } |
| 33 | |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 34 | .section-content { |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 35 | margin-top: 0; |
Derick Montague | 30d7c63 | 2019-07-31 22:35:48 -0500 | [diff] [blame] | 36 | margin-bottom: 0; |
| 37 | |
| 38 | + .section-content { |
| 39 | margin-top: 1.5rem; |
| 40 | } |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 41 | } |