diff options
| -rw-r--r-- | public/stylesheets/print.css | 4 | ||||
| -rw-r--r-- | public/stylesheets/style.css | 59 | ||||
| -rw-r--r-- | views/index.jade | 21 |
3 files changed, 71 insertions, 13 deletions
diff --git a/public/stylesheets/print.css b/public/stylesheets/print.css index 0e09533..ceed0d7 100644 --- a/public/stylesheets/print.css +++ b/public/stylesheets/print.css @@ -45,8 +45,8 @@ display: none; } -.mdl-menu__container { - display: none !important; +.menu { + display: none; } #schedule { diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css index fd2bfb8..c1c8e69 100644 --- a/public/stylesheets/style.css +++ b/public/stylesheets/style.css @@ -245,7 +245,7 @@ body.no-input #week-selector { box-shadow: none; } - body.no-input #search button { + body.no-input #search .input-wrapper button { display: none; } @@ -323,6 +323,11 @@ body.no-input #week-selector { color: #757575; } + body.no-input #search .menu { + top: 44px; + right: -2px; + } + body.no-input .tooltip { display: block; position: absolute; @@ -381,3 +386,55 @@ body.week-selector-not-visible #week-selector { .print { display: none; } + +.menu { + position: absolute; + right: 8px; + top: 70px; + background-color: white; + box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); + border-radius: 2px; +} + +.menu::before { + content: ''; + position: absolute; + top: -5px; + right: 15px; + z-index: -1; + transform: rotate(45deg); + width: 15px; + height: 15px; + background: white; +} + +.menu button.selected { + background-color: #cecece; +} + +.menu .item { + padding: 16px; + border: none; + border-bottom: 1px solid rgba(0,0,0,.12); + color: rgba(0,0,0,.87); + display: block; + background-color: initial; + font: inherit; + text-align: left; + width: 100%; +} + +.menu button.item:hover, .menu button.item:focus { + background-color: #eee; + outline: none; +} + +.menu .item:last-child { + border-bottom: none; +} + +.menu .item .material-icons { + float: right; + color: rgba(0, 0, 0, 0.66); + margin-top: -2px +} diff --git a/views/index.jade b/views/index.jade index 0608505..eaa224e 100644 --- a/views/index.jade +++ b/views/index.jade @@ -20,22 +20,23 @@ block content span Voer hier een <strong>docentafkorting</strong>, <strong>klas</strong>, <strong>leerlingnummer</strong> of <strong>lokaalnummer</strong> in. button#overflow-button(type='button') i.material-icons  - - ul.mdl-menu.mdl-menu--bottom-right.mdl-js-menu.mdl-js-ripple-effect(for='overflow-button') - a(href='http://www.meetingpointmco.nl/Roosters-AL/doc/basisroosters/default.htm') - li.mdl-menu__item Basis rooster gebruiken - a(href='http://www.meetingpointmco.nl/Roosters-AL/doc/') - li.mdl-menu__item Oud rooster gebruiken - a(href='javascript:window.print()').print-page - li.mdl-menu__item.mdl-menu__item--full-bleed-divider#print-page Pagina printen - li.mdl-menu__item(disabled) Gemaakt door Noah Loomans + + .menu + .item + button.mdl-button.selected Dagrooster + button.mdl-button Basisrooster + button.item + span Naar legacy rooster + i.material-icons launch + button.item(onclick='window.print()') Pagina printen + button.item Over .autocomplete-wrapper ul.autocomplete #week-selector #search-space-filler .week-wrapper button(type='button').material-icons  - span.current + span.current span.no-print Loading... span.print button(type='button').material-icons  |