FGFS-4.1/phpvms
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Button styling

Browse Source
This commit is contained in:
Nabeel Shahzad
2018-01-01 17:00:40 -06:00
parent dd400806ee
commit d4f69bee2a
7 changed files with 1650 additions and 827 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1098
public/assets/admin/css/vendor.min.css vendored
View File

File diff suppressed because one or more lines are too long

1098
public/assets/admin/vendor/paper-dashboard.css vendored
View File

File diff suppressed because one or more lines are too long

4
public/assets/admin/vendor/sass/paper/_buttons.scss vendored
View File

@@ -1,8 +1,8 @@
.btn, .btn,
.navbar .navbar-nav > li > a.btn{ .navbar .navbar-nav > li > a.btn{
border-radius: $border-radius-btn-base; //border-radius: $border-radius-btn-base;
box-sizing: border-box; box-sizing: border-box;
border-width: $border-thick; //border-width: $border-thick;
background-color: $transparent-bg; background-color: $transparent-bg;
font-size: $font-size-base; font-size: $font-size-base;
font-weight: $font-weight-semi; font-weight: $font-weight-semi;

26
public/assets/admin/vendor/sass/paper/_cards.scss vendored
View File

@@ -1,4 +1,4 @@
.card{ .card {
border: 0; border: 0;
border-radius: $border-radius-extreme; border-radius: $border-radius-extreme;
box-shadow: 0 2px 2px rgba(204, 197, 185, 0.5); box-shadow: 0 2px 2px rgba(204, 197, 185, 0.5);
@@ -174,6 +174,30 @@
} }
} }
} }
.btn-primary {
@include btn-styles($primary-color, $primary-states-color);
}
.btn-success {
@include btn-styles($success-color, $success-states-color);
}
.btn-info {
@include btn-styles($info-color, $info-states-color);
}
.btn-warning {
@include btn-styles($warning-color, $warning-states-color);
}
.btn-danger {
@include btn-styles($danger-color, $danger-states-color);
}
.btn-neutral {
@include btn-styles($white-color, $white-color);
}
} }
.card-user{ .card-user{
.image{ .image{

58
public/assets/admin/vendor/sass/paper/_variables.scss vendored
View File

@@ -33,8 +33,8 @@ $medium-gray: #DDDDDD !default;
$dark-gray: #9A9A9A !default; $dark-gray: #9A9A9A !default;
$gray-input-bg: #fffcf5 !default; $gray-input-bg: #fffcf5 !default;
$danger-input-bg: #FFC0A4 !default; $danger-input-bg: #fffcf5 !default;
$success-input-bg: #ABF3CB !default; $success-input-bg: #fffcf5 !default;
$other-medium-gray: #A49E93 !default; $other-medium-gray: #A49E93 !default;
$transparent-bg: transparent !default; $transparent-bg: transparent !default;
@@ -42,27 +42,59 @@ $default-color: #2f2d2a !default; //#66615B !default;
$default-bg: #66615B !default; $default-bg: #66615B !default;
$default-states-color: #403D39 !default; $default-states-color: #403D39 !default;
$primary-color: #7A9E9F !default; //$primary-color: #7A9E9F !default;
$primary-bg: #7A9E9F !default; $primary-color: #f96332 !default;
$primary-bg: darken($primary-color, 5%) !default;
$primary-states-color: #427C89 !default; $primary-states-color: #427C89 !default;
$success-color: #7AC29A !default; //$success-color: #7AC29A !default;
$success-bg: #7AC29A !default; $success-color: #18ce0f !default;
$success-states-color: #42A084 !default; $success-bg: darken($success-color, 5%) !default;
$success-states-color: darken($success-color, 5%) !default;
$info-color: #68B3C8 !default; $info-color: #2CA8FF !default;
$info-bg: #68B3C8 !default; $info-bg: #109CFF !default;
$info-states-color: #3091B2 !default; $info-states-color: #3091B2 !default;
$warning-color: #F3BB45 !default; $warning-color: #F3BB45 !default;
$warning-bg: #F3BB45 !default; $warning-bg: darken($warning-color, 5%) !default;
$warning-states-color: #BB992F !default; $warning-states-color: #BB992F !default;
$danger-color: #EB5E28 !default; $danger-color: #FF3636 !default;
$danger-bg: #EB5E28 !default; $danger-bg: darken($danger-color, 5%) !default;
$danger-states-color: #B33C12 !default; $danger-states-color: darken($danger-color, 5%) !default;
/*
$default-color: #B8B8B8 !default;
$default-states-color: darken($default-color, 5%) !default;
$default-color-opacity: rgba(182, 182, 182, .6) !default;
$primary-color: #f96332 !default;
$primary-states-color: darken($primary-color, 5%) !default;
$primary-color-opacity: rgba(249, 99, 50, .3) !default;
$primary-color-alert: rgba(249, 99, 50, .8) !default;
$success-color: #18ce0f !default;
$success-states-color: darken($success-color, 5%) !default;
$success-color-opacity: rgba(24, 206, 15, .3) !default;
$success-color-alert: rgba(24, 206, 15, .8) !default;
$info-color: #2CA8FF !default;
$info-states-color: #109CFF !default;
$info-color-opacity: rgba(44, 168, 255, .3) !default;
$info-color-alert: rgba(44, 168, 255, .8) !default;
$warning-color: #FFB236 !default;
$warning-states-color: darken($warning-color, 5%) !default;
$warning-color-opacity: rgba(255, 178, 54, .3) !default;
$warning-color-alert: rgba(255, 178, 54, .8) !default;
$danger-color: #FF3636 !default;
$danger-states-color: darken($danger-color, 5%) !default;
$danger-color-opacity: rgba(255, 54, 54, .3) !default;
$danger-color-alert: rgba(255, 54, 54, .8) !default;
*/
$link-disabled-color: #666666 !default; $link-disabled-color: #666666 !default;

135
public/assets/admin/vendor/sass/paper/mixins/_buttons.scss vendored
View File

@@ -1,19 +1,20 @@
// Mixin for generating new styles // Mixin for generating new styles
@mixin btn-styles($btn-color, $btn-states-color) { @mixin btn-styles($btn-color, $btn-states-color) {
border-color: $btn-color; background-color: $btn-color;
color: $btn-color;
&:hover, &:hover,
&:focus, &:focus,
&:active, &:active,
&.active, &.active,
.open > &.dropdown-toggle { &:active:focus,
background-color: $btn-color; &:active:hover,
color: $fill-font-color; &.active:focus,
border-color: $btn-color; &.active:hover,
.caret{ .open > &.dropdown-toggle,
border-top-color: $fill-font-color; .open > &.dropdown-toggle:focus,
} .open > &.dropdown-toggle:hover {
background-color: $btn-states-color;
color: $white-color;
} }
&.disabled, &.disabled,
@@ -26,56 +27,122 @@
&.focus, &.focus,
&:active, &:active,
&.active { &.active {
background-color: $transparent-bg; background-color: $btn-color;
border-color: $btn-color; border-color: $btn-color;
} }
} }
&.focus,
&:focus {
box-shadow: none;
}
&.btn-fill { // btn-neutral style
@if $btn-color == $white-color {
color: $white-color; color: $white-color;
background-color: $btn-color;
@include opacity(1); &.btn-danger {
color: $danger-color;
&:hover,
&:focus,
&:active {
color: $danger-states-color;
}
}
&.btn-info {
color: $white-color;
&:hover,
&:focus,
&:active {
color: $info-states-color;
}
}
&.btn-warning {
color: $white-color;
&:hover,
&:focus,
&:active {
color: $warning-states-color;
}
}
&.btn-success {
color: $white-color;
&:hover,
&:focus,
&:active {
color: $success-states-color;
}
}
&.btn-default {
color: $white-color;
&:hover,
&:focus,
&:active {
color: $default-states-color;
}
}
&.active,
&:active:focus,
&:active:hover,
&.active:focus,
&.active:hover,
.open > &.dropdown-toggle,
.open > &.dropdown-toggle:focus,
.open > &.dropdown-toggle:hover {
background-color: $white-color;
color: $primary-color;
}
&:hover, &:hover,
&:focus, &:focus,
&:active, &:active {
&.active, color: $primary-states-color;
.open > &.dropdown-toggle{
background-color: $btn-states-color;
color: $white-color;
border-color: $btn-states-color;
} }
.caret{ } @else {
border-top-color: $white-color; color: $white-color;
}
} }
&.btn-simple { &.btn-simple {
color: $btn-color;
border-color: $btn-color;
&:hover, &:hover,
&:focus, &:focus,
&:active, &:active {
&.active, background-color: $transparent-bg;
.open > &.dropdown-toggle{ color: $btn-states-color;
background-color: $transparent-bg; border-color: $btn-states-color;
color: $btn-states-color;
}
.caret{
border-top-color: $white-color;
} }
} }
.caret{ &.btn-link {
border-top-color: $btn-color; color: $btn-color;
&:hover,
&:focus,
&:active {
background-color: $transparent-bg;
color: $btn-states-color;
text-decoration: none;
}
} }
} }
@mixin btn-size($padding-vertical, $padding-horizontal, $font-size, $border, $line-height){ @mixin btn-size($padding-vertical, $padding-horizontal, $font-size, $border, $line-height){
font-size: $font-size; font-size: $font-size;
border-radius: $border; //border-radius: $border;
padding: $padding-vertical $padding-horizontal; padding: $padding-vertical $padding-horizontal;
&.btn-simple{ &.btn-simple{

4
public/mix-manifest.json
View File

@@ -1,12 +1,12 @@
{ {
"/assets/admin/vendor/paper-dashboard.css": "/assets/admin/vendor/paper-dashboard.css?id=729efec551211db36219", "/assets/admin/vendor/paper-dashboard.css": "/assets/admin/vendor/paper-dashboard.css?id=233e12aabc29a3c6fba3",
"/assets/frontend/css/now-ui-kit.css": "/assets/frontend/css/now-ui-kit.css?id=58ec3dc768f07fee143a", "/assets/frontend/css/now-ui-kit.css": "/assets/frontend/css/now-ui-kit.css?id=58ec3dc768f07fee143a",
"/assets/system/js/jquery.js": "/assets/system/js/jquery.js?id=09dd64a64ba840c31a81", "/assets/system/js/jquery.js": "/assets/system/js/jquery.js?id=09dd64a64ba840c31a81",
"/assets/fonts/glyphicons-halflings-regular.woff2": "/assets/fonts/glyphicons-halflings-regular.woff2?id=b5b5055c6d812c0f9f0d", "/assets/fonts/glyphicons-halflings-regular.woff2": "/assets/fonts/glyphicons-halflings-regular.woff2?id=b5b5055c6d812c0f9f0d",
"/assets/admin/fonts/glyphicons-halflings-regular.woff2": "/assets/admin/fonts/glyphicons-halflings-regular.woff2?id=b5b5055c6d812c0f9f0d", "/assets/admin/fonts/glyphicons-halflings-regular.woff2": "/assets/admin/fonts/glyphicons-halflings-regular.woff2?id=b5b5055c6d812c0f9f0d",
"/assets/admin/css/clear.png": "/assets/admin/css/clear.png?id=0e92f4c3efc6988a3c96", "/assets/admin/css/clear.png": "/assets/admin/css/clear.png?id=0e92f4c3efc6988a3c96",
"/assets/admin/css/loading.gif": "/assets/admin/css/loading.gif?id=90a4b76b4f11558691f6", "/assets/admin/css/loading.gif": "/assets/admin/css/loading.gif?id=90a4b76b4f11558691f6",
"/assets/admin/css/vendor.min.css": "/assets/admin/css/vendor.min.css?id=b7f27b62f5cf3ebb7a65", "/assets/admin/css/vendor.min.css": "/assets/admin/css/vendor.min.css?id=dd0f6c4b8953c784240e",
"/assets/admin/js/vendor.js": "/assets/admin/js/vendor.js?id=0f6b516f7ea80d70d407", "/assets/admin/js/vendor.js": "/assets/admin/js/vendor.js?id=0f6b516f7ea80d70d407",
"/assets/admin/css/blue.png": "/assets/admin/css/blue.png?id=753a3c0dec86d3a38d9c", "/assets/admin/css/blue.png": "/assets/admin/css/blue.png?id=753a3c0dec86d3a38d9c",
"/assets/admin/css/blue@2x.png": "/assets/admin/css/blue@2x.png?id=97da23d47b838cbd4bef", "/assets/admin/css/blue@2x.png": "/assets/admin/css/blue@2x.png?id=97da23d47b838cbd4bef",