From 13a8cb94986970427e4e28a0ed0c5ac8984de293 Mon Sep 17 00:00:00 2001 From: Noah Loomans Date: Tue, 6 Dec 2016 16:23:58 +0100 Subject: don't show begin screen if screen is short --- public/stylesheets/style.css | 164 ++++++++++++++++++++++--------------------- 1 file changed, 83 insertions(+), 81 deletions(-) (limited to 'public/stylesheets') diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css index 7ac665f..8151be6 100644 --- a/public/stylesheets/style.css +++ b/public/stylesheets/style.css @@ -208,85 +208,87 @@ ul a { display: none; } -#search.no-input { - height: 100%; - background-color: #ececec; -} - -#search.no-input button { - display: none; -} - -#search.no-input #overflow-button { - position: absolute; - display: block; - top: 0; - right: 0; - color: #757575; -} - -#search.no-input .print-page { - display: none; -} - -#search.no-input #overflow-button:focus { - background-color: inherit; - color: #212121; -} - -#search.no-input .logo { - background-image: url(/icons/mml-logo.png); - background-position: center; - background-repeat: no-repeat; - background-size: contain; - height: 100px; - width: 100px; - - /* virtual center: http://javier.xyz/visual-center/ */ - transform: translate(-8%,-3%); - margin: 0 auto; -} - -#search.no-input .title { - display: block; - font-size: 55px; - padding-bottom: 32px; -} - -#search.no-input .title .text { - text-align: center; - line-height: 55px; -} - -#search.no-input .top-bar { - position: static; - display: block; - margin-top: 50vh; - transform: translateY(-75%); -} - -#search.no-input input[type='text'] { - background-color: #FFF; -} - -/* WebKit, Blink, Edge */ -#search.no-input input::-webkit-input-placeholder { - color: #757575; -} - -/* Mozilla Firefox 4 to 18 */ -#search.no-input input:-moz-placeholder { - color: #757575; - opacity: 1; -} - -/* Mozilla Firefox 19+ */ -#search.no-input input::-moz-placeholder { - color: #757575; - opacity: 1; -} - -/* Internet Explorer 10-11 */ -#search.no-input input:-ms-input-placeholder { - color: #757575; +@media screen and (min-height: 400px) { + #search.no-input { + height: 100%; + background-color: #ececec; + } + + #search.no-input button { + display: none; + } + + #search.no-input #overflow-button { + position: absolute; + display: block; + top: 0; + right: 0; + color: #757575; + } + + #search.no-input .print-page { + display: none; + } + + #search.no-input #overflow-button:focus { + background-color: inherit; + color: #212121; + } + + #search.no-input .logo { + background-image: url(/icons/mml-logo.png); + background-position: center; + background-repeat: no-repeat; + background-size: contain; + height: 100px; + width: 100px; + + /* virtual center: http://javier.xyz/visual-center/ */ + transform: translate(-8%,-3%); + margin: 0 auto; + } + + #search.no-input .title { + display: block; + font-size: 55px; + padding-bottom: 32px; + } + + #search.no-input .title .text { + text-align: center; + line-height: 55px; + } + + #search.no-input .top-bar { + position: static; + display: block; + margin-top: 50vh; + transform: translateY(-75%); + } + + #search.no-input input[type='text'] { + background-color: #FFF; + } + + /* WebKit, Blink, Edge */ + #search.no-input input::-webkit-input-placeholder { + color: #757575; + } + + /* Mozilla Firefox 4 to 18 */ + #search.no-input input:-moz-placeholder { + color: #757575; + opacity: 1; + } + + /* Mozilla Firefox 19+ */ + #search.no-input input::-moz-placeholder { + color: #757575; + opacity: 1; + } + + /* Internet Explorer 10-11 */ + #search.no-input input:-ms-input-placeholder { + color: #757575; + } } \ No newline at end of file -- cgit v1.1