Button variables

This commit is contained in:
Max Lynch
2013-08-23 11:55:21 -05:00
parent 6b31cdda82
commit b3a7a4943f
4 changed files with 27 additions and 9 deletions

View File

@ -23,9 +23,12 @@ a {
margin: 0; }
.button {
color: #333333;
border-radius: 2px; }
color: #222222;
border-radius: 2px;
padding: 10px 10px; }
.button-default {
background-color: #fff;
background-color: white;
border: 1px solid #dddddd; }
.button-default:active {
background-color: #eeeeee; }

View File

@ -1,8 +1,7 @@
<html>
<head>
<link rel="stylesheet" href="bower_components/normalize-css/normalize.css">
<link rel="stylesheet" href="../dist/framework-structure.css">
<link rel="stylesheet" href="../dist/framework-theme.css">
<link rel="stylesheet" href="../dist/framework-with-theme.css">
</head>
<body>
<header class="bar-header">

View File

@ -1,9 +1,15 @@
.button {
color: #333333;
border-radius: 2px;
color: $buttonColor;
border-radius: $buttonBorderRadius;
padding: $buttonPadding;
}
.button-default {
background-color: #fff;
border: 1px solid #ddd;
background-color: $buttonDefaultBackground;
border: $buttonBorderWidth solid $buttonDefaultBorder;
&:active {
background-color: $buttonDefaultBackgroundActive;
}
}

View File

@ -0,0 +1,10 @@
// Buttons
$buttonColor: #222;
$buttonPadding: 10px 10px;
$buttonBorderRadius: 2px;
$buttonBorderWidth: 1px;
$buttonDefaultBackground: #fff;
$buttonDefaultBackgroundActive: #eee;
$buttonDefaultBorder: #ddd;