Added bullet class and fixed comments

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ (skjnldsv) 2017-09-14 10:03:27 +02:00
parent ce36b13aaf
commit bd520cbfa7
No known key found for this signature in database
GPG Key ID: FB5ACEED51955BF8
1 changed files with 32 additions and 20 deletions

View File

@ -146,11 +146,15 @@ kbd {
} }
} }
/* Submenu fix for icon */ /* Submenu fix for icon */
> a { > .app-navigation-entry-bullet + a,
&[class*='icon-'], > a[class*='icon-'],
&[style*='background-image:'] { > a[style*='background-image:'],
margin-left: -32px; /* 44px padding - 12px padding */ .app-navigation-entry-bullet {
} margin-left: -32px; /* 44px padding - 12px padding */
}
/* Submenu fix for bullet */
> .app-navigation-entry-bullet {
left: -32px;/* 44px padding - 12px padding */
} }
} }
} }
@ -161,6 +165,7 @@ kbd {
position: relative; position: relative;
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
/* Main entry link */
> a { > a {
background-size: 16px 16px; background-size: 16px 16px;
background-position: 14px center; background-position: 14px center;
@ -177,6 +182,7 @@ kbd {
color: $color-main-text; color: $color-main-text;
opacity: .57; opacity: .57;
flex: 1 1 0; flex: 1 1 0;
z-index: 100; /* above the bullet */
/* TODO: forbid using img as icon in menu? */ /* TODO: forbid using img as icon in menu? */
&:first-child img { &:first-child img {
margin-bottom: -3px; margin-bottom: -3px;
@ -185,12 +191,6 @@ kbd {
margin-left: 2px; margin-left: 2px;
} }
/* add padding if an icon is set with a class or an inline style */
&[class*='icon-'],
&[style*='background-image:'] {
padding-left: 44px;
}
/* counter can also be inside the link */ /* counter can also be inside the link */
> .app-navigation-entry-utils { > .app-navigation-entry-utils {
display: inline-block; display: inline-block;
@ -200,6 +200,24 @@ kbd {
} }
} }
} }
/* Bullet icon */
> .app-navigation-entry-bullet {
position: absolute;
display: block;
margin: 16px;
width: 12px;
height: 12px;
border: none;
border-radius: 50%;
cursor: pointer;
}
/* padding in case of icon or bullet */
> .app-navigation-entry-bullet + a,
> a[class*='icon-'],
> a[style*='background-image:'] {
padding-left: 44px;
}
/* popover fix the flex positionning of the li parent */ /* popover fix the flex positionning of the li parent */
> .app-navigation-entry-menu { > .app-navigation-entry-menu {
@ -207,15 +225,9 @@ kbd {
} }
/* show edit/undo field if editing/deleted */ /* show edit/undo field if editing/deleted */
&.editing { &.editing .app-navigation-entry-edit,
.app-navigation-entry-edit { &.deleted .app-navigation-entry-deleted {
transform: translateX(0); transform: translateX(0);
}
}
&.deleted {
.app-navigation-entry-deleted {
transform: translateX(0);
}
} }
} }
} }