214 lines
3.9 KiB
SCSS
214 lines
3.9 KiB
SCSS
.composer-popup-container {
|
|
display: none !important; // can be removed if inline JS CSS is removed from composer-popup
|
|
}
|
|
|
|
.composer-popup {
|
|
display: none !important; // can be removed if inline JS CSS is removed from composer-popup
|
|
}
|
|
|
|
#reply-control {
|
|
z-index: z("mobile-composer");
|
|
.reply-area {
|
|
padding: 0 10px;
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
@media screen and (max-width: 374px) {
|
|
padding: 0 5px;
|
|
}
|
|
flex-grow: 1;
|
|
}
|
|
|
|
&.open {
|
|
height: 250px;
|
|
&.edit-title {
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.keyboard-visible &.open {
|
|
height: calc(var(--composer-vh, 1vh) * 100);
|
|
}
|
|
|
|
.keyboard-visible body.ios-safari-composer-hacks &.open .reply-area {
|
|
padding-bottom: 0px;
|
|
}
|
|
|
|
.reply-to {
|
|
margin: 5px 0;
|
|
.reply-details {
|
|
max-width: calc(100% - 75px);
|
|
}
|
|
|
|
// Protection for languages with long strings on very small screens. This
|
|
// has no effect on most users but we need it for some cases. If this is
|
|
// not added, "add edit reason" will overlap with the composer controls
|
|
@include breakpoint(mobile-small) {
|
|
.reply-details {
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.display-edit-reason {
|
|
margin-top: 0.5em;
|
|
}
|
|
|
|
.composer-controls {
|
|
align-self: flex-start;
|
|
}
|
|
}
|
|
}
|
|
|
|
.toggle-minimize {
|
|
.d-icon-chevron-down {
|
|
vertical-align: text-top;
|
|
}
|
|
}
|
|
|
|
&.draft {
|
|
z-index: z("footer-nav") + 1;
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
|
|
.toggle-toolbar,
|
|
.toggle-minimize {
|
|
top: 8px;
|
|
}
|
|
.draft-text {
|
|
width: calc(100% - 40px);
|
|
@include ellipsis;
|
|
}
|
|
}
|
|
|
|
#reply-title {
|
|
width: calc(100% - 20px);
|
|
}
|
|
|
|
.category-input {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.submit-panel {
|
|
margin-bottom: 5px;
|
|
align-items: baseline;
|
|
.save-or-cancel {
|
|
flex: 1 1 auto;
|
|
#draft-status,
|
|
#file-uploading {
|
|
margin-left: 6px;
|
|
}
|
|
.cancel {
|
|
font-size: 1.4em;
|
|
color: var(--primary-low-mid);
|
|
margin-left: 0.6em;
|
|
padding: 3px 6px;
|
|
}
|
|
}
|
|
.mobile-file-upload:not(.hidden),
|
|
.mobile-preview {
|
|
// Alignment fix, remove if converted to buttons
|
|
display: inline-flex;
|
|
}
|
|
.mobile-file-upload {
|
|
&.hidden + .mobile-preview {
|
|
// Hide preview button while file is uploading to make room for upload progress
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.mobile-preview {
|
|
margin-left: 0.25em;
|
|
}
|
|
}
|
|
|
|
.d-editor-textarea-wrapper {
|
|
width: 100%;
|
|
}
|
|
|
|
&.show-preview {
|
|
.submit-panel {
|
|
padding-top: 10px;
|
|
z-index: z("fullscreen") + 1;
|
|
background-color: var(--secondary);
|
|
.cancel,
|
|
.mobile-file-upload,
|
|
.mobile-preview {
|
|
display: none;
|
|
}
|
|
}
|
|
.d-editor-preview-wrapper {
|
|
position: fixed;
|
|
z-index: z("fullscreen");
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
background-color: var(--secondary);
|
|
border-bottom: 40px solid var(--secondary);
|
|
max-width: 100%;
|
|
margin: 0;
|
|
padding: 10px;
|
|
overflow: auto;
|
|
.d-editor-preview {
|
|
margin-bottom: 40px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.hide-preview {
|
|
.d-editor-preview-wrapper {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.d-editor-button-bar {
|
|
display: none;
|
|
}
|
|
|
|
.toolbar-visible .d-editor-button-bar {
|
|
display: flex;
|
|
}
|
|
|
|
.d-editor-button-bar .btn {
|
|
&.preview {
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
.title-and-category,
|
|
.user-selector {
|
|
margin: 0;
|
|
.users-input {
|
|
margin-bottom: 5px;
|
|
}
|
|
}
|
|
|
|
.with-tags {
|
|
.mini-tag-chooser {
|
|
z-index: z("base");
|
|
}
|
|
|
|
.selected-name {
|
|
.name {
|
|
font-size: $font-down-1;
|
|
.badge-wrapper {
|
|
font-size: $font-0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.user-selector {
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.users-input,
|
|
.add-warning {
|
|
width: 100%;
|
|
}
|
|
|
|
.add-warning {
|
|
margin: 0 0 5px 5px;
|
|
}
|
|
|
|
.whisper {
|
|
margin-right: 5px;
|
|
}
|
|
}
|