Team:SJTU-Software2/test
From 2014.igem.org
(Difference between revisions)
Line 11: | Line 11: | ||
<script type="text/javascript" src="https://2014.igem.org/Team:SJTU-Software/toolsmin.js%20?action=raw&ctype=text/js"></script> | <script type="text/javascript" src="https://2014.igem.org/Team:SJTU-Software/toolsmin.js%20?action=raw&ctype=text/js"></script> | ||
<script type="text/javascript" src="https://2014.igem.org/Team:SJTU-Software/main.js%20?action=raw&ctype=text/js"></script> | <script type="text/javascript" src="https://2014.igem.org/Team:SJTU-Software/main.js%20?action=raw&ctype=text/js"></script> | ||
+ | <style type="text/css"> | ||
+ | ul.expmenu { width: 200px; } | ||
+ | ul.expmenu * { list-style: none; } | ||
+ | ul.expmenu > li > div.header { padding: 12px; border-bottom: 1px #396e9f solid; } | ||
+ | ul.expmenu > li:last-child > div.header { border-bottom: none; } | ||
+ | ul.expmenu > li ul li { background-color: #ececec; padding: 12px; border-bottom: 1px solid #dcdcdc; border-top: 1px solid #fff; color: #727272; text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8); } | ||
+ | ul.expmenu > li ul li:last-child { border-bottom: none; } | ||
+ | ul.expmenu > li ul li.selected { background-color: #f4f4f4; } | ||
+ | ul.expmenu div.header | ||
+ | { | ||
+ | color: #203f61; | ||
+ | text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.2); | ||
+ | background: #4d7fb8; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #4d7fb8 0%, #4572a5 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d7fb8), color-stop(100%,#4572a5)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #4d7fb8 0%,#4572a5 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #4d7fb8 0%,#4572a5 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #4d7fb8 0%,#4572a5 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #4d7fb8 0%,#4572a5 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d7fb8', endColorstr='#4572a5',GradientType=0 ); /* IE6-9 */ | ||
+ | } | ||
+ | ul.expmenu > li > div.header > .label { padding-left: 24px; background: no-repeat; } | ||
+ | ul.expmenu > li > div.header > .arrow { display: block; width: 16px; height: 16px; background: no-repeat center; float: right; } | ||
+ | ul.expmenu > li > div.header > .arrow.up { background-image: url(../images/arrow_u.png); } | ||
+ | ul.expmenu > li > div.header > .arrow.down { background-image: url(../images/arrow_d.png); } | ||
+ | |||
+ | /* Mouse Events */ | ||
+ | ul.expmenu div.header:hover | ||
+ | { | ||
+ | background: #4571a0; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #4d7fb8 0%, #4571a0 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d7fb8), color-stop(100%,#4571a0)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #4d7fb8 0%,#4571a0 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #4d7fb8 0%,#4571a0 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #4d7fb8 0%,#4571a0 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #4d7fb8 0%,#4571a0 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d7fb8', endColorstr='#4571a0',GradientType=0 ); /* IE6-9 */ | ||
+ | |||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | ul.expmenu > li ul li:not(.selected):hover | ||
+ | { | ||
+ | background: #e7e7e7; /* Old browsers */ | ||
+ | |||
+ | cursor: pointer; | ||
+ | } | ||
+ | ul.expmenu > li ul li:not(.selected):active | ||
+ | { | ||
+ | background: #f1f1f1; /* Old browsers */ | ||
+ | |||
+ | cursor: pointer; | ||
+ | } | ||
+ | .slider | ||
+ | { | ||
+ | background: #d5d5d5; | ||
+ | height: 7px; | ||
+ | position: relative; | ||
+ | cursor: pointer; | ||
+ | width: 100%; | ||
+ | clear: right; | ||
+ | top: 0px; | ||
+ | -moz-border-radius: 5px; | ||
+ | -webkit-border-radius: 5px; | ||
+ | -moz-box-shadow: inset 0 0 8px #000; | ||
+ | margin: 10px 0 10px 0; | ||
+ | } | ||
+ | |||
+ | /* progress bar (enabled with progress: true) */ | ||
+ | .progress | ||
+ | { | ||
+ | height: 7px; | ||
+ | position: relative; | ||
+ | background: #5389c5; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #5389c5 0%, #4775a9 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5389c5), color-stop(100%,#4775a9)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #5389c5 0%,#4775a9 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #5389c5 0%,#4775a9 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #5389c5 0%,#4775a9 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #5389c5 0%,#4775a9 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5389c5', endColorstr='#4775a9',GradientType=0 ); /* IE6-9 */ | ||
+ | -moz-border-radius: 5px; | ||
+ | -webkit-border-radius: 5px; | ||
+ | top: 0px; | ||
+ | border: 1px solid #4b7bb1; | ||
+ | |||
+ | -moz-box-shadow: inset 0 .7px 0 0 rgba(255, 255, 255, 0.3); | ||
+ | -webkit-box-shadow: inset 0 .7px 0 0 rgba(255, 255, 255, 0.3); | ||
+ | box-shadow: inset 0 .7px 0 0 rgba(255, 255, 255, 0.3); | ||
+ | } | ||
+ | |||
+ | /* drag handle */ | ||
+ | .handle | ||
+ | { | ||
+ | background: url(../images/handle.png) repeat-x center; | ||
+ | height: 16px; | ||
+ | width: 16px; | ||
+ | top: -5px; | ||
+ | position: absolute; | ||
+ | display: block; | ||
+ | margin-top: 1px; | ||
+ | cursor: pointer; | ||
+ | |||
+ | } | ||
+ | |||
+ | /* the input field */ | ||
+ | |||
+ | </style> | ||
<style type="text/css"> | <style type="text/css"> |
Revision as of 07:57, 12 October 2014