2015-08-27 12:03:05 -07:00
/ * *
* @ file
* Visual styles for Bartik ' s dropbutton component .
* /
2015-08-17 17:00:26 -07:00
. js . dropbutton-widget {
2015-08-27 12:03:05 -07:00
border : 1px solid ;
border-color : # e4e4e4 # d2d2d2 # b4b4b4 # d2d2d2 ;
2015-08-17 17:00:26 -07:00
background-color : # fff ;
background-image : -webkit-linear-gradient ( top , # f3f3f3 , # e8e8e8 ) ;
background-image : linear-gradient ( to bottom , # f3f3f3 , # e8e8e8 ) ;
color : # 3a3a3a ;
cursor : pointer ;
text-align : center ;
margin : 0 . 125em 0 ;
border-radius : 1em ;
2015-08-27 12:03:05 -07:00
overflow : hidden ;
2015-08-17 17:00:26 -07:00
}
. js . dropbutton-widget : hover {
2015-08-27 12:03:05 -07:00
border-color : # e4e4e4 # d2d2d2 # b4b4b4 # d2d2d2 ;
2015-08-17 17:00:26 -07:00
}
. js . dropbutton-widget . button {
border : none ;
margin : 0 ;
padding : 0 . 32em 1em ;
2015-08-27 12:03:05 -07:00
background : transparent none ;
2015-08-17 17:00:26 -07:00
}
2016-10-06 15:16:20 -07:00
. js . dropbutton-multiple . dropbutton-widget ,
. js [ dir = "rtl" ] . dropbutton-multiple . dropbutton-widget {
padding : 0 ;
}
. js . dropbutton-multiple . dropbutton-widget . dropbutton {
padding-right : 2em ; /* LTR */
position : relative ;
}
. js [ dir = "rtl" ] . dropbutton-multiple . dropbutton-widget . dropbutton {
padding-right : 0 ;
padding-left : 2em ;
}
2015-08-17 17:00:26 -07:00
. js . dropbutton-multiple . dropbutton-widget . dropbutton-action a {
margin-right : 0 ; /* LTR */
}
[ dir = "rtl" ] . js . dropbutton-multiple . dropbutton-widget . dropbutton-action a {
margin-left : 0 ;
}
. js . dropbutton . secondary-action {
border-top-color : # ccc ;
}
. js . dropbutton-toggle button {
background-color : # e8e8e8 ;
background-image : -webkit-linear-gradient ( top , # e8e8e8 , # d2d2d2 ) ;
background-image : linear-gradient ( to bottom , # e8e8e8 , # d2d2d2 ) ;
}
2015-08-27 12:03:05 -07:00
. js . dropbutton-toggle . dropbutton-arrow : hover {
2015-08-17 17:00:26 -07:00
background : # ccc ;
}
. js . dropbutton a {
2015-08-27 12:03:05 -07:00
color : # 3a3a3a ;
border-bottom : 0 none ;
2015-08-17 17:00:26 -07:00
}
2015-08-27 12:03:05 -07:00
. js . dropbutton . dropbutton-action : hover ,
2015-08-17 17:00:26 -07:00
. js . dropbutton a : hover {
2015-08-27 12:03:05 -07:00
background : # dedede ;
border-bottom : 0 none ;
2015-08-17 17:00:26 -07:00
}