Michael Davis | 1947575 | 2017-02-23 18:30:23 -0600 | [diff] [blame] | 1 | // Content layout styles |
kathy | cee23d9 | 2019-11-11 10:35:31 -0800 | [diff] [blame] | 2 | $nav__toplvlWidth: 240px; |
Michael Davis | 1947575 | 2017-02-23 18:30:23 -0600 | [diff] [blame] | 3 | |
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 4 | // Main element class |
Michael Davis | 1947575 | 2017-02-23 18:30:23 -0600 | [diff] [blame] | 5 | .content__container { |
Michael Davis | 1947575 | 2017-02-23 18:30:23 -0600 | [diff] [blame] | 6 | margin-left: $nav__toplvlWidth; |
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 7 | padding: 1em 0.1em; |
kathy | cee23d9 | 2019-11-11 10:35:31 -0800 | [diff] [blame] | 8 | margin-top: 130px; |
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 9 | @include mediaQuery(x-small) { |
Michael Davis | 0f03ad1 | 2017-02-27 16:54:18 -0600 | [diff] [blame] | 10 | padding: 1rem 2rem; |
Michael Davis | 1947575 | 2017-02-23 18:30:23 -0600 | [diff] [blame] | 11 | } |
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 12 | |
Michael Davis | 706b75b | 2017-08-18 16:40:03 -0500 | [diff] [blame] | 13 | section.row, |
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 14 | .column.row.row, |
15 | .row.row.columns { | ||||
Michael Davis | 706b75b | 2017-08-18 16:40:03 -0500 | [diff] [blame] | 16 | margin-left: 0; |
17 | } | ||||
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 18 | |
19 | // Must be applied to the <main> element in the app | ||||
20 | // Required to create an elegant page transition | ||||
21 | @include page-transition; | ||||
22 | &.ng-leave-active, | ||||
23 | &.ng-enter { | ||||
24 | @include page-transition-visibility; | ||||
25 | } | ||||
Michael Davis | 1947575 | 2017-02-23 18:30:23 -0600 | [diff] [blame] | 26 | } |
Michael Davis | 6af1346 | 2017-04-04 14:07:02 -0500 | [diff] [blame] | 27 | |
Michael Davis | 272297b | 2017-04-24 12:11:53 -0500 | [diff] [blame] | 28 | .content-header { |
29 | font-weight: 700; | ||||
30 | margin-bottom: 0; | ||||
31 | margin-top: 2em; | ||||
32 | } | ||||
33 | |||||
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 34 | // TODO: Determine if label and content-label are the same - remove generic element selector |
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 35 | .content-label, |
36 | label { | ||||
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 37 | @include label; |
Michael Davis | 272297b | 2017-04-24 12:11:53 -0500 | [diff] [blame] | 38 | } |
Iftekharul Islam | 8947e70 | 2017-07-27 10:28:07 -0500 | [diff] [blame] | 39 | |
Derick Montague | 30d7c63 | 2019-07-31 22:35:48 -0500 | [diff] [blame] | 40 | // TODO: Remove and replace with section and section-title pattern |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 41 | // Page header |
42 | .page-header { | ||||
43 | width: 100%; | ||||
44 | position: relative; | ||||
Derick Montague | 30d7c63 | 2019-07-31 22:35:48 -0500 | [diff] [blame] | 45 | border-bottom: 1px solid $border-color-01; |
Dixsie Wolmers | c652ed1 | 2019-07-19 13:03:28 -0500 | [diff] [blame] | 46 | margin: 0.5em 0 2.2em; |
47 | padding-left: 0; | ||||
48 | } | ||||
49 | // TODO: Remove and replace with the .section and .section-title pattern | ||||
Iftekharul Islam | 8947e70 | 2017-07-27 10:28:07 -0500 | [diff] [blame] | 50 | .subhead { |
Gunnar Mills | 9719544 | 2018-11-26 16:51:57 -0600 | [diff] [blame] | 51 | width: 100%; |
Yoshie Muranaka | 6f7ec80 | 2019-06-24 14:35:41 -0500 | [diff] [blame] | 52 | border-bottom: 1px solid $border-color-01; |
Derick Montague | 1a606be | 2019-05-23 21:32:28 -0500 | [diff] [blame] | 53 | padding-bottom: 0.5em; |
Gunnar Mills | 84e114a | 2018-11-14 13:44:41 -0600 | [diff] [blame] | 54 | } |