Team:Grenoble-EMSE-LSU/Design/Menu Couleurs
From 2013.igem.org
(106 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | /* Couleurs des onglets */ | + | /********** Couleurs des onglets **********/ |
ul.topnav li[id="home"] | ul.topnav li[id="home"] | ||
{ | { | ||
- | background: # | + | background: #ff6600; |
+ | background-image: linear-gradient(to bottom right,#ff9500,#ff6600,#ff4000); | ||
} | } | ||
ul.topnav li[id="proj"] | ul.topnav li[id="proj"] | ||
{ | { | ||
- | background: | + | background: #ff0000; |
+ | background-image: linear-gradient(to bottom right,#ff4000,#ff0000,#cc0000); | ||
} | } | ||
ul.topnav li[id="doc"] | ul.topnav li[id="doc"] | ||
{ | { | ||
- | background: # | + | background: #0099ff; |
+ | background-image: linear-gradient(to bottom right,#00d9ff,#0099ff,#0059ff); | ||
} | } | ||
ul.topnav li[id="HP"] | ul.topnav li[id="HP"] | ||
{ | { | ||
- | background: # | + | background: #00cc00; |
+ | background-image: linear-gradient(to bottom right,#00ff00,#00cc00,#009900); | ||
} | } | ||
ul.topnav li[id="team"] | ul.topnav li[id="team"] | ||
{ | { | ||
- | background: # | + | background: #9900cc; |
+ | background-image: linear-gradient(to bottom right,#cc33ff,#9900cc,#730099); | ||
} | } | ||
- | ul.topnav li | + | |
+ | /******************** Tout en bleu | ||
+ | ul.topnav li[id="home"], ul.topnav li[id="proj"], ul.topnav li[id="doc"], ul.topnav li[id="HP"], ul.topnav li[id="team"] | ||
{ | { | ||
- | + | background: #0099ff; | |
- | + | background-image: linear-gradient(to bottom right,#00d9ff,#0099ff,#0059ff); | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
+ | *******************/ | ||
- | ul.topnav li | + | ul.topnav li a |
{ | { | ||
- | font- | + | font: bold 16px Palatino, Palatino Linotype, Georgia, Times, Times New Roman, serif; |
+ | /*font-variant: small-caps;*/ | ||
+ | color: white; | ||
+ | text-align: center; | ||
+ | text-decoration: none; | ||
} | } | ||
- | /* Couleurs des sous-menus */ | + | body div div nav ul.topnav li:hover a |
+ | { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | /********** Couleurs des sous-menus **********/ | ||
- | ul.topnav li[id="proj"] ul.subnav | + | ul.topnav li[id="proj"] ul.subnav |
{ | { | ||
- | background: # | + | background: #ff9999; |
} | } | ||
- | ul.topnav li[id="proj"] ul.subnav ul.subsubnav | + | ul.topnav li[id="proj"] ul.subnav ul.subsubnav |
{ | { | ||
- | background: # | + | background: #ffe6e6; |
} | } | ||
- | ul.topnav li[id="doc"] ul.subnav | + | ul.topnav li[id="doc"] ul.subnav |
{ | { | ||
- | background: # | + | background: #99d6ff; |
} | } | ||
- | ul.topnav li[id="doc"] ul.subnav ul.subsubnav | + | ul.topnav li[id="doc"] ul.subnav ul.subsubnav |
{ | { | ||
- | background: # | + | background: #e6f5ff; |
} | } | ||
- | ul.topnav li[id="HP"] ul.subnav | + | ul.topnav li[id="HP"] ul.subnav |
{ | { | ||
- | background: # | + | background: #8fef8f; |
} | } | ||
- | ul.topnav li[id="team"] ul.subnav | + | ul.topnav li[id="team"] ul.subnav |
{ | { | ||
- | background: # | + | background: #e38fff; |
} | } | ||
ul.topnav li:hover ul.subnav li a | ul.topnav li:hover ul.subnav li a | ||
{ | { | ||
- | |||
color: white; | color: white; | ||
font-style: normal; | font-style: normal; | ||
font-variant: normal; | font-variant: normal; | ||
+ | font-size: 14px; | ||
} | } | ||
- | /* Couleurs des sous-menus au survolement */ | + | /********** Couleurs des sous-menus au survolement **********/ |
ul.topnav li[id="proj"] ul.subnav li:hover, ul.topnav li[id="doc"] ul.subnav li:hover, ul.topnav li[id="HP"] ul.subnav li:hover, ul.topnav li[id="team"] ul.subnav li:hover, ul.topnav li[id="proj"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="doc"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="HP"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="team"] ul.subnav ul.subsubnav li:hover | ul.topnav li[id="proj"] ul.subnav li:hover, ul.topnav li[id="doc"] ul.subnav li:hover, ul.topnav li[id="HP"] ul.subnav li:hover, ul.topnav li[id="team"] ul.subnav li:hover, ul.topnav li[id="proj"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="doc"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="HP"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="team"] ul.subnav ul.subsubnav li:hover | ||
{ | { | ||
- | background: | + | background: white; |
} | } | ||
ul.topnav li[id="proj"]:hover ul.subnav li:hover a | ul.topnav li[id="proj"]:hover ul.subnav li:hover a | ||
{ | { | ||
- | color: | + | color: #ff0000; |
} | } | ||
ul.topnav li[id="doc"]:hover ul.subnav li:hover a | ul.topnav li[id="doc"]:hover ul.subnav li:hover a | ||
{ | { | ||
- | color: # | + | color: #0099ff; |
} | } | ||
ul.topnav li[id="HP"]:hover ul.subnav li:hover a | ul.topnav li[id="HP"]:hover ul.subnav li:hover a | ||
{ | { | ||
- | color: # | + | color: #00cc00; |
} | } | ||
ul.topnav li[id="team"]:hover ul.subnav li:hover a | ul.topnav li[id="team"]:hover ul.subnav li:hover a | ||
{ | { | ||
- | color: # | + | color: #9900cc; |
} | } | ||
ul.topnav ul.subnav ul.subsubnav li a | ul.topnav ul.subnav ul.subsubnav li a | ||
{ | { | ||
- | |||
font-weight: normal; | font-weight: normal; | ||
} | } | ||
Line 116: | Line 129: | ||
{ | { | ||
font-weight: bold; | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | |||
+ | /********** Contact **********/ | ||
+ | |||
+ | body div[id="wrap"] div[id="scroll_right"] ul li.contact, body div[id="wrap"] div[id="scroll_right"] ul li a[id="contact"] | ||
+ | { | ||
+ | font: normal 14px Palatino, Palatino Linotype, Georgia, Times, Times New Roman, serif; | ||
+ | color: black; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | body div[id="wrap"] div[id="scroll_right"] ul li a[id="contact"]:hover | ||
+ | { | ||
+ | text-decoration: underline; | ||
} | } |
Latest revision as of 13:33, 8 September 2013
/********** Couleurs des onglets **********/
ul.topnav li[id="home"] { background: #ff6600; background-image: linear-gradient(to bottom right,#ff9500,#ff6600,#ff4000); }
ul.topnav li[id="proj"] { background: #ff0000; background-image: linear-gradient(to bottom right,#ff4000,#ff0000,#cc0000); }
ul.topnav li[id="doc"] { background: #0099ff; background-image: linear-gradient(to bottom right,#00d9ff,#0099ff,#0059ff); }
ul.topnav li[id="HP"] { background: #00cc00; background-image: linear-gradient(to bottom right,#00ff00,#00cc00,#009900); }
ul.topnav li[id="team"] { background: #9900cc; background-image: linear-gradient(to bottom right,#cc33ff,#9900cc,#730099); }
/******************** Tout en bleu
ul.topnav li[id="home"], ul.topnav li[id="proj"], ul.topnav li[id="doc"], ul.topnav li[id="HP"], ul.topnav li[id="team"]
{
background: #0099ff;
background-image: linear-gradient(to bottom right,#00d9ff,#0099ff,#0059ff);
}
- /
ul.topnav li a { font: bold 16px Palatino, Palatino Linotype, Georgia, Times, Times New Roman, serif;
/*font-variant: small-caps;*/
color: white; text-align: center; text-decoration: none; }
body div div nav ul.topnav li:hover a
{ text-decoration: none; }
/********** Couleurs des sous-menus **********/
ul.topnav li[id="proj"] ul.subnav { background: #ff9999; }
ul.topnav li[id="proj"] ul.subnav ul.subsubnav { background: #ffe6e6; }
ul.topnav li[id="doc"] ul.subnav { background: #99d6ff; }
ul.topnav li[id="doc"] ul.subnav ul.subsubnav { background: #e6f5ff; }
ul.topnav li[id="HP"] ul.subnav { background: #8fef8f; }
ul.topnav li[id="team"] ul.subnav { background: #e38fff; }
ul.topnav li:hover ul.subnav li a {
color: white; font-style: normal; font-variant: normal; font-size: 14px;
}
/********** Couleurs des sous-menus au survolement **********/
ul.topnav li[id="proj"] ul.subnav li:hover, ul.topnav li[id="doc"] ul.subnav li:hover, ul.topnav li[id="HP"] ul.subnav li:hover, ul.topnav li[id="team"] ul.subnav li:hover, ul.topnav li[id="proj"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="doc"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="HP"] ul.subnav ul.subsubnav li:hover, ul.topnav li[id="team"] ul.subnav ul.subsubnav li:hover { background: white; }
ul.topnav li[id="proj"]:hover ul.subnav li:hover a { color: #ff0000; }
ul.topnav li[id="doc"]:hover ul.subnav li:hover a { color: #0099ff; }
ul.topnav li[id="HP"]:hover ul.subnav li:hover a { color: #00cc00; }
ul.topnav li[id="team"]:hover ul.subnav li:hover a { color: #9900cc; }
ul.topnav ul.subnav ul.subsubnav li a { font-weight: normal; }
ul.topnav ul.subnav ul.subsubnav li:hover a { font-weight: bold; }
/********** Contact **********/
body div[id="wrap"] div[id="scroll_right"] ul li.contact, body div[id="wrap"] div[id="scroll_right"] ul li a[id="contact"] {
font: normal 14px Palatino, Palatino Linotype, Georgia, Times, Times New Roman, serif; color: black; font-weight: bold;
}
body div[id="wrap"] div[id="scroll_right"] ul li a[id="contact"]:hover
{
text-decoration: underline; }