opensource/grafana
1
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-09-29 04:24:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

removed border, cleaned up css and fixed class naming

Browse Source
This commit is contained in:
Patrick O'Carroll
2018-09-24 12:49:29 +02:00
parent c1d36f9e48
commit daffa7d067
2 changed files with 21 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
public/app/features/org/partials/orgUsers.html
View File

@ -8,14 +8,14 @@
</label>
<div ng-if="ctrl.pendingInvites.length" style="margin-left: 1rem">
<button class="btn toggle-btn-left toggle-btn-left--active" ng-if="!ctrl.showInvites">
<button class="btn toggle-btn active" ng-if="!ctrl.showInvites">
Users
</button><button class="btn toggle-btn-right toggle-btn-right--inactive" ng-if="!ctrl.showInvites" ng-click="ctrl.showInvites = true">
</button><button class="btn toggle-btn" ng-if="!ctrl.showInvites" ng-click="ctrl.showInvites = true">
Pending Invites ({{ctrl.pendingInvites.length}})
</button>
<button class="btn toggle-btn-left toggle-btn-left--inactive" ng-if="ctrl.showInvites" ng-click="ctrl.showInvites = false">
<button class="btn toggle-btn" ng-if="ctrl.showInvites" ng-click="ctrl.showInvites = false">
Users
</button><button class="btn toggle-btn-right toggle-btn-right--active" ng-if="ctrl.showInvites">
</button><button class="btn toggle-btn active" ng-if="ctrl.showInvites">
Pending Invites ({{ctrl.pendingInvites.length}})
</button>
</div>

61
public/sass/components/_buttons.scss
View File

@ -224,51 +224,24 @@ $btn-service-icon-width: 35px;
//Toggle button
.toggle-btn {
&-left {
border-radius: 2px 0 0 2px;
border-left: 1px solid #dae0e8;
border-top: 1px solid #dae0e8;
border-bottom: 1px solid #dae0e8;
margin: 0;
box-shadow: $card-shadow;
&--active {
background-color: #fff;
//background-color: $btn-secondary-bg;
//color: #fff;
background-color: lighten($input-label-bg, 5%);
color: $link-color;
&:hover {
cursor: default;
}
}
&--inactive {
//@include buttonBackground($btn-inverse-bg, $btn-inverse-bg-hl, $btn-inverse-text-color, $btn-inverse-text-shadow);
background: $input-label-bg;
color: $text-color-weak;
}
}
&-right {
border-radius: 0 2px 2px 0;
border-right: 1px solid #dae0e8;
border-top: 1px solid #dae0e8;
border-bottom: 1px solid #dae0e8;
margin-left: 0 !important;
box-shadow: $card-shadow;
background: $input-label-bg;
color: $text-color-weak;
box-shadow: $card-shadow;
&--active {
background-color: #fff;
//background-color: $btn-secondary-bg;
//color: #FFF;
background-color: lighten($input-label-bg, 5%);
color: $link-color;
&:hover {
cursor: default;
}
}
&--inactive {
//@include buttonBackground($btn-inverse-bg, $btn-inverse-bg-hl, $btn-inverse-text-color, $btn-inverse-text-shadow);
background: $input-label-bg;
color: $text-color-weak;
&:nth-child(1) {
border-radius: 2px 0 0 2px;
margin: 0;
}
&:nth-child(2) {
border-radius: 0 2px 2px 0;
margin-left: 0 !important;
}
&.active {
background-color: lighten($input-label-bg, 5%);
color: $link-color;
&:hover {
cursor: default;
}
}
}