|
2 | 2 |
|
3 | 3 | <div id="nav" class="trans fixed">
|
4 | 4 | <style type="text/gss">
|
5 |
| - |
| 5 | + |
6 | 6 | .badge {
|
7 | 7 | width: == 45.142;
|
8 | 8 | height: == 48;
|
9 | 9 | }
|
10 | 10 | @if [Wwin] >= [breakpoint1] {
|
11 | 11 | #nav {
|
12 | 12 | .badge {
|
13 |
| - top: == 0 - 4; |
14 |
| - center-x: == ::window[center-x]; |
| 13 | + top: == 0 - 4; |
| 14 | + center-x: == ::window[center-x]; |
15 | 15 | }
|
16 | 16 | }
|
17 | 17 | }
|
18 | 18 | @else {
|
19 | 19 | #nav {
|
20 | 20 | .badge {
|
21 |
| - top: == 0 - 4; |
22 |
| - right: == ::window[left]; |
| 21 | + top: == 0 - 4; |
| 22 | + right: == ::window[left]; |
23 | 23 | }
|
24 | 24 | }
|
25 | 25 | }
|
26 | 26 | #sidenav-menu-button {
|
27 | 27 | margin-top: -5px !important;
|
28 | 28 | width: == ::[intrinsic-width];
|
29 | 29 | height: == ::[intrinsic-height];
|
30 |
| - center-x: == 0 - ::window[center-y] - ::[width] / 2; |
| 30 | + center-x: == 0 - ::window[center-y] - ::[width] / 2; |
31 | 31 | }
|
32 | 32 |
|
33 | 33 | </style>
|
|
38 | 38 | #nav, #sidenav {
|
39 | 39 | z-index: 100;
|
40 | 40 | }
|
41 |
| - |
| 41 | + |
42 | 42 | #sidenav-menu-button-wrap {
|
43 | 43 | -webkit-transform: rotate(-90deg);
|
44 | 44 | -moz-transform: rotate(-90deg);
|
45 | 45 | transform: rotate(-90deg);
|
46 |
| - } |
| 46 | + } |
47 | 47 | .scrolled-down #nav {
|
48 | 48 | -webkit-transform: translateY(-72px);
|
49 | 49 | -moz-transform: translateY(-72px);
|
|
59 | 59 | -moz-transform: translateY(0px) !important;
|
60 | 60 | transform: translateY(0px) !important;
|
61 | 61 | }
|
62 |
| - |
| 62 | + |
63 | 63 | .scrolled-down #sidenav {
|
64 | 64 | -webkit-transform: translateX(-72px);
|
65 | 65 | -moz-transform: translateX(-72px);
|
|
74 | 74 | -webkit-transform: translateX(-72px) !important;
|
75 | 75 | -moz-transform: translateX(-72px) !important;
|
76 | 76 | transform: translateX(-72px) !important;
|
77 |
| - } |
| 77 | + } |
78 | 78 | .app-show-menu #menu {
|
79 | 79 | margin-left: 0 !important;
|
80 | 80 | }
|
|
83 | 83 | -webkit-transition: margin .3s;
|
84 | 84 | -moz-transition: margin .3s;
|
85 | 85 | transition: margin .3s;
|
86 |
| - |
87 |
| - |
| 86 | + |
| 87 | + |
88 | 88 | }
|
89 | 89 | .app-show-menu #hide-menu-button {
|
90 | 90 | margin-left: 0 !important;
|
|
93 | 93 | margin-left: -100% !important;
|
94 | 94 | margin-left: -100% !important;
|
95 | 95 | -webkit-transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1); /* older webkit */
|
96 |
| - -webkit-transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1.100); |
97 |
| - -moz-transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1.100); |
98 |
| - -o-transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1.100); |
| 96 | + -webkit-transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1.100); |
| 97 | + -moz-transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1.100); |
| 98 | + -o-transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1.100); |
99 | 99 | transition: margin 600ms cubic-bezier(0.080, 0.615, 0.355, 1.100); /* custom */
|
100 | 100 |
|
101 | 101 | -webkit-transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1); /* older webkit */
|
102 |
| - -webkit-transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1.100); |
103 |
| - -moz-transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1.100); |
104 |
| - -o-transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1.100); |
| 102 | + -webkit-transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1.100); |
| 103 | + -moz-transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1.100); |
| 104 | + -o-transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1.100); |
105 | 105 | transition-timing-function: cubic-bezier(0.080, 0.615, 0.355, 1.100); /* custom */
|
106 | 106 | }
|
107 | 107 | </style>
|
108 | 108 | <a id="top-badge" href="/">
|
109 |
| - <svg class="badge badge-icon trans" |
| 109 | + <svg class="badge badge-icon trans" |
110 | 110 | width="45.142px" height="48px" version="1.1" xmlns="http://www.w3.org/2000/svg" baseProfile="full">
|
111 | 111 | <g>
|
112 | 112 | <path d="M11.991,34.812l10.595,2.902l10.453-2.874l1.185-13.159l-11.638-0.001v5.193h6.06l-0.425,3.959l-5.636,1.508l-5.777-1.536
|
|
117 | 117 | </a>
|
118 | 118 | </div>
|
119 | 119 |
|
120 |
| -<div id="sidenav" class="fixed trans"> |
| 120 | +<div id="sidenav" class="fixed trans"> |
121 | 121 | <div id="sidenav-menu-button-wrap" class="trans">
|
122 | 122 | <button id="sidenav-menu-button" class="app-menu-trigger transparent">Menu</button>
|
123 |
| - </div> |
| 123 | + </div> |
124 | 124 | </div>
|
125 | 125 |
|
126 | 126 | <div id="menu" class="color-menu trans fixed">
|
127 | 127 | <style type="text/gss">
|
128 |
| - |
| 128 | + |
129 | 129 | /* structure */
|
130 | 130 | #menu {
|
131 | 131 | top: == 0 !require;
|
132 | 132 | left: == 0 !require;
|
133 |
| - bottom: == ::window[bottom] !require; |
| 133 | + bottom: == ::window[bottom] !require; |
134 | 134 | overflow-y: auto;
|
135 | 135 | overflow-x: hidden;
|
136 |
| - |
| 136 | + |
137 | 137 | ul {
|
138 | 138 | top: >=0 !require;
|
139 | 139 | height: == ::[intrinsic-height];
|
140 |
| - center-y: == ::window[center-y]; |
| 140 | + center-y: == ::window[center-y]; |
141 | 141 | padding: == 2 * [baseline];
|
142 | 142 | width: == ::[intrinsic-width];
|
143 | 143 | left: == #hide-menu-button[right];
|
144 | 144 | right: == ::parent[right] - #hide-menu-button[width];
|
145 |
| - |
| 145 | + |
146 | 146 | li {
|
147 | 147 | text-align: center;
|
148 | 148 | }
|
149 | 149 | }
|
150 | 150 | }
|
151 |
| - |
| 151 | + |
152 | 152 | #hide-menu-button {
|
153 | 153 | width: == ::[intrinsic-width];
|
154 | 154 | height: == ::[intrinsic-height];
|
155 | 155 | center-y: == #menu[center-y];
|
156 | 156 | left: == #menu[left];
|
157 | 157 | }
|
158 |
| - |
159 |
| - |
| 158 | + |
| 159 | + |
160 | 160 | </style>
|
161 | 161 | <ul class="large-list">
|
162 | 162 | <li>
|
163 | 163 | <a href="/">
|
164 |
| - <svg class="badge badge-icon trans" |
| 164 | + <svg class="badge badge-icon trans" |
165 | 165 | width="45.142px" height="48px" version="1.1" xmlns="http://www.w3.org/2000/svg" baseProfile="full">
|
166 | 166 | <g>
|
167 | 167 | <path d="M11.991,34.812l10.595,2.902l10.453-2.874l1.185-13.159l-11.638-0.001v5.193h6.06l-0.425,3.959l-5.636,1.508l-5.777-1.536
|
|
175 | 175 | <a href="/usage/">Install</a>
|
176 | 176 | </li>
|
177 | 177 | <li>
|
178 |
| - <a href="https://github.com/the-gss/engine">Github</a> |
| 178 | + <a href="https://github.com/gss/engine">Github</a> |
179 | 179 | </li>
|
180 | 180 | <!--li>
|
181 | 181 | <a href="/demos/">Demos</a>
|
|
0 commit comments