92af05d510
We can now simply call `render` whenever we want to show an error or notification message. The flip side is that the template is now larger and contains more login.
103 lines
2.8 KiB
SCSS
103 lines
2.8 KiB
SCSS
#conversejs {
|
|
#controlbox {
|
|
min-width: $controlbox-width;
|
|
width: 200px;
|
|
float: left;
|
|
margin: 0;
|
|
|
|
.toggle-register-login {
|
|
line-height: $line-height-huge;
|
|
}
|
|
|
|
.brand-heading-container {
|
|
text-align: center;
|
|
.brand-heading {
|
|
text-align: center;
|
|
font-size: 600%;
|
|
padding: 0.7em 0 0 0;
|
|
opacity: 0.8;
|
|
color: $blue;
|
|
}
|
|
.brand-subtitle {
|
|
font-size: 90%;
|
|
}
|
|
@media screen and (max-width: $mobile-portrait-length) {
|
|
.brand-heading {
|
|
font-size: 400%;
|
|
}
|
|
}
|
|
}
|
|
|
|
.controlbox-panes {
|
|
background-color: white;
|
|
}
|
|
.controlbox-pane {
|
|
@include calc(height, '100% - #{$controlbox-head-height}');
|
|
}
|
|
&.logged-out {
|
|
@include fade-in;
|
|
width: 100%;
|
|
.box-flyout {
|
|
width: 100%;
|
|
.controlbox-head {
|
|
background-color: white;
|
|
height: 0;
|
|
}
|
|
.controlbox-pane {
|
|
height: auto;
|
|
}
|
|
}
|
|
}
|
|
.box-flyout {
|
|
border: 0;
|
|
min-width: $controlbox-width;
|
|
width: 200px;
|
|
z-index: 1;
|
|
background-color: $controlbox-head-color;
|
|
}
|
|
.controlbox-head {
|
|
height: $controlbox-head-height;
|
|
padding: 6px 0 6px 0;
|
|
margin-top: 0.5em;
|
|
}
|
|
#converse-register, #converse-login {
|
|
margin: 3em 30% 3em 30%;
|
|
.title, .instructions, label {
|
|
margin: 1em 0;
|
|
}
|
|
input[type=submit],
|
|
input[type=button] {
|
|
width: auto;
|
|
}
|
|
input {
|
|
width: 100%;
|
|
margin: 1em 0;
|
|
&.pure-button {
|
|
margin: 1em 0.5em;
|
|
}
|
|
}
|
|
}
|
|
@media screen and (max-width: $mobile-portrait-length) {
|
|
#converse-register,
|
|
#converse-login {
|
|
margin: 3em 10% 3em 10%;
|
|
}
|
|
}
|
|
#controlbox-tabs {
|
|
/* single tab */
|
|
li {
|
|
width: 50%;
|
|
a {
|
|
height: $controlbox-head-height - 1px;
|
|
line-height: $controlbox-head-height - 1px;
|
|
&.current,
|
|
&.current:hover {
|
|
height: $controlbox-head-height;
|
|
}
|
|
font-size: $font-size-large;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|