javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-07 06:57:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

Button variables

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

9
dist/framework-with-theme.css vendored
View File

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

3
example/index.html
View File

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

14
scss/framework/theme/default/_button.scss
View File

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

10
scss/framework/theme/default/_variables.scss
View File

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