Difference between revisions of "Template:SYSU-Software/CSS"
| Line 184: | Line 184: | ||
#menuContainer ul li { | #menuContainer ul li { | ||
height: 30px; | height: 30px; | ||
| − | padding-top: | + | padding-top: 10px; |
| − | padding-left: | + | padding-left: 2%; |
| − | padding-right: | + | padding-right: 2%; |
display: block; | display: block; | ||
float: left; | float: left; | ||
Revision as of 09:30, 18 September 2015
/*Global*/
html,body {
margin: 0; border: 0; padding: 0; width: 100%; height:100%;
}
hr {
background-color: white;
}
- {
margin: 0; border: 0; padding: 0; line-height:normal;
}
- contentContainer h1 {
border: 0px;
}
- contentContainer h2 {
border: 0px;
}
- contentContainer {
font-size: 12pt;
}
- mainContainer p, #footer p{
display: block;
}
h1, h2, h3, h4 {
margin: 10px; padding: 5px;
}
h1 {
font-size: 180%;
}
h2 {
font-size: 150%;
}
h3 {
font-size: 120%;
}
h4 {
font-size: 90%;
}
a {
text-decoration: none; outline-style: none; color: #399E80;
}
a:visited {
text-decoration: none; outline-style: none; color: #399E80;
}
a:link {
text-decoration: none; outline-style: none; color: #399E80;
}
a:active {
text-decoration: none; outline-style: none; color: rgba(43, 210, 174, 1);
}
a:hover {
text-decoration: none; outline-style: none; color: rgba(43, 210, 174, 1);
}
/*super container*/
- globalWrapper {
background-color: white !important;
}
- content {
width: 100%; border: 0; padding: 0; margin: 0;
}
/*no default title for Team:SYSU-Software*/ .firstHeading {
display:none;
}
/*back to top button*/
- top {
background: url("http://www.iconpng.com/png/sketched-arrows/sketched6.png");
background-position: center;
background-size: 90px 90px;
width:75px;
height:75px;
border-radius:55%;
position: fixed;
bottom: 20px;
right: 20px;
opacity: 0.5;
z-index:100;
}
/* Creates a container that will wrap all of the content inside your wiki pages. */
- mainContainer {
width: 100%; margin-bottom: 15px; overflow:hidden;
}
/* Creates the container for the menu */ /*MENU STYLING */ /*Styling for the links in the menu */
- menuContainer {
font-family: "Lucida Sans Unicode","Lucida Grande",sans-serif; font-size: 9pt; width: 100%; height: 40px; top:16px; position: fixed; text-align: center; z-index:100;
}
- menuContainer #oplayer {
opacity: 0.7; position: fixed; width: 100%; height: 40px; background-color: #000; z-index: -1;
}
- menuContainer #igem_logo {
margin-left: 80px;
height: 40px;
width: 40px;
float: left;
background-image: url("
");
background-position: center;
background-size: 40px 40px;
text-align: center;
}
- menuContainer a {
color: #fff; text-decoration:none; font-weight: bold;
}
- menuContainer #menu {
float: left; margin-left: 34px;
}
/* Sets the style for lists inside menuContainer */
- menuContainer #menu ul {
height: 40px; /*width: 1100px;*/ /*this is going to be modified*/ list-style: none; clear: both; margin: 0 auto;
}
/*Styles the list items to become menu buttons */
- menuContainer ul li {
height: 30px; padding-top: 10px; padding-left: 2%; padding-right: 2%; display: block; float: left; position: relative; /* margin-top:-4px;*/
}
/*For the menu buttons, changes the color when hovering*/
- menuContainer li {
transition:background-color 0.5s;
}
- menuContainer li:hover {
color: #FFF;/*this is going to be modified*/ background-color: #a8a9a9;/*this is going to be modified*/
}
/*style for opacity for sub op*/
- sub_oplayer {
visibility: hidden; opacity: 0; position: fixed; top:56px; left: 0px; height: 30px; width: 100%; background-color: #a8a9a9; transition:all 0.5s;
}
/*Submenus are not displayed as default*/
- menuContainer li ul {
width: 100%; position: fixed; top: 56px; transition: all 0.5s; left: 0px; padding-left: 150px; visibility: hidden; opacity: 0;
}
/*Submenus are displayed when hovering the menu button */
- menuContainer li:hover ul {
/*display: inline-block; */ visibility: visible; opacity: 1; height: 30px; position: fixed; top: 56px; float:left;
}
- menuContainer li:hover #sub_oplayer {
visibility: visible; opacity: 0.3;
}
/*Style the submenu buttons*/
- menuContainer li ul li{
transition:all 0.5s; color: #313131; padding-top: 5px; padding-bottom: 0px; padding-left: 20px; padding-right: 20px; height: 30px; overflow: hidden; width: auto; display: block; float: left; text-align: center; opacity: 1;
}
- menuContainer li ul li:hover{
background-color: inherit; color: gray;
}
- menuContainer li ul li:hover {
color: gray;
}
/******************end of menuContainer*****************/
/*Set up height place holder for the banner*/
- bannerContainer {
width: 100%;
margin:0;
padding: 0;
border:0;
height: 775px;
text-align:center;
color: #24B694;
background: url("
");
background-repeat: no-repeat;
background-position: top center;
background-size:cover;
font-family:"MV Boli", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
color: #399e80 ;
background-color:#F8F8F8;
line-height:normal;
}
- bannerContainer h3 {
font-size:20pt;
}
- bannerContainer #title {
height: 400px; width: 700px; position: relative; top: 200px; margin: 0 auto;
}
/*
- bannerContainer #title h2 {
font-size: 50pt; color: black; margin: 0; padding: 0; border-bottom:none;
}
- bannerContainer #title h3{
color: #399e80 !important; font-size: 30pt; margin: 0; padding: 0; margin-top:45px;
}
- bannerContainer #title p {
position: relative; top:120px; font-size: 12pt; font-family:"MV Boli";
}
- /
- title .logo {
height: 217px;
margin-left: 40px;
width: 580px;
background-image: url("
");
background-size: 80% auto;
background-repeat: no-repeat;
background-position: center center;
margin-bottom: 100px;
}
- title .scroll {
width: 322px;
height: 22px;
margin: 0 auto;
background-image: url("
");
background-repeat: no-repeat;
background-position: center;
background-size: 75% auto;
}
- title .down {
margin-top: 20px;
margin: 10px auto 0px;
height: 25px;
margin-top: 10px;
background-image: url("
");
background-repeat: no-repeat;
background-position: center;
}
/*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */ /* Creates the container for the content */
/*Change the styling of text for everything inside main container*/
- mainContainer p {
color: #000000;
}
/*CLASSES */
/*Clear class for all the pages, adds spacing too*/ .clear{
clear:both; height: 10px;
}
/* highlight box for special messages */ .highlightBox {
width:500px; margin:auto; background-color: #F4F0D8; margin-bottom: 15px; margin-top: 15px; padding: 15px; padding-top: 5px;
}
- footer {
margin-bottom:20px; margin-top: 40px; line-height:25px; text-align: center; background-color: white; color: #7f7f7f; font-family: Arial; font-size:11pt;
}