Commit 8508be74 authored by Kjel Delaey's avatar Kjel Delaey

Style inline event items with titles containing long words properly..

On a tablet in portrait mode with a width of 768px the event-title isn't
aligned properly when the title contains a long string. This also
happens when resizing your browser viewport on a desktop.

Example string:
Administrator pushed new branch feature-branch-with-a-very-long-name at
Gitlab Org / Gitlab Test

In the UI it would look like the example below:

----------
|        |
| AVATAR |                                                                          less than a minute ago
|        |
----------
           Administrator pushed new branch feature-branch-with-a-very-long-name at...
parent 6d91ee00
...@@ -11,9 +11,12 @@ ...@@ -11,9 +11,12 @@
color: #7f8fa4; color: #7f8fa4;
&.event-inline { &.event-inline {
padding-left: $gl-padding + $gl-avatar-size;
.avatar { .avatar {
position: relative; position: relative;
top: -2px; top: -2px;
margin-left: -$gl-avatar-size;
} }
.event-title { .event-title {
...@@ -155,6 +158,10 @@ ...@@ -155,6 +158,10 @@
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
.event-item { .event-item {
&.event-inline {
padding-left: $gl-padding;
}
.event-title { .event-title {
white-space: normal; white-space: normal;
overflow: visible; overflow: visible;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment