PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Show placeholder for empty slot in breadcrumbs

Browse source
This commit is contained in:
Bruno Windels 2019-09-12 14:42:27 +02:00
parent ab6215f9aa
commit df8ce7fb33
3 changed files with 17 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
res/css/views/rooms/_RoomBreadcrumbs.scss
View file

@ -22,6 +22,19 @@ limitations under the License.
display: flex; display: flex;
flex-direction: row; flex-direction: row;
// repeating circles as empty placeholders
background:
radial-gradient(
circle at center,
$breadcrumb-placeholder-bg-color,
$breadcrumb-placeholder-bg-color 15px,
transparent 16px
);
background-size: 36px;
background-position: 6px -1px;
background-repeat: repeat-x;
// Autohide the scrollbar // Autohide the scrollbar
overflow-x: hidden; overflow-x: hidden;
&:hover { &:hover {

2
res/themes/dark/css/_dark.scss
View file

@ -170,6 +170,8 @@ $tooltip-timeline-fg-color: #ffffff;
$interactive-tooltip-bg-color: $base-color; $interactive-tooltip-bg-color: $base-color;
$interactive-tooltip-fg-color: #ffffff; $interactive-tooltip-fg-color: #ffffff;
$breadcrumb-placeholder-bg-color: #272c35;
// ***** Mixins! ***** // ***** Mixins! *****
@define-mixin mx_DialogButton { @define-mixin mx_DialogButton {

2
res/themes/light/css/_light.scss
View file

@ -288,6 +288,8 @@ $tooltip-timeline-fg-color: #ffffff;
$interactive-tooltip-bg-color: #27303a; $interactive-tooltip-bg-color: #27303a;
$interactive-tooltip-fg-color: #ffffff; $interactive-tooltip-fg-color: #ffffff;
$breadcrumb-placeholder-bg-color: #e8eef5;
// ***** Mixins! ***** // ***** Mixins! *****
@define-mixin mx_DialogButton { @define-mixin mx_DialogButton {