Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2025-12-20 09:20:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(buttons): buttons responsive

Browse source
This commit is contained in:
Mikhail Hryb 2017-09-18 11:27:40 +03:00 • committed by KostyaDanovsky
parent b1a0024a27
commit 1c4c964e25
5 changed files with 93 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

65
src/app/pages/ui-features/buttons/buttons.component.scss
View file

@ -68,7 +68,12 @@
.icon-buttons .icon-button-examples {
display: flex;
justify-content: space-between;
justify-content: flex-start;
button {
margin-right: 2rem;
min-width: 4rem;
}
}
.icon-buttons .icon-button-examples:not(:last-child) {
@ -76,12 +81,58 @@
}
}
@include media-breakpoint-down(xs) {
@include media-breakpoint-down(xxxl) {
ngx-default-buttons /deep/ nb-card-header {
flex-direction: column;
margin-bottom: 0.5rem;
}
}
@include media-breakpoint-down(sm) {
ngx-action-groups /deep/ nb-card-body {
flex-direction: column;
align-items: flex-start;
padding: 0.75rem;
.action-groups-header {
margin: 0 0 0.5rem 0.25rem;
}
}
}
@include media-breakpoint-down(is) {
ngx-action-groups /deep/ nb-card-body {
nb-action {
padding: 0.75rem;
}
.control-icon, .start-search {
font-size: 1.75rem;
}
.user-container {
font-size: 1rem;
}
.user-picture {
height: 1.75rem;
width: 1.75rem;
}
}
}
@include media-breakpoint-down(xs) {
/deep/.icon-buttons .icon-button-examples {
button {
margin-right: 1rem;
}
}
ngx-action-groups /deep/ nb-card-body {
nb-action {
padding: 0.5rem;
}
@ -98,10 +149,6 @@
height: 1.5rem;
width: 1.5rem;
}
.action-groups-header {
margin: 0 0 0.5rem 0.25rem;
}
}
ngx-labeled-actions-group /deep/ nb-card-body {
@ -113,5 +160,11 @@
flex-direction: column;
margin-bottom: 0.5rem;
}
ngx-block-level-buttons /deep/ {
.btn-primary {
padding: 0.75rem 1rem;
}
}
}
}