info/php-the-right-way
1
0
Fork 0
mirror of https://github.com/codeguy/php-the-right-way.git synced 2025-08-07 22:46:39 +02:00
Code Issues Projects Releases Wiki Activity

Add new UI files

Browse Source
This commit is contained in:
=
2012-07-09 12:08:25 -04:00
parent 698d11bb4c
commit 4123062047
20 changed files with 2087 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
styles/base/buttons.less Normal file
View File

@@ -0,0 +1,97 @@
/* ==========================================================================
Settings
========================================================================== */
@import 'variables.less';
/*
@baseline: @baseline;
@button-color: @button-color;
@button-primary-color: @button-primary-color;
@button-info-color: @button-info-color;
@button-success-color: @button-success-color;
@button-warning-color: @button-warning-color;
@button-danger-color: @button-danger-color;
*/
/* ==========================================================================
Default
========================================================================== */
.btn{
.btn-s;
background-clip: border-box !important;
background-repeat: repeat-x;
border: 1px solid rgba(0, 0, 0, 0.25);
.border-box;
.border-radius(4px);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
cursor: pointer;
display: inline-block;
.gradient(@button-color, lighten(@button-color, 10%), @button-color);
.phh;
.pvn;
.transition(background-position linear 0.1s);
vertical-align: middle;
color: #333;
font-family: @body-font-family;
text-decoration: none !important;
text-shadow: rgba(255,255,255,0.75) 0 1px 0;
&:hover{
background-position: 0 -15px;
}
}
/* ==========================================================================
Styles
========================================================================== */
.btn-primary,
.btn-info,
.btn-success,
.btn-warning,
.btn-danger{
color: #FFF !important;
text-shadow: rgba(0,0,0,0.25) 0 -1px 0 !important;
}
.btn-primary{
.btn;
.gradient(@button-primary-color, lighten(@button-primary-color, 10%), @button-primary-color);
}
.btn-info{
.btn;
.gradient(@button-info-color, lighten(@button-info-color, 10%), @button-info-color);
}
.btn-success{
.btn;
.gradient(@button-success-color, lighten(@button-success-color, 10%), @button-success-color);
}
.btn-warning{
.btn;
.gradient(@button-warning-color, lighten(@button-warning-color, 10%), @button-warning-color);
}
.btn-danger{
.btn;
.gradient(@button-danger-color, lighten(@button-danger-color, 10%), @button-danger-color);
}
/* ==========================================================================
Sizes (Half = h, Single = s, Double = d)
========================================================================== */
.btn-h, .btn-half{
height: @baseline;
font-size: @baseline * 0.6;
line-height: @baseline;
}
.btn-s, .btn-single{
height: @baseline * 1.5;
font-size: @baseline * 0.75;
line-height: @baseline * 1.5;
}
.btn-d, .btn-double{
height: @baseline * 2;
font-size: @baseline;
line-height: @baseline * 2;
}