[Kimchi-devel] [V1 2/3] Customize jquery-ui menu

[Aline Manera]

Reviewed-by: Aline Manera <alinefm at linux.vnet.ibm.com>

On 01/02/2014 04:49 AM, huoyuxin at linux.vnet.ibm.com wrote:
> From: Yu Xin Huo <huoyuxin at linux.vnet.ibm.com>
>
> Customize jquery-ui menu to match kimchi menu style
>
> Signed-off-by: Yu Xin Huo <huoyuxin at linux.vnet.ibm.com>
> ---
>   ui/css/theme-default/jquery-ui.custom.css |   45 +++++++++++++++++++++++++++++
>   1 files changed, 45 insertions(+), 0 deletions(-)
>
> diff --git a/ui/css/theme-default/jquery-ui.custom.css b/ui/css/theme-default/jquery-ui.custom.css
> index 274bc86..217ff48 100644
> --- a/ui/css/theme-default/jquery-ui.custom.css
> +++ b/ui/css/theme-default/jquery-ui.custom.css
> @@ -80,3 +80,48 @@
>       width: 15px;
>       height: 15px;
>   }
> +
> +.ui-menu {
> +    background: linear-gradient(to bottom, #EEEEEE 0%, #CCCCCC 10px, #CCCCCC 96%, #A5A5A5 100%) repeat scroll 0 0 transparent;
> +    padding: 10px 10px 0;
> +    width: 250px;
> +}
> +
> +.ui-menu .ui-menu-item a {
> +    background: linear-gradient(to bottom, #FFFFFF 0%, #E5E5E5 100%) repeat scroll 0 0 transparent;
> +    border: 1px solid #CCCCCC;
> +    border-radius: 5px 5px 5px 5px;
> +    box-shadow: -1px -1px 1px #CCCCCC, 1px 1px 1px #EEEEEE;
> +    display: block;
> +    font-size: 13px;
> +    line-height: 38px;
> +    margin-bottom: 10px;
> +    text-align: center;
> +    text-shadow: -1px -1px 1px #CCCCCC, 1px 1px 1px #FFFFFF;
> +    width: 96%;
> +}
> +
> +.ui-menu .ui-menu-item a.ui-state-focus {
> +    background: linear-gradient(to bottom, #EEEEEE 0%, #D5D5D5 100%) repeat scroll 0 0 transparent;
> +    box-shadow: -1px -1px 1px #BBBBBB, 1px 1px 1px #DDDDDD;
> +    margin: 0px 0px 10px 0px;
> +}
> +
> +.ui-menu .ui-menu-item a.red:not([disabled]) {
> +    background: linear-gradient(to bottom, #FF3019 0%, #CF0404 100%) repeat scroll 0 0 transparent;
> +    border: 1px solid #B10F14;
> +    color: #FFFFFF;
> +    text-shadow: -1px -1px 1px #9E0505, 1px 1px 1px #FC5D4C;
> +}
> +
> +.ui-menu .ui-menu-item a.red:hover:not([disabled]) {
> +    background: linear-gradient(to bottom, #EF2009 0%, #BF0404 100%) repeat scroll 0 0 transparent;
> +}
> +
> +.ui-menu .ui-state-disabled {
> +    opacity: 1;
> +}
> +
> +.ui-menu .ui-state-disabled a {
> +    color: gray;
> +}