Line 13: | Line 13: | ||
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | ||
− | + | /***********************************MENU***********************************/ | |
+ | /* Wrapper for the menu */ | ||
+ | .igem_2017_menu_wrapper { | ||
+ | width: 15%; | ||
+ | height:100vh; | ||
+ | position:fixed; | ||
+ | right:0%; | ||
+ | padding:0px; | ||
+ | float:right; | ||
+ | border-left: 1px solid #d3d3d3; | ||
+ | background-color:#dddddd; | ||
+ | text-align:left; | ||
+ | font-family:Tahoma, Geneva, sans-serif; | ||
+ | overflow-y: auto; | ||
+ | overflow-x: hidden; | ||
+ | |||
+ | } | ||
+ | |||
+ | /* this hides the scrollbar to keep view consistency */ | ||
+ | .igem_2017_menu_wrappe::-webkit-scrollbar { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* styling for links in the menu, removes the line under text */ | ||
+ | .igem_2017_menu_wrapper a { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* styling for the images in the menu */ | ||
+ | .igem_2017_menu_wrapper img { | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | /* styling for the menu buttons */ | ||
+ | .igem_2017_menu_wrapper .menu_button { | ||
+ | width: 100%; | ||
+ | padding: 10px 0px 10px 15px; | ||
+ | float:left; | ||
+ | border-bottom: 1px solid #d3d3d3; | ||
+ | font-size: 12px; | ||
+ | font-weight: bold; | ||
+ | color: #5e5f5f; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | |||
+ | .igem_2017_menu_wrapper .menu_bottom_padding { | ||
+ | width: 100%; | ||
+ | height: 30px; | ||
+ | float:left; | ||
+ | } | ||
+ | |||
+ | .menu_button.direct_to_page { | ||
+ | padding-left: 36px; | ||
+ | } | ||
+ | |||
+ | |||
+ | .igem_2017_menu_wrapper .menu_button .expand_collapse_icon { | ||
+ | width:10%; | ||
+ | float:left; | ||
+ | } | ||
+ | |||
+ | .igem_2017_menu_wrapper .menu_button .expand_collapse_icon::before { | ||
+ | content: "+"; | ||
+ | } | ||
+ | |||
+ | .open::before { | ||
+ | content: "-" !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* styling for the menu buttons on hover */ | ||
+ | .igem_2017_menu_wrapper .menu_button:hover, .igem_2017_menu_wrapper .submenu_button:hover , .submenu_button.current_page:hover { | ||
+ | background-color: #3399ff; | ||
+ | text-decoration: none; | ||
+ | color:#ffffff; | ||
+ | } | ||
+ | |||
+ | /* styling for the menu button when it is the current page */ | ||
+ | .current_page { | ||
+ | background-color:#7fc1f7 !important; | ||
+ | color:#5e5f5f !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* styling for the submenu buttons */ | ||
+ | .igem_2017_menu_wrapper .submenu_button { | ||
+ | width: 100%; | ||
+ | padding: 10px 0px 10px 34px; | ||
+ | float:left; | ||
+ | background-color:#f2f2f2; | ||
+ | border-bottom: 1px solid #d3d3d3; | ||
+ | font-size: 12px; | ||
+ | color: #5e5f5f; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | /* wrapper for the submenu items, they are hidden by default*/ | ||
+ | .igem_2017_menu_wrapper .submenu_wrapper { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | /* when the page size is bigger than 800px, this show/hide control is hidden by default */ | ||
+ | .igem_2017_menu_wrapper #display_menu_control { | ||
+ | display:none; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
Revision as of 05:26, 15 October 2018