PLT-3418, PLT-2950, PLT-3375, PLT-3382, PLT-3446, PLT-3465: Multiple UI Improvements (#3449)
Improving help text margins Updating changes for get link and create post files Fixing icon for select team screen Fixing styles for select team button Adding improvements to posts UI Adding improvement to post layout Updating changes for post controls Updating z-index for sidebar--right Updating help text position Fixing code for posts Fixing css for post view Pushing improvements for posts view Updating changes for post view Updating post layout Fixing system time css Updating header for system posts Updating post css Removing opacity and changing color for system messages Simplifying root post and system post behaviour Removing images from compact view Updating help text for display Updating embed preview text for advanced option PLT-3490 - Fixing RHS issue on Edge
Этот коммит содержится в:
Asaad Mahmood
коммит произвёл
Joram Wilander
Joram Wilander
родитель
f4dd8e5796
Коммит
f91b9d4a65
@@ -97,8 +97,10 @@
|
||||
|
||||
.header-dropdown__icon {
|
||||
color: inherit;
|
||||
font-size: 11px;
|
||||
top: 3px;
|
||||
font-size: 12px;
|
||||
margin-left: 1px;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.channel-header__info {
|
||||
|
||||
@@ -46,8 +46,10 @@
|
||||
width: 21px;
|
||||
}
|
||||
|
||||
.glyphicon-search {
|
||||
top: -1px;
|
||||
.icon-search {
|
||||
font-size: 17px;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
.icon--white {
|
||||
@@ -80,7 +82,8 @@
|
||||
}
|
||||
|
||||
.header-dropdown__icon {
|
||||
top: 1px;
|
||||
margin-left: 0;
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
.dropdown-toggle {
|
||||
|
||||
@@ -1,152 +1,156 @@
|
||||
@charset 'UTF-8';
|
||||
|
||||
.post-right__container {
|
||||
@include display-flex;
|
||||
@include flex-direction(column);
|
||||
height: 100%;
|
||||
.app__body {
|
||||
.post-right__container {
|
||||
@include display-flex;
|
||||
@include flex-direction(column);
|
||||
height: 100%;
|
||||
|
||||
.post-right-root-message {
|
||||
padding: 1em 1em 0;
|
||||
}
|
||||
.post-right-root-message {
|
||||
padding: 1em 1em 0;
|
||||
}
|
||||
|
||||
.post-right-comments-container {
|
||||
position: relative;
|
||||
.post-right-comments-container {
|
||||
position: relative;
|
||||
|
||||
.post {
|
||||
&:first-child {
|
||||
padding-top: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.help_format_text {
|
||||
bottom: -63px;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.post {
|
||||
&:first-child {
|
||||
padding-top: 15px;
|
||||
&.post--root {
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding-bottom: 1em;
|
||||
|
||||
.post__body {
|
||||
background: transparent !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.help_format_text {
|
||||
bottom: -63px;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.post {
|
||||
&.post--root {
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding-bottom: 1em;
|
||||
.post__header {
|
||||
.col__reply {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
text-align: right;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.post__body {
|
||||
background: transparent !important;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.post__header {
|
||||
.col__reply {
|
||||
text-align: right;
|
||||
top: 0;
|
||||
}
|
||||
hr {
|
||||
border: none;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.post__body {
|
||||
.post-create__container {
|
||||
width: 100%;
|
||||
|
||||
.textarea-wrapper {
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-textarea {
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.msg-typing {
|
||||
@include opacity(.7);
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 13px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin-top: 3px;
|
||||
max-width: 230px;
|
||||
min-width: 1px;
|
||||
}
|
||||
|
||||
.post-create-footer {
|
||||
padding: 5px 0 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.post-right-comments-upload-in-progress {
|
||||
color: #a8adb7;
|
||||
margin-right: 10px;
|
||||
padding: 6px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
border: none;
|
||||
margin-bottom: 0;
|
||||
.post-right-header {
|
||||
border-bottom: $border-gray;
|
||||
color: #999;
|
||||
font-size: 1em;
|
||||
font-weight: 400;
|
||||
height: 39px;
|
||||
padding: 10px 10px 0 15px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.post-create__container {
|
||||
.post-right-root-container {
|
||||
border-bottom: $border-gray;
|
||||
padding: 5px 10px;
|
||||
|
||||
ul {
|
||||
margin-bottom: 2px;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.post-right-channel__name {
|
||||
font-weight: 600;
|
||||
margin: 0 0 15px;
|
||||
}
|
||||
|
||||
.post-right-root-container li {
|
||||
display: inline;
|
||||
list-style-type: none;
|
||||
padding-right: 3px;
|
||||
}
|
||||
|
||||
.post-right-root-time {
|
||||
color: #a8adb7;
|
||||
}
|
||||
|
||||
.post-right-create-comment-container {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
margin-bottom: 18px;
|
||||
padding: 5px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.textarea-wrapper {
|
||||
min-height: 100px;
|
||||
}
|
||||
.post-right__scroll {
|
||||
@include flex(1 1 auto);
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
|
||||
.btn {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.custom-textarea {
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.msg-typing {
|
||||
@include opacity(.7);
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 13px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin-top: 3px;
|
||||
max-width: 230px;
|
||||
min-width: 1px;
|
||||
}
|
||||
|
||||
.post-create-footer {
|
||||
padding: 5px 0 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.post-right-comments-upload-in-progress {
|
||||
color: #a8adb7;
|
||||
margin-right: 10px;
|
||||
padding: 6px 0;
|
||||
.file-preview__container {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-right-header {
|
||||
border-bottom: $border-gray;
|
||||
color: #999;
|
||||
font-size: 1em;
|
||||
font-weight: 400;
|
||||
height: 39px;
|
||||
padding: 10px 10px 0 15px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.post-right-root-container {
|
||||
border-bottom: $border-gray;
|
||||
padding: 5px 10px;
|
||||
|
||||
ul {
|
||||
margin-bottom: 2px;
|
||||
padding-left: 0;
|
||||
.post-right-comment-time {
|
||||
color: #a8adb7;
|
||||
}
|
||||
}
|
||||
|
||||
.post-right-channel__name {
|
||||
font-weight: 600;
|
||||
margin: 0 0 15px;
|
||||
}
|
||||
|
||||
.post-right-root-container li {
|
||||
display: inline;
|
||||
list-style-type: none;
|
||||
padding-right: 3px;
|
||||
}
|
||||
|
||||
.post-right-root-time {
|
||||
color: #a8adb7;
|
||||
}
|
||||
|
||||
.post-right-create-comment-container {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
margin-bottom: 18px;
|
||||
padding: 5px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.post-right__scroll {
|
||||
@include flex(1 1 auto);
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
|
||||
.file-preview__container {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.post-right-comment-time {
|
||||
color: #a8adb7;
|
||||
}
|
||||
|
||||
@@ -86,8 +86,19 @@ body.ios {
|
||||
|
||||
b,
|
||||
i,
|
||||
span {
|
||||
margin: 0 2px;
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
b {
|
||||
@include opacity(.9);
|
||||
}
|
||||
|
||||
code {
|
||||
margin-right: 3px;
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.textbox-preview-link {
|
||||
@@ -402,6 +413,11 @@ body.ios {
|
||||
right: 0;
|
||||
top: 1px;
|
||||
|
||||
svg {
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
@include opacity(.9);
|
||||
@@ -452,7 +468,7 @@ body.ios {
|
||||
|
||||
.dropdown-menu {
|
||||
&.bottom {
|
||||
bottom: 25px;
|
||||
bottom: 19px;
|
||||
top: auto;
|
||||
}
|
||||
}
|
||||
@@ -483,6 +499,14 @@ body.ios {
|
||||
background-color: beige;
|
||||
}
|
||||
|
||||
&.post--hide-controls {
|
||||
.post__header {
|
||||
.col__reply {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.post--compact {
|
||||
&.post--thread {
|
||||
.post__header {
|
||||
@@ -557,6 +581,16 @@ body.ios {
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
|
||||
svg {
|
||||
display: inline-block;
|
||||
height: 13px;
|
||||
margin: 5px 4px 0 0;
|
||||
opacity: .5;
|
||||
position: relative;
|
||||
vertical-align: top;
|
||||
width: 13px;
|
||||
}
|
||||
|
||||
> div {
|
||||
display: none;
|
||||
}
|
||||
@@ -596,6 +630,10 @@ body.ios {
|
||||
}
|
||||
}
|
||||
|
||||
.post--fail {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: .97em;
|
||||
line-height: 1.6em;
|
||||
@@ -634,33 +672,6 @@ body.ios {
|
||||
&.same--user {
|
||||
padding: 0 .5em 0 1em;
|
||||
|
||||
&.post--system {
|
||||
padding: 8px .5em 0 1em;
|
||||
|
||||
.post__header {
|
||||
height: auto;
|
||||
margin-bottom: 2px;
|
||||
|
||||
.col__name {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.col__reply {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.post__time {
|
||||
@include opacity(.6);
|
||||
font-size: .9em;
|
||||
left: inherit;
|
||||
line-height: inherit;
|
||||
position: inherit;
|
||||
text-rendering: inherit;
|
||||
top: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.post__time {
|
||||
@include opacity(.5);
|
||||
@@ -682,7 +693,7 @@ body.ios {
|
||||
}
|
||||
|
||||
.col__reply {
|
||||
top: 6px;
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -721,7 +732,7 @@ body.ios {
|
||||
|
||||
.post__header {
|
||||
.col__reply {
|
||||
top: 53px;
|
||||
top: -4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -775,11 +786,14 @@ body.ios {
|
||||
}
|
||||
|
||||
.col__reply {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 2px;
|
||||
min-width: 70px;
|
||||
padding: 2px 5px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 30px;
|
||||
top: -4px;
|
||||
white-space: nowrap;
|
||||
width: 65px;
|
||||
}
|
||||
|
||||
.permalink-popover {
|
||||
@@ -841,6 +855,7 @@ body.ios {
|
||||
min-width: 130px;
|
||||
padding: 2px 0;
|
||||
right: 0;
|
||||
top: 20px;
|
||||
|
||||
li {
|
||||
display: block;
|
||||
@@ -864,15 +879,15 @@ body.ios {
|
||||
@include opacity(.5);
|
||||
color: inherit;
|
||||
display: inline-block;
|
||||
float: right;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
position: relative;
|
||||
right: 15px;
|
||||
right: -10px;
|
||||
text-decoration: none;
|
||||
top: -5px;
|
||||
vertical-align: top;
|
||||
visibility: hidden;
|
||||
width: 20px;
|
||||
@@ -885,9 +900,8 @@ body.ios {
|
||||
.post__body {
|
||||
@include legacy-pie-clearfix;
|
||||
padding: .2em .5em;
|
||||
width: calc(100% - 75px);
|
||||
width: 100%;
|
||||
word-wrap: break-word;
|
||||
position: relative;
|
||||
|
||||
p {
|
||||
margin: 0 0 .4em;
|
||||
@@ -1013,12 +1027,8 @@ body.ios {
|
||||
}
|
||||
|
||||
.post__time {
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.post__time,
|
||||
&.post--system .post__body {
|
||||
@include opacity(.6);
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.post-loading-gif {
|
||||
|
||||
Ссылка в новой задаче
Block a user