open-consul/ui-v2/app/styles/components/action-group/layout.scss
John Cowen 81f209d71e UI: ACL Roles (#5635)
Adds support for ACL Roles and Service Identities CRUD, along with necessary changes to Tokens, and the CSS improvements required.

Also includes refinements/improvements for easier testing of deeply nested components.

1. ember-data adapter/serializer/model triplet for Roles
2. repository, form/validations and searching filter for Roles
3. Moves potentially, repeated, or soon to to repeated functionality
into a mixin (mainly for 'many policy' relationships)
4. A few styling tweaks for little edge cases around roles
5. Router additions, Route, Controller and templates for Roles

Also see: 

* UI: ACL Roles cont. plus Service Identities (#5661 and #5720)
2019-05-01 18:22:37 +00:00

73 lines
1.3 KiB
SCSS

%action-group label span {
display: none;
}
%action-group-action {
width: 170px;
padding: 10px 10px;
text-align: left;
}
%action-group li > * {
@extend %action-group-action;
}
%action-group {
width: 30px;
height: 30px;
position: absolute;
top: 8px;
right: 3px;
}
%action-group label {
display: block;
height: 100%;
}
%action-group label:last-of-type {
position: absolute;
width: 100%;
z-index: -1;
top: 0;
}
/* this is actually the group */
%action-group ul {
position: absolute;
right: 0px;
padding: 1px;
}
%action-group ul::before {
position: absolute;
right: 9px;
content: '';
display: block;
width: 10px;
height: 10px;
}
%action-group ul:not(.above) {
top: 35px;
}
%action-group ul:not(.above)::before {
top: -6px;
transform: rotate(45deg);
}
%action-group ul.above {
bottom: 35px;
}
%action-group ul.above::before {
bottom: -6px;
transform: rotate(225deg);
}
%action-group li {
position: relative;
z-index: 1;
}
%action-group input[type='radio'],
%action-group input[type='radio'] ~ ul,
%action-group input[type='radio'] ~ .with-confirmation > ul {
display: none;
}
%action-group input[type='radio']:checked ~ ul,
%action-group input[type='radio']:checked ~ .with-confirmation > ul {
display: block;
}
%action-group input[type='radio']:checked ~ label[for='actions_close'] {
z-index: 1;
}