From e676ba3812b064950157b7e858d017613a914bbd Mon Sep 17 00:00:00 2001
From: Janne Koschinski <janne@kuschku.de>
Date: Tue, 21 Mar 2017 19:14:39 +0100
Subject: [PATCH] Updated UI slightly
---
res/css/content.sass | 37 +++++-
res/css/nav.sass | 153 +++++++++++++------------
res/css/search.css | 178 +++++++++++++++++------------
res/css/search.css.map | 2 +-
res/css/search.sass | 1 +
res/js/component/historyelement.js | 3 +
res/js/component/nav.js | 95 +++++++--------
templates/search.phtml | 6 +-
8 files changed, 281 insertions(+), 194 deletions(-)
diff --git a/res/css/content.sass b/res/css/content.sass
index 4f7e276..61896fe 100644
--- a/res/css/content.sass
+++ b/res/css/content.sass
@@ -1,10 +1,15 @@
.results
- max-width: 1328px
- padding: 56px 6rem 8rem 6rem
+ max-width: 1136px
+ padding: 56px 2rem 4rem 2rem
margin: 0 auto
transition: opacity 400ms
+ @media(max-width: 800px)
+ padding-left: 0
+ padding-right: 0
+ padding-bottom: 0
+
.buffer
display: block
margin-top: 0
@@ -96,11 +101,23 @@
text-align: right
flex-shrink: 0
+ @media(max-width: 800px)
+ position: absolute
+ right: 8px
+ bottom: 8px
+ width: initial
+ font-style: italic
+ color: #777
+
.container
display: flex
flex-grow: 1
flex-shrink: 1
+ @media(max-width: 800px)
+ display: block
+ padding-bottom: 16px
+
.sender
width: 148px
display: inline-block
@@ -108,8 +125,21 @@
font-weight: bold
flex-shrink: 0
+ @media(max-width: 800px)
+ width: initial
+ padding: 0
+
+ &:after
+ @media(max-width: 800px)
+ content: ': '
+ margin-right: 8px
+
.preview
flex: 50%
+
+ @media(max-width: 800px)
+ display: none
+
.irc_highlight
background-color: rgba(251, 246, 167, 0.5)
@@ -117,6 +147,9 @@
flex: 50%
overflow: hidden
+ @media(max-width: 800px)
+ display: inline
+
.irc_bold
font-weight: bold
.irc_italic
diff --git a/res/css/nav.sass b/res/css/nav.sass
index 4030264..7de0e91 100644
--- a/res/css/nav.sass
+++ b/res/css/nav.sass
@@ -8,9 +8,8 @@
height: 56px
z-index: 2
- .container
+ .bar
background: #0271B3
- padding: 0 6rem
z-index: 1
position: absolute
top: 0
@@ -19,97 +18,105 @@
box-shadow: 0 -1px 0 #e0e0e0, 0 0 2px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .24)
transition: background .15s
- .searchBar
+ .container
max-width: 1136px
- margin: 10px auto
- height: 36px
+ margin: 0 auto
+ padding: 0 2rem
display: flex
- position: relative
- border: none
- transition: background .15s
- background: rgba(255, 255, 255, .15)
- border-radius: 2px
- padding: 0 0 0 72px
- color: #ffffff
- flex-direction: row
-
- &:hover
- background: rgba(255, 255, 255, .3)
-
- .icon
- display: inline-block
- width: 72px
- height: 36px
- position: absolute
- text-align: center
- line-height: 36px
- left: 0
- top: 0
-
- .search
- display: inline-block
- flex-grow: 1
- flex-shrink: 1
- background: none
+
+ @media(max-width: 800px)
+ padding: 0 0 0 8px
+
+ .searchBar
+ margin: 8px auto
+ height: 40px
+ display: flex
+ position: relative
border: none
- line-height: 100%
+ transition: background .15s
+ background: #358dc2
+ border-radius: 2px
+ padding: 0 0 0 72px
color: #ffffff
- font-size: 1rem
+ flex-direction: row
+ flex: 1
+ box-shadow: 0 1px 1px rgba(0, 0, 0, .06)
- &::-moz-placeholder
- color: #ffffff
- opacity: 1
- -moz-osx-font-smoothing: grayscale
+ &:hover
+ background: rgba(255, 255, 255, .3)
- &::-webkit-input-placeholder
+ .icon
+ display: inline-block
+ width: 72px
+ height: 40px
+ position: absolute
+ text-align: center
+ line-height: 40px
+ left: 0
+ top: 0
+
+ .search
+ display: inline-block
+ flex-grow: 1
+ flex-shrink: 1
+ background: none
+ border: none
+ line-height: 100%
color: #ffffff
- opacity: 1
- -webkit-font-smoothing: antialiased
+ font-size: 1rem
- .actions
- position: absolute
- height: 56px
- z-index: 8
- right: 0
- display: flex
- align-items: center
- justify-content: flex-end
- padding-left: 30px
- padding-right: 30px
+ &::-moz-placeholder
+ color: #ffffff
+ opacity: 1
+ -moz-osx-font-smoothing: grayscale
+
+ &::-webkit-input-placeholder
+ color: #ffffff
+ opacity: 1
+ -webkit-font-smoothing: antialiased
+
+ .actions
+ display: flex
+ align-items: center
+ justify-content: flex-end
a
- height: 30px
- width: 30px
+ height: 56px
+ width: 56px
position: relative
- padding: 3px
+ padding: 16px 13px
cursor: pointer
color: #fff
transition: all .15s
text-decoration: none
+ text-align: center
@include vendor-prefix('user-select', 'none')
&:hover:before
background-color: rgba(0, 0, 0, .12)
- bottom: -4px
+ bottom: 9px
content: ' '
- left: -4px
+ left: 9px
margin: auto
padding: 4px
position: absolute
- right: -4px
- top: -4px
+ right: 9px
+ top: 9px
z-index: -1
border-radius: 50%
.history
top: 100%
- max-width: 1328px
+ max-width: 1136px
margin: auto
- padding: 0 6rem
+ padding: 0 2rem
transform: translateY(-200%)
transition: transform 400ms
position: relative
+ @media(max-width: 800px)
+ padding: 0
+
ul
list-style-type: none
margin: 0
@@ -149,26 +156,28 @@
color: #646464
&.focus
- .container
+ .bar
background: #f2f2f2
- .searchBar
- background: #ffffff
+ .container
- .search
- color: #333333
+ .searchBar
+ background: #ffffff
- &::-moz-placeholder
- color: #757575
+ .search
+ color: #333333
- &::-webkit-input-placeholder
- color: #757575
+ &::-moz-placeholder
+ color: #757575
+
+ &::-webkit-input-placeholder
+ color: #757575
+
+ .icon
+ color: #757575
.history
transform: translateY(0)
- .icon
- color: #333333
-
&+.results
opacity: 0
\ No newline at end of file
diff --git a/res/css/search.css b/res/css/search.css
index dc624ff..8719007 100644
--- a/res/css/search.css
+++ b/res/css/search.css
@@ -39,7 +39,8 @@
* {
padding: 0;
margin: 0;
- box-sizing: border-box; }
+ box-sizing: border-box;
+ -webkit-tap-highlight-color: transparent; }
body {
background: #F2F2F2;
@@ -56,9 +57,8 @@ body {
top: 0;
height: 56px;
z-index: 2; }
- .nav .container {
+ .nav .bar {
background: #0271B3;
- padding: 0 6rem;
z-index: 1;
position: absolute;
top: 0;
@@ -66,91 +66,98 @@ body {
right: 0;
box-shadow: 0 -1px 0 #e0e0e0, 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
transition: background 0.15s; }
- .nav .container .searchBar {
+ .nav .bar .container {
max-width: 1136px;
- margin: 10px auto;
- height: 36px;
- display: flex;
- position: relative;
- border: none;
- transition: background 0.15s;
- background: rgba(255, 255, 255, 0.15);
- border-radius: 2px;
- padding: 0 0 0 72px;
- color: #ffffff;
- flex-direction: row; }
- .nav .container .searchBar:hover {
- background: rgba(255, 255, 255, 0.3); }
- .nav .container .searchBar .icon {
- display: inline-block;
- width: 72px;
- height: 36px;
- position: absolute;
- text-align: center;
- line-height: 36px;
- left: 0;
- top: 0; }
- .nav .container .searchBar .search {
- display: inline-block;
- flex-grow: 1;
- flex-shrink: 1;
- background: none;
+ margin: 0 auto;
+ padding: 0 2rem;
+ display: flex; }
+@media(max-width: 800px) {
+ .nav .bar .container {
+ padding: 0 0 0 8px; } }
+ .nav .bar .container .searchBar {
+ margin: 8px auto;
+ height: 40px;
+ display: flex;
+ position: relative;
border: none;
- line-height: 100%;
+ transition: background 0.15s;
+ background: #358dc2;
+ border-radius: 2px;
+ padding: 0 0 0 72px;
color: #ffffff;
- font-size: 1rem; }
- .nav .container .searchBar .search::-moz-placeholder {
- color: #ffffff;
- opacity: 1;
- -moz-osx-font-smoothing: grayscale; }
- .nav .container .searchBar .search::-webkit-input-placeholder {
+ flex-direction: row;
+ flex: 1;
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.06); }
+ .nav .bar .container .searchBar:hover {
+ background: rgba(255, 255, 255, 0.3); }
+ .nav .bar .container .searchBar .icon {
+ display: inline-block;
+ width: 72px;
+ height: 40px;
+ position: absolute;
+ text-align: center;
+ line-height: 40px;
+ left: 0;
+ top: 0; }
+ .nav .bar .container .searchBar .search {
+ display: inline-block;
+ flex-grow: 1;
+ flex-shrink: 1;
+ background: none;
+ border: none;
+ line-height: 100%;
color: #ffffff;
- opacity: 1;
- -webkit-font-smoothing: antialiased; }
- .nav .actions {
- position: absolute;
- height: 56px;
- z-index: 8;
- right: 0;
- display: flex;
- align-items: center;
- justify-content: flex-end;
- padding-left: 30px;
- padding-right: 30px; }
- .nav .actions a {
- height: 30px;
- width: 30px;
+ font-size: 1rem; }
+ .nav .bar .container .searchBar .search::-moz-placeholder {
+ color: #ffffff;
+ opacity: 1;
+ -moz-osx-font-smoothing: grayscale; }
+ .nav .bar .container .searchBar .search::-webkit-input-placeholder {
+ color: #ffffff;
+ opacity: 1;
+ -webkit-font-smoothing: antialiased; }
+ .nav .bar .container .actions {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end; }
+ .nav .bar a {
+ height: 56px;
+ width: 56px;
position: relative;
- padding: 3px;
+ padding: 16px 13px;
cursor: pointer;
color: #fff;
transition: all 0.15s;
text-decoration: none;
+ text-align: center;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none; }
- .nav .actions a:hover:before {
+ .nav .bar a:hover:before {
background-color: rgba(0, 0, 0, 0.12);
- bottom: -4px;
+ bottom: 9px;
content: " ";
- left: -4px;
+ left: 9px;
margin: auto;
padding: 4px;
position: absolute;
- right: -4px;
- top: -4px;
+ right: 9px;
+ top: 9px;
z-index: -1;
border-radius: 50%; }
.nav .history {
top: 100%;
- max-width: 1328px;
+ max-width: 1136px;
margin: auto;
- padding: 0 6rem;
+ padding: 0 2rem;
transform: translateY(-200%);
transition: transform 400ms;
position: relative; }
+@media(max-width: 800px) {
+ .nav .history {
+ padding: 0; } }
.nav .history ul {
list-style-type: none;
margin: 0;
@@ -184,28 +191,33 @@ body {
white-space: nowrap;
font-style: italic;
color: #646464; }
- .nav.focus .container {
+ .nav.focus .bar {
background: #f2f2f2; }
- .nav.focus .container .searchBar {
+ .nav.focus .bar .container .searchBar {
background: #ffffff; }
- .nav.focus .container .searchBar .search {
+ .nav.focus .bar .container .searchBar .search {
color: #333333; }
- .nav.focus .container .searchBar .search::-moz-placeholder {
+ .nav.focus .bar .container .searchBar .search::-moz-placeholder {
color: #757575; }
- .nav.focus .container .searchBar .search::-webkit-input-placeholder {
+ .nav.focus .bar .container .searchBar .search::-webkit-input-placeholder {
color: #757575; }
+ .nav.focus .bar .container .icon {
+ color: #757575; }
.nav.focus .history {
transform: translateY(0); }
- .nav.focus .icon {
- color: #333333; }
.nav.focus + .results {
opacity: 0; }
.results {
- max-width: 1328px;
- padding: 56px 6rem 8rem 6rem;
+ max-width: 1136px;
+ padding: 56px 2rem 4rem 2rem;
margin: 0 auto;
transition: opacity 400ms; }
+@media(max-width: 800px) {
+ .results {
+ padding-left: 0;
+ padding-right: 0;
+ padding-bottom: 0; } }
.results .buffer {
display: block;
margin-top: 0;
@@ -277,23 +289,49 @@ body {
display: inline-block;
text-align: right;
flex-shrink: 0; }
+@media(max-width: 800px) {
+ .results .buffer .container .context .message time {
+ position: absolute;
+ right: 8px;
+ bottom: 8px;
+ width: initial;
+ font-style: italic;
+ color: #777; } }
.results .buffer .container .context .message .container {
display: flex;
flex-grow: 1;
flex-shrink: 1; }
+@media(max-width: 800px) {
+ .results .buffer .container .context .message .container {
+ display: block;
+ padding-bottom: 16px; } }
.results .buffer .container .context .message .container .sender {
width: 148px;
display: inline-block;
padding: 0 24px;
font-weight: bold;
flex-shrink: 0; }
+@media(max-width: 800px) {
+ .results .buffer .container .context .message .container .sender {
+ width: initial;
+ padding: 0; } }
+@media(max-width: 800px) {
+ .results .buffer .container .context .message .container .sender:after {
+ content: ": ";
+ margin-right: 8px; } }
.results .buffer .container .context .message .container .preview {
flex: 50%; }
+@media(max-width: 800px) {
+ .results .buffer .container .context .message .container .preview {
+ display: none; } }
.results .buffer .container .context .message .container .preview .irc_highlight {
background-color: rgba(251, 246, 167, 0.5); }
.results .buffer .container .context .message .container .content {
flex: 50%;
overflow: hidden; }
+@media(max-width: 800px) {
+ .results .buffer .container .context .message .container .content {
+ display: inline; } }
.results .buffer .container .context .message .container .content .irc_bold {
font-weight: bold; }
.results .buffer .container .context .message .container .content .irc_italic {
diff --git a/res/css/search.css.map b/res/css/search.css.map
index 2884b0d..970f550 100644
--- a/res/css/search.css.map
+++ b/res/css/search.css.map
@@ -1,6 +1,6 @@
{
"version": 3,
-"mappings": "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",
+"mappings": "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",
"sources": ["icons.sass","font.sass","search.sass","nav.sass","util.sass","content.sass"],
"names": [],
"file": "search.css"
diff --git a/res/css/search.sass b/res/css/search.sass
index 90da180..9157c73 100644
--- a/res/css/search.sass
+++ b/res/css/search.sass
@@ -6,6 +6,7 @@
padding: 0
margin: 0
box-sizing: border-box
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
body
background: #F2F2F2
diff --git a/res/js/component/historyelement.js b/res/js/component/historyelement.js
index b046d1a..2038671 100644
--- a/res/js/component/historyelement.js
+++ b/res/js/component/historyelement.js
@@ -15,5 +15,8 @@ class HistoryElement {
const queryValue = document.createTextNode(this.query);
wrapper.appendChild(queryValue);
this.elem = wrapper;
+ this.elem.addEventListener("click", () => {
+ window.location.href = "#"+encodeURIComponent(this.query);
+ })
}
}
\ No newline at end of file
diff --git a/res/js/component/nav.js b/res/js/component/nav.js
index 3519586..b1e735c 100644
--- a/res/js/component/nav.js
+++ b/res/js/component/nav.js
@@ -14,52 +14,55 @@ class Navigation extends Component {
render() {
const nav = document.createElement("div");
nav.classList.add("nav");
- const wrapper = document.createElement("div");
- wrapper.classList.add("container");
- const searchBar = document.createElement("div");
- searchBar.classList.add("searchBar");
- const searchIcon = document.createElement("div");
- searchIcon.classList.add("icon");
- const searchIconValue = document.createTextNode("search");
- searchIcon.appendChild(searchIconValue);
- searchBar.appendChild(searchIcon);
- const input = document.createElement("input");
- input.classList.add("search");
- input.placeholder = translation.search;
- input.type = "text";
- input.autocomplete = "off";
- input.addEventListener("focus", () => this.elem.classList.add("focus"));
- input.addEventListener("blur", () => this.elem.classList.remove("focus"));
- input.addEventListener("keydown", (e) => {
- switch (e.key || keyMapping[e.keyCode]) {
- case "ArrowUp": {
- this.historyView.navigateLater();
- } break;
- case "ArrowDown": {
- this.historyView.navigateBefore();
- } break;
- case "Enter": {
- this.sendEvent("search", [this.input.value]);
- this.input.blur();
- } break;
- case "Escape": {
- this.input.blur();
- } break;
- }
- });
- searchBar.appendChild(input);
- wrapper.appendChild(searchBar);
- nav.appendChild(wrapper);
- const actions = document.createElement("div");
- actions.classList.add("actions");
- const logout = document.createElement("a");
- logout.title = translation.logout;
- logout.href = "login.php?action=logout";
- logout.classList.add("icon");
- const logoutValue = document.createTextNode("exit_to_app");
- logout.appendChild(logoutValue);
- actions.appendChild(logout);
- nav.appendChild(actions);
+ const bar = document.createElement("div");
+ bar.classList.add("bar");
+ const container = document.createElement("div");
+ container.classList.add("container");
+ const searchBar = document.createElement("div");
+ searchBar.classList.add("searchBar");
+ const searchIcon = document.createElement("div");
+ searchIcon.classList.add("icon");
+ const searchIconValue = document.createTextNode("search");
+ searchIcon.appendChild(searchIconValue);
+ searchBar.appendChild(searchIcon);
+ const input = document.createElement("input");
+ input.classList.add("search");
+ input.placeholder = translation.search;
+ input.type = "text";
+ input.autocomplete = "off";
+ input.addEventListener("focus", () => this.elem.classList.add("focus"));
+ input.addEventListener("blur", () => this.elem.classList.remove("focus"));
+ input.addEventListener("keydown", (e) => {
+ switch (e.key || keyMapping[e.keyCode]) {
+ case "ArrowUp": {
+ this.historyView.navigateLater();
+ } break;
+ case "ArrowDown": {
+ this.historyView.navigateBefore();
+ } break;
+ case "Enter": {
+ this.sendEvent("search", [this.input.value]);
+ this.input.blur();
+ } break;
+ case "Escape": {
+ this.input.blur();
+ } break;
+ }
+ });
+ searchBar.appendChild(input);
+ container.appendChild(searchBar);
+ const actions = document.createElement("div");
+ actions.classList.add("actions");
+ const logout = document.createElement("a");
+ logout.title = translation.logout;
+ logout.href = "login.php?action=logout";
+ logout.classList.add("icon");
+ const logoutValue = document.createTextNode("exit_to_app");
+ logout.appendChild(logoutValue);
+ actions.appendChild(logout);
+ container.appendChild(actions);
+ bar.appendChild(container);
+ nav.appendChild(bar);
const historyView = new HistoryView();
nav.appendChild(historyView.elem);
this.elem = nav;
diff --git a/templates/search.phtml b/templates/search.phtml
index b043bb7..0bf3f6e 100644
--- a/templates/search.phtml
+++ b/templates/search.phtml
@@ -6,9 +6,9 @@
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, width=device-width">
<meta name="apple-mobile-web-app-capable" content="yes"/>
- <meta name="theme-color" content="#4285f4"/>
- <meta name="msapplication-navbutton-color" content="#4285f4">
- <meta name="apple-mobile-web-app-status-bar-style" content="#4285f4">
+ <meta name="theme-color" content="#0271B3"/>
+ <meta name="msapplication-navbutton-color" content="#0271B3">
+ <meta name="apple-mobile-web-app-status-bar-style" content="#0271B3">
<link rel="icon" type="image/png" href="favicon.png">
--
GitLab