Skip to content
More
Share
Explore
TIP - PACKAGE::ANGULAR
**Bootstrap
*Custom dropdown
<div class="list-item-option">
<div ngbDropdown #myDrop="ngbDropdown" autoClose="true">
<button class="btn btn-gray btn-toggle rounded-circle option" ngbDropdownToggle>
<span class="kf-option"></span>
</button>
<div class="icon-expand"></div>
<div ngbDropdownMenu>
<button ngbDropdownItem>expand</button>
<button ngbDropdownItem>delete</button>
</div>
</div>
</div>
&-option {
.dropdown {
&.show {
& .icon-expand {
display: block;
}
}
.dropdown-toggle {
&::after {
display: none;
}
}
.dropdown-menu {
top: 0.5rem !important;
background-color: #2D303A;
text-align: center;
& .dropdown-item {
color: white;
background-color: transparent;
outline: none;
&:hover {
background-color: #4f5159;
}
}
}
}
.icon-expand {
display: none;
position: absolute;
top: 3rem;
right: 0.2rem;
height: 1rem;
width: 1rem;
transform: translateX(-50%) rotate(45deg);
background-color: #2D303A;
}
}
Want to print your doc?
This is not the way.
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.