Permalink
Browse files

Add border-radius as an adjustable value (through variables.less), re…

…fs #12099.
  • Loading branch information...
1 parent efce1a7 commit a110e95312b7a1a9b94587c5dcec258f16343bbe @wkeese wkeese committed Dec 21, 2010
View
@@ -38,9 +38,9 @@
.claro .dijitToolbar .dijitButtonNode {
border-width: 0px; /* on hover/active, border-->1px, padding-->1px */
padding: 2px;
- border-radius: 2px;
- -moz-border-radius: 2px;
- -webkit-border-radius: 2px;
+ border-radius: @toolbar-button-border-radius;
+ -moz-border-radius: @toolbar-button-border-radius;
+ -webkit-border-radius: @toolbar-button-border-radius;
-moz-box-shadow: none;
-webkit-box-shadow: none;
-webkit-transition-property:background-color;
@@ -60,18 +60,18 @@
.claro .dijitToolbar .dijitComboButton .dijitStretch {
/* no rounded border on side adjacent to arrow */
- -moz-border-radius: 2px 0px 0px 2px;
- -webkit-border-top-left-radius: 2px;
+ -moz-border-radius: @toolbar-button-border-radius 0px 0px @toolbar-button-border-radius;
+ -webkit-border-top-left-radius: @toolbar-button-border-radius;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 0px;
- -webkit-border-bottom-left-radius: 2px;
+ -webkit-border-bottom-left-radius: @toolbar-button-border-radius;
}
.claro .dijitToolbar .dijitComboButton .dijitArrowButton {
/* no rounded border on side adjacent to button */
- -moz-border-radius: 0px 2px 2px 0px;
+ -moz-border-radius: 0px @toolbar-button-border-radius @toolbar-button-border-radius 0px;
-webkit-border-top-left-radius: 0px;
- -webkit-border-top-right-radius: 2px;
- -webkit-border-bottom-right-radius: 2px;
+ -webkit-border-top-right-radius: @toolbar-button-border-radius;
+ -webkit-border-bottom-right-radius: @toolbar-button-border-radius;
-webkit-border-bottom-left-radius: 0px;
}
@@ -45,9 +45,9 @@
background-position: center top;
background-repeat: repeat-x;
background-color: @button-background-color;
- border-radius: 4px;
- -moz-border-radius: 4px;
- -webkit-border-radius: 4px;
+ border-radius: @button-border-radius;
+ -moz-border-radius: @button-border-radius;
+ -webkit-border-radius: @button-border-radius;
box-shadow:0px 1px 1px rgba(0,0,0,0.15);
-webkit-box-shadow:0px 1px 1px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 1px 1px rgba(0,0,0,0.15);
@@ -155,16 +155,16 @@
}
.claro .dijitComboButton .dijitStretch {
- -moz-border-radius: 4px 0px 0px 4px;
- -webkit-border-top-left-radius: 4px;
+ -moz-border-radius: @button-border-radius 0px 0px @button-border-radius;
+ -webkit-border-top-left-radius: @button-border-radius;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 0px;
- -webkit-border-bottom-left-radius: 4px;
+ -webkit-border-bottom-left-radius: @button-border-radius;
}
.claro .dijitComboButton .dijitArrowButton {
- -moz-border-radius: 0px 4px 4px 0px;
+ -moz-border-radius: 0px @button-border-radius @button-border-radius 0px;
-webkit-border-top-left-radius: 0px;
- -webkit-border-top-right-radius: 4px;
- -webkit-border-bottom-right-radius: 4px;
+ -webkit-border-top-right-radius: @button-border-radius;
+ -webkit-border-bottom-right-radius: @button-border-radius;
-webkit-border-bottom-left-radius: 0px;
}
@@ -7,7 +7,7 @@
-webkit-border-bottom-left-radius: 0px;
}
.claro .dijitComboButtonRtl .dijitArrowButton {
- -moz-border-radius: 4px 0px 0px 4px;
+ -moz-border-radius: 4px 0px 0px 4px;
-webkit-border-top-left-radius: 4px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 0px;
@@ -3,19 +3,19 @@
/* Combo Button */
.claro .dijitComboButtonRtl .dijitStretch {
- -moz-border-radius: 0px 4px 4px 0px;
+ -moz-border-radius: 0px @button-border-radius @button-border-radius 0px;
-webkit-border-top-left-radius: 0px;
- -webkit-border-top-right-radius: 4px;
- -webkit-border-bottom-right-radius: 4px;
+ -webkit-border-top-right-radius: @button-border-radius;
+ -webkit-border-bottom-right-radius: @button-border-radius;
-webkit-border-bottom-left-radius: 0px;
}
.claro .dijitComboButtonRtl .dijitArrowButton {
- -moz-border-radius: 4px 0px 0px 4px;
- -webkit-border-top-left-radius:4px;
+ -moz-border-radius: @button-border-radius 0px 0px @button-border-radius;
+ -webkit-border-top-left-radius:@button-border-radius;
-webkit-border-top-right-radius:0px;
-webkit-border-bottom-right-radius:0px;
- -webkit-border-bottom-left-radius:4px;
+ -webkit-border-bottom-left-radius:@button-border-radius;
padding:3px 0px 4px;
border-left-width: 1px;
border-right-width: 0px;
@@ -1,5 +1,3 @@
-// ======= Colors =======
-
// General
@text-color: #000000; // Text color for enabled widgets
@@ -36,6 +34,7 @@
@button-background-color: #e9f4fe; // Background color for (unhovered) buttons
@button-hovered-background-color: #abd6ff; // Background color for hovered buttons
@button-pressed-background-color: #abd6ff; // Background color for active buttons
+@button-border-radius: 4px; // Rounded corner radius for buttons (except in toolbar)
// Input widgets
@focused-border-color: #769dc0; // Focused textbox, editor, select, etc.
@@ -131,6 +130,7 @@
// Toolbar
@toolbar-button-checked-background-color: #fff; // a toggled-on button in the toolbar
@toolbar-combobutton-hovered-unhoveredsection-background-color: #f4ffff; // when user hovers a ComboButton in a Toolbar, the other half of the button turns this color
+@toolbar-button-border-radius: 2px; // Rounded corner radius for buttons for buttons in toolbar
// DnD
@dnd-avatar-background-color: #fff; // Background color of little Dialog-type box indicating dragged items

0 comments on commit a110e95

Please sign in to comment.