We only want to render the account link and login items in the header. And we want only render the Multitenancy and Administrators sections in the admin sidebar. We include the administrators management so it's possible to give permissions to other users to manage tenants. In order to restrict access to other sections by typing the URL or following a link, we're only enabling the rest of the routes when we aren't in the multitenancy management mode.
188 lines
3.3 KiB
SCSS
188 lines
3.3 KiB
SCSS
.admin-sidebar {
|
|
@include background-with-text-contrast($sidebar);
|
|
background: linear-gradient(to bottom, $sidebar 0%, #488fb5 100%);
|
|
border-right: 1px solid $border;
|
|
|
|
ul {
|
|
list-style-type: none;
|
|
margin-bottom: 0;
|
|
padding: 0;
|
|
margin-#{$global-left}: 0;
|
|
}
|
|
|
|
> ul > li > :first-child {
|
|
display: flex;
|
|
font-weight: bold;
|
|
|
|
&::before,
|
|
&::after {
|
|
flex: 1em 0 0;
|
|
margin-top: 0.1em;
|
|
}
|
|
|
|
@mixin icon($name, $style) {
|
|
@include has-fa-icon($name, $style);
|
|
|
|
&::before {
|
|
@extend %admin-menu-icon;
|
|
}
|
|
}
|
|
|
|
&.booths-link {
|
|
@include icon(archive, solid);
|
|
}
|
|
|
|
&.budgets-link,
|
|
&.investments-link,
|
|
&.budget-investments-link {
|
|
@include icon(chart-pie, solid);
|
|
}
|
|
|
|
&.comments-link {
|
|
@include icon(comments, regular);
|
|
}
|
|
|
|
&.dashboard-link {
|
|
@include icon(check, solid);
|
|
}
|
|
|
|
&.debates-link {
|
|
@include icon(comment-alt, solid);
|
|
}
|
|
|
|
&.invitations-link {
|
|
@include icon(envelope, regular);
|
|
}
|
|
|
|
&.legislation-link,
|
|
&.legislation-proposals-link,
|
|
&.legislation-processes-link {
|
|
@include icon(file-alt, solid);
|
|
}
|
|
|
|
&.messages-link {
|
|
@include icon(file-archive, regular);
|
|
}
|
|
|
|
&.moderated-content-link {
|
|
@include icon(eye, regular);
|
|
}
|
|
|
|
&.polls-link {
|
|
@include icon(check-circle, regular);
|
|
}
|
|
|
|
&.print-proposals-link,
|
|
&.print-investments-link {
|
|
@include icon(print, solid);
|
|
}
|
|
|
|
&.profiles-link {
|
|
@include icon(users, solid);
|
|
}
|
|
|
|
&.proposals-link,
|
|
&.proposal-notifications-link {
|
|
@include icon(lightbulb, solid);
|
|
}
|
|
|
|
&.settings-link {
|
|
@include icon(cog, solid);
|
|
}
|
|
|
|
&.signature-sheets-link {
|
|
@include icon(file-alt, regular);
|
|
}
|
|
|
|
&.site-customization-link {
|
|
@include icon(pencil-alt, solid);
|
|
}
|
|
|
|
&.stats-link {
|
|
@include icon(chart-line, solid);
|
|
}
|
|
|
|
&.users-link {
|
|
@include icon(user, solid);
|
|
}
|
|
|
|
&.ml-link {
|
|
@include icon(brain, solid);
|
|
}
|
|
|
|
&.administrators-link {
|
|
@include icon(user, solid);
|
|
}
|
|
|
|
&.tenants-link {
|
|
@include icon(building, regular);
|
|
}
|
|
}
|
|
|
|
li {
|
|
ul {
|
|
border-left: 1px solid $sidebar-hover;
|
|
margin-left: calc(#{$line-height * 2} / 3);
|
|
padding-left: calc(#{$line-height} / 2);
|
|
}
|
|
|
|
&.is-active a,
|
|
&[aria-current] a {
|
|
background: $sidebar-hover;
|
|
border-left: 2px solid $sidebar-active;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
li > :first-child {
|
|
color: inherit;
|
|
display: block;
|
|
padding: calc(#{$line-height} / 2);
|
|
vertical-align: top;
|
|
|
|
&:hover {
|
|
background: $sidebar-hover;
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
|
|
[aria-expanded] {
|
|
@include has-fa-icon(chevron-down, solid, after);
|
|
line-height: inherit;
|
|
text-align: inherit;
|
|
width: 100%;
|
|
|
|
&::after {
|
|
margin-#{$global-left}: auto;
|
|
transition: 0.25s;
|
|
}
|
|
|
|
&:not([disabled]) {
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
[aria-expanded="true"]::after {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
ul ul {
|
|
border-bottom: 0;
|
|
margin-left: $line-height;
|
|
|
|
li:first-child {
|
|
padding-top: calc(#{$line-height} / 2);
|
|
}
|
|
|
|
li:last-child {
|
|
padding-bottom: calc(#{$line-height} / 2);
|
|
}
|
|
|
|
a {
|
|
font-weight: normal;
|
|
margin-#{$global-right}: 0;
|
|
}
|
|
}
|
|
}
|