blob: 143c52acd0d5aeb6db16f26fe90dc75460d77c24 [file] [log] [blame]
Michael Davis19475752017-02-23 18:30:23 -06001// Content layout styles
kathycee23d92019-11-11 10:35:31 -08002$nav__toplvlWidth: 240px;
Michael Davis19475752017-02-23 18:30:23 -06003
Derick Montague1a606be2019-05-23 21:32:28 -05004// Main element class
Michael Davis19475752017-02-23 18:30:23 -06005.content__container {
Michael Davis19475752017-02-23 18:30:23 -06006 margin-left: $nav__toplvlWidth;
Derick Montague1a606be2019-05-23 21:32:28 -05007 padding: 1em 0.1em;
kathycee23d92019-11-11 10:35:31 -08008 margin-top: 130px;
Derick Montague1a606be2019-05-23 21:32:28 -05009 @include mediaQuery(x-small) {
Michael Davis0f03ad12017-02-27 16:54:18 -060010 padding: 1rem 2rem;
Michael Davis19475752017-02-23 18:30:23 -060011 }
Derick Montague1a606be2019-05-23 21:32:28 -050012
Michael Davis706b75b2017-08-18 16:40:03 -050013 section.row,
Derick Montague1a606be2019-05-23 21:32:28 -050014 .column.row.row,
15 .row.row.columns {
Michael Davis706b75b2017-08-18 16:40:03 -050016 margin-left: 0;
17 }
Derick Montague1a606be2019-05-23 21:32:28 -050018
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 Davis19475752017-02-23 18:30:23 -060026}
Michael Davis6af13462017-04-04 14:07:02 -050027
Michael Davis272297b2017-04-24 12:11:53 -050028.content-header {
29 font-weight: 700;
30 margin-bottom: 0;
31 margin-top: 2em;
32}
33
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050034// TODO: Determine if label and content-label are the same - remove generic element selector
Derick Montague1a606be2019-05-23 21:32:28 -050035.content-label,
36label {
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050037 @include label;
Michael Davis272297b2017-04-24 12:11:53 -050038}
Iftekharul Islam8947e702017-07-27 10:28:07 -050039
Derick Montague30d7c632019-07-31 22:35:48 -050040// TODO: Remove and replace with section and section-title pattern
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050041// Page header
42.page-header {
43 width: 100%;
44 position: relative;
Derick Montague30d7c632019-07-31 22:35:48 -050045 border-bottom: 1px solid $border-color-01;
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050046 margin: 0.5em 0 2.2em;
47 padding-left: 0;
48}
49// TODO: Remove and replace with the .section and .section-title pattern
Iftekharul Islam8947e702017-07-27 10:28:07 -050050.subhead {
Gunnar Mills97195442018-11-26 16:51:57 -060051 width: 100%;
Yoshie Muranaka6f7ec802019-06-24 14:35:41 -050052 border-bottom: 1px solid $border-color-01;
Derick Montague1a606be2019-05-23 21:32:28 -050053 padding-bottom: 0.5em;
Gunnar Mills84e114a2018-11-14 13:44:41 -060054}