framework/ember/app/styles/flarum/composer.less
2015-01-30 13:35:54 +10:30

105 lines
1.6 KiB
Plaintext

// ------------------------------------
// Composer
.composer-container {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: @zindex-navbar-fixed;
pointer-events: none;
.transition(left 0.2s);
.with-pane & {
left: @index-pane-width;
}
}
.composer {
pointer-events: auto;
margin-left: -20px;
margin-right: 180px;
.box-shadow(0 2px 6px rgba(0, 0, 0, 0.25));
border-radius: 4px 4px 0 0;
background: rgba(255, 255, 255, 0.9);
transform: translateZ(0); // Fix for Chrome bug where a transparent white background is actually gray
position: relative;
.transition(~"margin-left 0.2s, margin-right 0.2s, background 0.2s");
.index-index & {
margin-left: 205px;
margin-right: -20px;
}
&.active {
background: #fff;
}
&.minimized {
height: 50px;
cursor: pointer;
}
}
.composer-content {
padding: 20px 20px 15px;
.minimized & {
padding: 10px 20px;
}
}
.composer-handle {
height: 20px;
margin-bottom: -20px;
cursor: row-resize;
position: relative;
.minimized & {
display: none;
}
}
.composer-controls {
position: absolute;
right: 10px;
top: 10px;
}
.composer-avatar {
float: left;
.avatar-size(64px);
.minimized & {
display: none;
}
}
.composer-body {
margin-left: 90px;
& h3 {
margin: 5px 0 10px;
color: @fl-body-muted-color;
font-size: 16px;
font-weight: normal;
}
.minimized & {
margin-left: 0;
}
}
.composer-editor {
& textarea {
background: none;
border-radius: 0;
padding: 0;
margin-bottom: 10px;
height: 200px;
border: 0;
resize: none;
color: @fl-body-color;
font-size: 14px;
line-height: 1.6;
&:focus {
background: none;
}
}
.minimized & {
visibility: hidden;
}
}