source: gs3-installations/thewillow/trunk/sites/thewillow/dlcol-chatgpt/iframe-page/dl-chatgpt_files/responsive_menu.css@ 38779

Last change on this file since 38779 was 38779, checked in by davidb, 3 months ago

Files that need to be moved to <gsdl3srchome>/web to provide a static web page example using an iframe to embedd the React/NextJS based chatbot
File size: 4.0 KB
Line 
1body.user-logged-in.toolbar-fixed.mm-wrapper_opening,
2body.user-logged-in.toolbar-fixed.mm-wrapper_opened {
3 padding-top: 0!important;
4}
5
6.responsive-menu-block-wrapper {
7 display: none;
8}
9
10.mm-page,
11.mm-wrapper_background body {
12 background-color: #ffffff;
13}
14
15.mm-wrapper_opening .toolbar-tray-open.toolbar-fixed.toolbar-vertical,
16.mm-opened .toolbar-tray-open.toolbar-fixed.toolbar-vertical {
17 margin-left: 0;
18}
19
20.mm-wrapper_opening .toolbar-tray-open.toolbar-fixed.toolbar-vertical .mm-page,
21.mm-opened .toolbar-tray-open.toolbar-fixed.toolbar-vertical .mm-page {
22 padding-left: 240px;
23 padding-left: 15rem;
24}
25
26.horizontal-menu {
27 position: relative;
28 margin-top: 0;
29 margin-right: 0;
30 margin-bottom: 0;
31 margin-left: 0;
32 padding: 0;
33 list-style: none;
34 width: 100%;
35}
36
37.horizontal-menu > li {
38 display: inline-block;
39 position: relative;
40}
41
42.horizontal-menu > li ul ul {
43 left: 13.75em;
44 top: 0;
45}
46
47.horizontal-menu ul .fly-left ul {
48 left: -13.75em;
49}
50
51.horizontal-menu > li > a {
52 display: block;
53 padding-top: 0.3em;
54 padding-right: 1em;
55 padding-bottom: 0.35em;
56 padding-left: 1em;
57 background-color: #fff;
58}
59
60.horizontal-menu > li ul {
61 position: absolute;
62 display: none;
63 top: 100%;
64 left: 0;
65 z-index: 99;
66 padding-top: 0;
67 padding-right: 0;
68 padding-bottom: 0;
69 padding-left: 0;
70 box-sizing: border-box;
71 width: 13.75em;
72 list-style: none;
73}
74
75.horizontal-menu li.sfHover > ul,
76.horizontal-menu li:hover > ul {
77 display: block;
78}
79
80.horizontal-menu li li {
81 position: relative;
82 float: left;
83 width: 100%;
84}
85
86.horizontal-menu > li > li:hover > ul,
87.horizontal-menu > li > li.sfHover > ul {
88 display: block;
89}
90
91.horizontal-menu > li li > a {
92 display: block;
93 position: relative;
94 padding-top: 0.25em;
95 padding-right: 1em;
96 padding-bottom: 0.25em;
97 padding-left: 1em;
98 text-transform: none;
99}
100
101.off-canvas-wrapper {
102 display: block;
103}
104
105.no-js .off-canvas-wrapper {
106 display: none;
107}
108
109.responsive-menu-toggle {
110 display: inline-block;
111}
112
113.responsive-menu-toggle-icon {
114 box-sizing: border-box;
115 display: block;
116 width: 44px;
117 height: 35px;
118 z-index: 4;
119 margin-top: 0;
120 position: relative;
121}
122
123.no-js .responsive-menu-toggle-icon {
124 display: none;
125}
126
127.responsive-menu-toggle-icon span.label {
128 display: block;
129 position: absolute;
130 font-size: 17px;
131 text-transform: uppercase;
132 top: 2px;
133 left: 40px;
134 color: #fff;
135}
136
137.responsive-menu-toggle-icon:before,
138.responsive-menu-toggle-icon:after,
139.responsive-menu-toggle-icon span.icon {
140 background: #fff;
141 content: '';
142 display: block;
143 width: 20px;
144 height: 3px;
145 position: absolute;
146 top: 0;
147 left: 13px;
148 border-radius: 2px;
149}
150
151.responsive-menu-toggle-icon:before {
152 top: 8px;
153}
154
155.responsive-menu-toggle-icon span.icon {
156 top: 14px;
157}
158
159.responsive-menu-toggle-icon:after {
160 top: 20px;
161}
162
163.responsive-menu-toggle-icon:before,
164.responsive-menu-toggle-icon:after,
165.responsive-menu-toggle-icon span.icon {
166 transition: none 0.4s ease-out 0.1s;
167 transition-property: -webkit-transform, top, bottom, left, opacity;
168 transition-property: transform, top, bottom, left, opacity;
169}
170
171.mm-wrapper_opening .responsive-menu-toggle-icon:before,
172.mm-wrapper_opening .responsive-menu-toggle-icon:after {
173 top: 14px;
174}
175
176.mm-wrapper_opening .responsive-menu-toggle-icon span.icon {
177 left: -25px;
178 opacity: 0;
179}
180
181.mm-wrapper_opening .responsive-menu-toggle-icon:before {
182 -webkit-transform: rotate(45deg);
183 -ms-transform: rotate(45deg);
184 transform: rotate(45deg);
185}
186
187.mm-wrapper_opening .responsive-menu-toggle-icon:after {
188 -webkit-transform: rotate(-45deg);
189 -ms-transform: rotate(-45deg);
190 transform: rotate(-45deg);
191}
192
193#mm-blocker {
194 background: rgba(0, 0, 0, 0);
195}
196.mm-wrapper_opening #mm-blocker {
197 background: rgba(0, 0, 0, 0.2);
198 transition: background 1s ease 0.3s;
199}
200.mm-wrapper_opening #page {
201 border-left: 1px solid #ccc;
202}
203
204.mm-panel a {
205 border-bottom: none;
206}
207
208ul.menu.mm-listview a.is-active {
209 color: inherit;
210}
211
212.mm-panel a:hover {
213 border: none;
214}
215
216ul.menu.mm-listview {
217 padding-left: 0;
218 margin-left: 0;
219}
Note: See TracBrowser for help on using the repository browser.