Consolidate panel container styling
Special case the main panel because it is super speshul. // FREEBIE
This commit is contained in:
parent
6fe9c3f964
commit
1e3e730d88
4 changed files with 32 additions and 24 deletions
|
@ -79,7 +79,7 @@
|
|||
{{> avatar }}
|
||||
</div>
|
||||
<div class='main panel'>
|
||||
<div class='discussion-container container'>
|
||||
<div class='discussion-container'>
|
||||
<div class='bar-container hide'>
|
||||
<div class='bar active progress-bar-striped progress-bar'></div>
|
||||
</div>
|
||||
|
|
|
@ -21,13 +21,25 @@
|
|||
|
||||
.panel {
|
||||
height: calc(100% - #{$header-height});
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
|
||||
.container {
|
||||
padding-top: 20px;
|
||||
max-width: 910px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
.main.panel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: initial;
|
||||
|
||||
.discussion-container {
|
||||
flex-grow: 1;
|
||||
position: relative;
|
||||
padding-top: 20px;
|
||||
max-width: 100%;
|
||||
margin: 0;
|
||||
|
||||
.bar-container {
|
||||
height: 5px;
|
||||
|
@ -47,9 +59,6 @@
|
|||
}
|
||||
|
||||
.key-verification {
|
||||
&.panel {
|
||||
padding: 20px 10px;
|
||||
}
|
||||
|
||||
.key, .placeholder {
|
||||
padding: 0 1em;
|
||||
|
@ -70,11 +79,6 @@
|
|||
}
|
||||
|
||||
.message-detail {
|
||||
& > .container > * {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.key-conflict-dialogue {
|
||||
background: #F3F3A7;
|
||||
border-radius: 5px;
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
height: 100%;
|
||||
}
|
||||
|
||||
.container, .scrollable {
|
||||
.scrollable {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
|
@ -432,7 +432,7 @@ input[type=text]:active, input[type=text]:focus, input[type=search]:active, inpu
|
|||
.new-conversation, .inbox, .gutter {
|
||||
height: 100%; }
|
||||
|
||||
.container, .scrollable {
|
||||
.scrollable {
|
||||
height: 100%;
|
||||
overflow: auto; }
|
||||
|
||||
|
@ -640,15 +640,24 @@ input.search {
|
|||
height: 100%; }
|
||||
.conversation .panel {
|
||||
height: calc(100% - 64px);
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
overflow-y: auto; }
|
||||
.conversation .panel .container {
|
||||
padding-top: 20px;
|
||||
max-width: 910px;
|
||||
margin: 0 auto;
|
||||
padding: 20px; }
|
||||
.conversation .main.panel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: initial; }
|
||||
.conversation .main.panel .discussion-container {
|
||||
flex-grow: 1;
|
||||
position: relative;
|
||||
padding-top: 20px; }
|
||||
.conversation .panel .container .bar-container {
|
||||
max-width: 100%;
|
||||
margin: 0; }
|
||||
.conversation .main.panel .discussion-container .bar-container {
|
||||
height: 5px; }
|
||||
.conversation .panel .container .message-list {
|
||||
.conversation .main.panel .discussion-container .message-list {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
|
@ -657,8 +666,6 @@ input.search {
|
|||
padding: 2em 20px 0;
|
||||
overflow-y: auto; }
|
||||
|
||||
.key-verification.panel {
|
||||
padding: 20px 10px; }
|
||||
.key-verification .key, .key-verification .placeholder {
|
||||
padding: 0 1em;
|
||||
-webkit-user-select: text; }
|
||||
|
@ -673,9 +680,6 @@ input.search {
|
|||
.key-verification .placeholder {
|
||||
font-weight: bold; }
|
||||
|
||||
.message-detail > .container > * {
|
||||
max-width: 800px;
|
||||
margin: 0 auto; }
|
||||
.message-detail .key-conflict-dialogue {
|
||||
background: #F3F3A7;
|
||||
border-radius: 5px;
|
||||
|
|
Loading…
Reference in a new issue