blob: f5d2757082bc44f6b01b80ecb50fd9f4a8069afd [file] [log] [blame]
Michael Davis19475752017-02-23 18:30:23 -06001// Content layout styles
Michael Davis71ec7452017-04-24 16:28:57 -05002$nav__toplvlWidth: 120px;
3$nav__seclvlWidth: 240px;
Michael Davis19475752017-02-23 18:30:23 -06004
Derick Montague1a606be2019-05-23 21:32:28 -05005// Main element class
Michael Davis19475752017-02-23 18:30:23 -06006.content__container {
Michael Davis19475752017-02-23 18:30:23 -06007 margin-left: $nav__toplvlWidth;
Derick Montague1a606be2019-05-23 21:32:28 -05008 padding: 1em 0.1em;
9
10 @include mediaQuery(x-small) {
Michael Davis0f03ad12017-02-27 16:54:18 -060011 padding: 1rem 2rem;
Michael Davis19475752017-02-23 18:30:23 -060012 }
Derick Montague1a606be2019-05-23 21:32:28 -050013
Michael Davis706b75b2017-08-18 16:40:03 -050014 section.row,
Derick Montague1a606be2019-05-23 21:32:28 -050015 .column.row.row,
16 .row.row.columns {
Michael Davis706b75b2017-08-18 16:40:03 -050017 margin-left: 0;
18 }
Derick Montague1a606be2019-05-23 21:32:28 -050019
20 // Must be applied to the <main> element in the app
21 // Required to create an elegant page transition
22 @include page-transition;
23 &.ng-leave-active,
24 &.ng-enter {
25 @include page-transition-visibility;
26 }
Michael Davis19475752017-02-23 18:30:23 -060027}
Michael Davis6af13462017-04-04 14:07:02 -050028
Michael Davis272297b2017-04-24 12:11:53 -050029.content-header {
30 font-weight: 700;
31 margin-bottom: 0;
32 margin-top: 2em;
33}
34
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050035// TODO: Determine if label and content-label are the same - remove generic element selector
Derick Montague1a606be2019-05-23 21:32:28 -050036.content-label,
37label {
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050038 @include label;
Michael Davis272297b2017-04-24 12:11:53 -050039}
Iftekharul Islam8947e702017-07-27 10:28:07 -050040
Derick Montague30d7c632019-07-31 22:35:48 -050041// TODO: Remove and replace with section and section-title pattern
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050042// Page header
43.page-header {
44 width: 100%;
45 position: relative;
Derick Montague30d7c632019-07-31 22:35:48 -050046 border-bottom: 1px solid $border-color-01;
Dixsie Wolmersc652ed12019-07-19 13:03:28 -050047 margin: 0.5em 0 2.2em;
48 padding-left: 0;
49}
50// TODO: Remove and replace with the .section and .section-title pattern
Iftekharul Islam8947e702017-07-27 10:28:07 -050051.subhead {
Gunnar Mills97195442018-11-26 16:51:57 -060052 width: 100%;
Yoshie Muranaka6f7ec802019-06-24 14:35:41 -050053 border-bottom: 1px solid $border-color-01;
Derick Montague1a606be2019-05-23 21:32:28 -050054 padding-bottom: 0.5em;
Gunnar Mills84e114a2018-11-14 13:44:41 -060055}