(12 intermediate revisions by 2 users not shown) | |||
Line 42: | Line 42: | ||
} | } | ||
+ | |||
+ | |||
+ | /*Side bar styling for Wet Lab page*/ | ||
+ | |||
+ | #sidenavbar { | ||
+ | position: fixed; | ||
+ | right: 40px; | ||
+ | top: 50%; | ||
+ | bottom: auto; | ||
+ | -webkit-transform: translateY(-50%); | ||
+ | -moz-transform: translateY(-50%); | ||
+ | -ms-transform: translateY(-50%); | ||
+ | -o-transform: translateY(-50%); | ||
+ | transform: translateY(-50%); | ||
+ | z-index: 1; | ||
+ | background: rgba(255,255,255,0); | ||
+ | } | ||
+ | #sidenavbar li { | ||
+ | text-align: right; | ||
+ | list-style-type: none !important; | ||
+ | } | ||
+ | #sidenavbar a { | ||
+ | display: inline-block; | ||
+ | /* prevent weird movements on hover when you use a CSS3 transformation - webkit browsers */ | ||
+ | -webkit-backface-visibility: hidden; | ||
+ | backface-visibility: hidden; | ||
+ | } | ||
+ | #sidenavbar a:after { | ||
+ | content: ""; | ||
+ | display: table; | ||
+ | clear: both; | ||
+ | } | ||
+ | #sidenavbar a span { | ||
+ | float: right; | ||
+ | display: inline-block; | ||
+ | -webkit-transform: scale(0.6); | ||
+ | -moz-transform: scale(0.6); | ||
+ | -ms-transform: scale(0.6); | ||
+ | -o-transform: scale(0.6); | ||
+ | transform: scale(0.6); | ||
+ | } | ||
+ | #sidenavbar a:hover span { | ||
+ | -webkit-transform: scale(1.2); | ||
+ | -moz-transform: scale(1.2); | ||
+ | -ms-transform: scale(1.2); | ||
+ | -o-transform: scale(1.2); | ||
+ | transform: scale(1.2); | ||
+ | } | ||
+ | |||
+ | #sidenavbar a:hover .cd-label { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | #sidenavbar a.is-selected .cd-dot { | ||
+ | background-color: #388E3C; | ||
+ | } | ||
+ | #sidenavbar .cd-dot { | ||
+ | position: relative; | ||
+ | /* we set a top value in order to align the dot with the label. If you change label's font, you may need to change this top value*/ | ||
+ | top: 9px; | ||
+ | height: 18px; | ||
+ | width: 18px; | ||
+ | border-radius: 50%; | ||
+ | background-color: rgb(44, 166, 226); | ||
+ | -webkit-transition: -webkit-transform 0.2s, background-color 0.5s; | ||
+ | -moz-transition: -moz-transform 0.2s, background-color 0.5s; | ||
+ | transition: transform 0.2s, background-color 0.5s; | ||
+ | -webkit-transform-origin: 50% 50%; | ||
+ | -moz-transform-origin: 50% 50%; | ||
+ | -ms-transform-origin: 50% 50%; | ||
+ | -o-transform-origin: 50% 50%; | ||
+ | transform-origin: 50% 50%; | ||
+ | } | ||
+ | #sidenavbar .cd-label { | ||
+ | position: relative; | ||
+ | margin-right: 10px; | ||
+ | padding: .4em .5em; | ||
+ | color: rgb(44, 166, 226); | ||
+ | font-size: 14px; | ||
+ | font-size: 1.500rem; | ||
+ | -webkit-transition: -webkit-transform 0.2s, opacity 0.2s; | ||
+ | -moz-transition: -moz-transform 0.2s, opacity 0.2s; | ||
+ | transition: transform 0.2s, opacity 0.2s; | ||
+ | opacity: 0; | ||
+ | -webkit-transform-origin: 100% 50%; | ||
+ | -moz-transform-origin: 100% 50%; | ||
+ | -ms-transform-origin: 100% 50%; | ||
+ | -o-transform-origin: 100% 50%; | ||
+ | transform-origin: 100% 50%; | ||
+ | } | ||
+ | |||
/*Center the navbar elements with words*/ | /*Center the navbar elements with words*/ | ||
Line 79: | Line 169: | ||
#homeP{ | #homeP{ | ||
− | text-align:left; | + | text-align: left; |
− | font-family: | + | font-family: arial; |
− | font-size: | + | font-size: 14px; |
+ | } | ||
+ | #fontp{ | ||
+ | text-align: left; | ||
+ | font-family: arial; | ||
+ | font-size: 16px; | ||
+ | |||
} | } | ||
Line 4,754: | Line 4,850: | ||
padding-left: 15px; | padding-left: 15px; | ||
padding-right: 15px; | padding-right: 15px; | ||
+ | padding-top:15px; | ||
} | } | ||
Line 6,499: | Line 6,596: | ||
background-color: #337ab7; | background-color: #337ab7; | ||
border-color: #2e6da4; | border-color: #2e6da4; | ||
+ | width: 350px; | ||
+ | height: 100px; | ||
} | } | ||
.btn-primary:focus, .btn-primary.focus { | .btn-primary:focus, .btn-primary.focus { |
Latest revision as of 23:59, 1 November 2017