tyler.durden
/
pandorafms
mirror of https://github.com/pandorafms/pandorafms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge branch '30-anadir-transicion-al-hover-de-los-botones-laterales-de-menu-y-de-la-ventana-de-alerta' into 'develop' 

Add transition to hover change color in alert windows and left menu bar buttons - #30

See merge request !82
This commit is contained in:
Enrique Camargo 2017-01-26 12:12:25 +01:00
parent e707f65a6f f14f0d923f
commit 99220f4400
2 changed files with 303 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

155
pandora_console/include/styles/pandora.css
View File

@ -1928,6 +1928,18 @@ div.warn {
} }
.submenu_not_selected { .submenu_not_selected {
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
font-weight: normal !important; font-weight: normal !important;
} }
@ -2277,16 +2289,79 @@ ul.operation li a:hover {
#font-weight: bold; #font-weight: bold;
} }
.menu_icon{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
}
.menu_icon:hover{ .menu_icon:hover{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
background-color: #585858 !important; background-color: #585858 !important;
} }
.submenu_not_selected:hover{ .submenu_not_selected:hover{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
background-color: #585858 !important; background-color: #585858 !important;
} }
.submenu_selected:hover{ .submenu_selected:hover{
background-color: #585858 !important; background-color: #585858 !important;
} }
.sub_subMenu{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
}
.sub_subMenu:hover{ .sub_subMenu:hover{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
background-color: #585858 !important; background-color: #585858 !important;
} }
@ -3576,6 +3651,13 @@ div.simple_value > a > span.text p
margin-right:10px; margin-right:10px;
margin-top:10px; margin-top:10px;
} }
.modalclosex:hover{
cursor:pointer;
display:inline;
float:right;
margin-right:10px;
margin-top:10px;
}
.modalcontent{ .modalcontent{
color:black; color:black;
background:white; background:white;
@ -3597,6 +3679,13 @@ div.simple_value > a > span.text p
margin-left:30px; margin-left:30px;
} }
.modalokbutton{ .modalokbutton{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
cursor:pointer; cursor:pointer;
text-align:center; text-align:center;
margin-right:45px; margin-right:45px;
@ -3607,16 +3696,82 @@ div.simple_value > a > span.text p
border-radius: 3px;width:90px;height:30px;background-color:white;border: 1px solid #82b92e; border-radius: 3px;width:90px;height:30px;background-color:white;border: 1px solid #82b92e;
} }
.modalokbuttontext{ .modalokbuttontext{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px; color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px;
} }
.modalokbutton:hover {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
background-color:#82b92e;
}
.modalokbutton:hover .modalokbuttontext {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:white;
}
.modalgobutton{ .modalgobutton{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
cursor:pointer;text-align:center;margin-right:15px;margin-bottom:30px;float:right;-moz-border-radius: 3px; cursor:pointer;text-align:center;margin-right:15px;margin-bottom:30px;float:right;-moz-border-radius: 3px;
-webkit-border-radius: 3px;border-radius: 3px;width:240px;height:30px;background-color:white;border: 1px solid #82b92e; -webkit-border-radius: 3px;border-radius: 3px;width:240px;height:30px;background-color:white;border: 1px solid #82b92e;
} }
.modalgobuttontext{ .modalgobuttontext{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px; color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px;
} }
.modalgobutton:hover {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
background-color:#82b92e;
}
.modalgobutton:hover .modalgobuttontext {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:white;
}
#opacidad{ #opacidad{
opacity:0.5; opacity:0.5;

148
pandora_console/include/styles/pandora_black.css
View File

@ -1930,6 +1930,18 @@ div.warn {
} }
.submenu_not_selected { .submenu_not_selected {
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
font-weight: normal !important; font-weight: normal !important;
} }
@ -2278,16 +2290,81 @@ ul.operation li a:hover {
#font-weight: bold; #font-weight: bold;
} }
.menu_icon{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
}
.menu_icon:hover{ .menu_icon:hover{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
background-color: #585858 !important; background-color: #585858 !important;
} }
.submenu_not_selected:hover{ .submenu_not_selected:hover{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
-o-transition-timing-function: ease-out;
background-color: #585858 !important; background-color: #585858 !important;
} }
.submenu_selected:hover{ .submenu_selected:hover{
background-color: #585858 !important; background-color: #585858 !important;
} }
.sub_subMenu{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
}
.sub_subMenu:hover{ .sub_subMenu:hover{
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: ease-out;
-o-transition-property: background-color;
-o-transition-duration: 0.5s;
background-color: #585858 !important; background-color: #585858 !important;
} }
@ -3238,6 +3315,13 @@ table#policy_modules td * {
} }
.modalokbutton{ .modalokbutton{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
cursor:pointer; cursor:pointer;
text-align:center; text-align:center;
margin-right:45px; margin-right:45px;
@ -3248,16 +3332,80 @@ table#policy_modules td * {
border-radius: 3px;width:90px;height:30px;background-color:white;border: 1px solid #82b92e; border-radius: 3px;width:90px;height:30px;background-color:white;border: 1px solid #82b92e;
} }
.modalokbuttontext{ .modalokbuttontext{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px; color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px;
} }
.modalokbutton:hover {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
background-color:#82b92e;
}
.modalokbutton:hover .modalokbuttontext {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:white;
}
.modalgobutton{ .modalgobutton{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
cursor:pointer;text-align:center;margin-right:15px;margin-bottom:30px;float:right;-moz-border-radius: 3px; cursor:pointer;text-align:center;margin-right:15px;margin-bottom:30px;float:right;-moz-border-radius: 3px;
-webkit-border-radius: 3px;border-radius: 3px;width:240px;height:30px;background-color:white;border: 1px solid #82b92e; -webkit-border-radius: 3px;border-radius: 3px;width:240px;height:30px;background-color:white;border: 1px solid #82b92e;
} }
.modalgobuttontext{ .modalgobuttontext{
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px; color:#82b92e;font-family:Nunito;font-size:10pt;position:relative;top:6px;
} }
.modalgobutton:hover {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
background-color:#82b92e;
}
.modalgobutton:hover .modalgobuttontext {
transition-property: background-color, color;
transition-duration: 1s;
transition-timing-function: ease-out;
-webkit-transition-property: background-color, color;
-webkit-transition-duration: 1s;
-o-transition-property: background-color, color;
-o-transition-duration: 1s;
color:white;
}
#opacidad{ #opacidad{
opacity:0.5; opacity:0.5;