Responsive improvements
This commit is contained in:
parent
e74fe04d07
commit
73407fa904
|
@ -2,6 +2,7 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<!-- Favicon as generated by realfavicongenerator.net (slightly modified for webpack) -->
|
<!-- Favicon as generated by realfavicongenerator.net (slightly modified for webpack) -->
|
||||||
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png">
|
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png">
|
||||||
<link rel="icon" type="image/png" href="favicon/favicon-32x32.png" sizes="32x32">
|
<link rel="icon" type="image/png" href="favicon/favicon-32x32.png" sizes="32x32">
|
||||||
|
|
|
@ -537,3 +537,49 @@ form {
|
||||||
.minimal .user-status {
|
.minimal .user-status {
|
||||||
height: 19px;
|
height: 19px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Mobile view */
|
||||||
|
|
||||||
|
@media only screen and (max-width: 600px) {
|
||||||
|
|
||||||
|
.toolbar-horizontal ~ .channel-root-container, .toolbar-vertical ~ .channel-root-container {
|
||||||
|
height:calc(100% - 440px);
|
||||||
|
position:static;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-horizontal ~ .chat, .toolbar-vertical ~ .chat {
|
||||||
|
position:fixed;
|
||||||
|
bottom: 60px;
|
||||||
|
left:0;
|
||||||
|
width:100%;
|
||||||
|
height:330px;
|
||||||
|
y-overflow:auto;
|
||||||
|
font-size:0.8em;
|
||||||
|
z-index:10;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-vertical {
|
||||||
|
flex-direction: row;
|
||||||
|
height: 36px;
|
||||||
|
margin-top: 4px;
|
||||||
|
margin-left: 1%;
|
||||||
|
padding-left: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#message-box {
|
||||||
|
margin: 10px 5px 10px 5px;
|
||||||
|
padding: 10px;
|
||||||
|
height: 2em;
|
||||||
|
font-size: 1.2em;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.handle-vertical, .handle-horizontal {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dialog {
|
||||||
|
min-width: 350px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in a new issue