UNPKG

4.42 kBCSSView Raw
1.prism-header {
2 height: 60px;
3 z-index: 1100;
4 background: #FFFFFF;
5 box-shadow: 0px 1px 4px #9e9e9e;
6 font-family: "Roboto", "Arial", sans-serif;
7}
8.prism-image {
9 max-width: 100%;
10 max-height: 100%;
11}
12.prism-main-nav {
13 height: 100%;
14 background: #FFFFFF;
15 font-family: "Roboto", "Arial", sans-serif;
16}
17.prism-main-nav__list {
18 height: 100%;
19 margin: 0;
20 display: flex;
21 padding: 0;
22 list-style-type: none;
23}
24.prism-main-nav__item {
25 display: flex;
26 flex-grow: 1;
27 flex-wrap: nowrap;
28 min-height: 30px;
29 line-height: 1;
30 flex-direction: row;
31}
32@media (min-width:600px) {
33 .prism-main-nav__item {
34 flex-grow: 0;
35 }
36}
37 .prism-main-nav__link {
38 color: rgba(0, 0, 0, 0.87);
39 width: 100%;
40 border: solid 0 #FFFFFF;
41 cursor: pointer;
42 height: calc(100% - 2px);
43 display: flex;
44 padding: 0px 16px;
45 font-size: 0.7em;
46 text-align: center;
47 font-weight: 400;
48 flex-direction: column;
49 justify-content: center;
50 text-decoration: none;
51 border-top-width: 2px;
52 }
53 .prism-main-nav__link:active, .prism-main-nav__link:focus, .prism-main-nav__link:hover {
54 border-color: #f5f5f5;
55 background-color: #f5f5f5;
56 }
57@media (min-width:600px) {
58 .prism-main-nav__link {
59 border-width: 0 0 2px 0;
60 }
61}
62 .prism-main-nav__link--active {
63 border-color: #f5f5f5;
64 background-color: #f5f5f5;
65 }
66 .prism-main-nav__icon {
67 color: #61b3cf;
68 font-size: 1.25rem;
69 }
70 .prism-main-nav__label {
71 margin-top: 6px;
72 }
73 .prism-header-banner {
74 height: 100px;
75 display: flex;
76 padding: 0px 16px;
77 z-index: 1100;
78 background: #FFFFFF;
79 box-shadow: 0px 1px 4px #9e9e9e;
80 align-items: left;
81 font-family: "Roboto", "Arial", sans-serif;
82 }
83@media (min-width:960px) {
84 .prism-header-banner {
85 padding: 0px 32px;
86 }
87}
88 .prism-header-banner__logo {
89 flex-grow: 0;
90 align-self: center;
91 margin-right: 16px;
92 text-decoration: none;
93 }
94@media (min-width:960px) {
95 .prism-header-banner__logo {
96 min-width: 168px;
97 }
98}
99 .prism-header-banner__logo-image {
100 max-width: 200px;
101 max-height: 60px;
102 }
103 .prism-header-banner__main-nav {
104 flex-grow: 1;
105 }
106 .prism-header-banner__aside-menu {
107 flex-grow: 0;
108 }
109 .prism-header-banner__aside-menu--popup {
110 position: relative;
111 }
112 .prism-header-banner__aside-menu-trigger {
113 color: rgba(0, 0, 0, 0.87);
114 width: auto;
115 border: 0;
116 cursor: pointer;
117 height: calc(100% - 2px);
118 display: flex;
119 padding: 0px 16px;
120 font-size: 0.7em;
121 background: #FFFFFF;
122 text-align: center;
123 align-items: center;
124 font-weight: 400;
125 border-radius: 0;
126 flex-direction: column;
127 justify-content: center;
128 text-decoration: none;
129 border-top-width: 2px;
130 }
131 .prism-header-banner__aside-menu-trigger:active, .prism-header-banner__aside-menu-trigger:focus, .prism-header-banner__aside-menu-trigger:hover {
132 border-color: #f5f5f5;
133 background-color: #f5f5f5;
134 }
135@media (min-width:600px) {
136 .prism-header-banner__aside-menu-trigger {
137 border-width: 0 0 2px 0;
138 }
139}
140 .prism-header-banner__aside-menu-trigger-icon {
141 color: #61b3cf;
142 width: auto;
143 font-size: 1.25rem;
144 }
145 .prism-header-banner__aside-menu-popup {
146 top: 100px;
147 right: 0;
148 display: none;
149 position: absolute;
150 background: #FFFFFF;
151 box-shadow: 0px 1px 4px #9e9e9e;
152 border-color: solid 1px #eeeeee;
153 }
154 .prism-header-banner__aside-menu-popup[aria-hidden=false] {
155 display: block;
156 }
157 .prism-header-banner__user-menu {
158 margin: 0;
159 display: flex;
160 padding: 0;
161 flex-direction: column;
162 list-style-type: none;
163 }
164 .prism-header-banner__user-menu-item {
165 display: flex;
166 white-space: nowrap;
167 flex-direction: row;
168 }
169 .prism-header-banner__user-menu-item-divider {
170 width: 100%;
171 border: 0;
172 height: 0;
173 margin: 0;
174 border-top: solid 1px #bdbdbd;
175 }
176 .prism-header-banner__user-menu-item-icon {
177 color: rgba(0, 0, 0, 0.54);
178 }
179 .prism-header-banner__user-menu-item-trigger {
180 color: rgba(0, 0, 0, 0.54);
181 width: 100%;
182 border: 0;
183 display: flex;
184 padding: 16px;
185 background: #FFFFFF;
186 flex-direction: row;
187 justify-content: left;
188 }
189 .prism-header-banner__user-menu-item-trigger:focus, .prism-header-banner__user-menu-item-trigger:hover {
190 background: #f5f5f5;
191 }
192 .prism-header-banner__user-menu-item-label {
193 padding-left: 16px;
194 }
\No newline at end of file