| /** This CSS covers all navigation: sidebar, topnav, |
| bottom scrollnav, footer, and in-page TOCs. |
| Everything except the footer should be in a <nav> element. **/ |
| |
| /** === GENERAL NAV ELEMENTS === **/ |
| |
| a.dropdown-toggle, |
| .navbar-inverse .navbar-nav > li > a { |
| margin-left: 10px; |
| } |
| |
| div.navbar-collapse .dropdown-menu > li > a:hover { |
| background-color: #E6E7E8; |
| color: #D9411E; |
| } |
| /** === END GENERAL NAV ELEMENTS === **/ |
| |
| /** === LEFT SIDEBAR === **/ |
| |
| /* The #sidebar ID is used for the sidebar as a whole */ |
| #sidebar { |
| position: sticky; |
| top: 0; |
| left: 0; |
| height: 100vh; |
| z-index: 999; |
| background: #E6E7E8; |
| transition: all 0.3s; |
| } |
| |
| .sidebar-header { |
| padding-left: 5px; |
| } |
| |
| .sidebarTitle { |
| font-weight: bold; |
| font-size: 1.5em; |
| margin-top: 30px; |
| margin-bottom: 10px; |
| line-height: 30px; |
| } |
| |
| /*The #mysidebar ID is only used for the Ref Guide sections part of the sidebar */ |
| |
| #mysidebar.nav { |
| width: 100%; |
| } |
| |
| #mysidebar.nav > li { |
| width: 275px; |
| } |
| |
| #mysidebar.nav ul { |
| background-color: white; |
| } |
| |
| #mysidebar.nav ul li a { |
| background-color: white; |
| color: #D9411E; |
| border: none; |
| } |
| |
| #mysidebar ul li a:hover { |
| background-color: #D9411E; |
| color: white; |
| } |
| |
| |
| @media (max-width: 990px) { |
| #sidebar { |
| position: relative; |
| } |
| } |
| |
| @media (max-width: 900px) { |
| |
| ul#sidebar { |
| max-width: 100%; |
| } |
| } |
| |
| /* These rules cover the individual items in the sidebar */ |
| |
| ul.nav li ul { |
| font-size: 10pt; |
| } |
| |
| .nav { |
| margin-bottom: 0; |
| padding-left: 0; |
| list-style: none; |
| } |
| .nav { |
| /* padding: 4px;*/ |
| padding:0; |
| margin: 0; |
| } |
| |
| .nav:before, |
| .nav:after { |
| content: " "; |
| /* 1 */ |
| |
| display: table; |
| /* 2 */ |
| |
| } |
| .nav:after { |
| clear: both; |
| } |
| |
| .nav ul { |
| padding: 0; |
| margin: 0; |
| } |
| |
| .nav, |
| .nav ul, |
| .nav li { |
| list-style: none; |
| } |
| |
| .nav > li { |
| margin: 1px 0; |
| } |
| |
| .nav > li li { |
| margin: 2px 0; |
| } |
| |
| .nav > li.active > a { |
| background-color: #262130; |
| } |
| |
| |
| .nav a { |
| color: #333; |
| display: block; |
| outline: none; |
| text-decoration: none; |
| } |
| |
| .nav a:hover, |
| .nav a:focus, |
| .nav li.active > a { |
| background-color: #D9411E; |
| color: white; |
| } |
| |
| .nav ul li a { |
| border-top:1px solid whitesmoke; |
| padding-left:10px; |
| background-color: #FAFAFA; |
| } |
| |
| .nav li a { |
| line-height: 18px; |
| padding: 2px 10px; |
| } |
| |
| .nav li a { |
| padding-right:10px; |
| } |
| |
| .nav > li > a { |
| line-height: 20px; |
| padding: 4px 10px; |
| } |
| |
| |
| .nav li > a > span { |
| float: right; |
| font-size: 19px; |
| font-weight: bolder; |
| } |
| |
| .nav li > a > span:after { |
| content: '\25be'; |
| } |
| .nav li.active > a > span:after { |
| content: '\25b4'; |
| } |
| |
| |
| /* end navgoco sidebar */ |
| |
| /* When '-Dsolr-guide-version' is not set during the build, the Guide is |
| considered a Draft and includes a notice in the sidebar to that effect */ |
| |
| .sidebar-header p.draft-notice { |
| padding: 0px 0px 10px 0px; |
| margin-bottom: 10px; |
| } |
| |
| .sidebar-header p.draft-notice a, |
| .sidebar-header p.draft-notice a:hover, |
| .sidebar-header p.draft-notice a:active .nav p.draft-notice a:focus { |
| display: inline; |
| text-decoration: underline; |
| position: inherit; |
| line-height: inherit; |
| padding: inherit; |
| background-color: inherit; |
| } |
| |
| |
| /* indent extra nav levels |
| TODO: is there any easy way to do this that just incrementally applies to anything below sb-level2? |
| ...w/o assuming sb-level4 is as deep as we go? |
| */ |
| ul#mysidebar li.sb-level3 a { |
| padding-left: 20px; |
| } |
| ul#mysidebar li.sb-level4 a { |
| padding-left: 40px; |
| } |
| |
| /* Highlight currently selected page */ |
| ul#mysidebar li.current.active > a { |
| background-color: #D9411E; |
| color: white; |
| } |
| |
| /** === END LEFT SIDEBAR === **/ |
| |
| |
| /** === TOP NAVBAR === **/ |
| |
| /* The <span> tag with id="projectTitle" is used in the top navbar */ |
| span.projectTitle |
| { |
| font-weight: bold; |
| font-family: 'Noto Sans', sans-serif; |
| font-size: 14pt; |
| padding-left: 2px; |
| } |
| |
| nav#topnav { |
| margin-left: 17%; |
| } |
| |
| .navbar .container-fluid { |
| border: solid; |
| border-color: whitesmoke; |
| background-color: white; |
| } |
| |
| /** === END TOP NAVBAR === **/ |
| |
| /** === TOCs === **/ |
| |
| nav.toc { |
| padding-left: 10px; |
| max-width: 350px; |
| } |
| |
| nav.toc ul li { |
| margin: 8px 0 8px 22px; |
| list-style: disc; |
| line-height: 1.25; |
| } |
| |
| nav.toc ul { |
| background-color: #f1f1f1;; |
| padding: 5px; |
| border-radius: 5px; |
| color: gray; |
| } |
| |
| nav.toc ul li ul { |
| padding-left: 8px; |
| } |
| |
| nav.toc ul li ul li { |
| list-style: circle; |
| margin: 5px 0 0 0; |
| } |
| |
| nav.toc ul li ul li ul li { |
| list-style: square; |
| } |
| |
| nav.toc >ul::before { |
| content: "On this Page"; |
| font-weight: bold; |
| color: #555; |
| text-align:center; |
| margin-left:auto; |
| margin-right:auto; |
| width:70px; |
| padding-top:20px; |
| padding-bottom:20px; |
| padding-left:10px; |
| } |
| |
| .toc > ul |
| { |
| margin-left: .125em; |
| } |
| |
| .toc ul |
| { |
| list-style-type: none; |
| font-family: 'Noto Sans', sans-serif; |
| } |
| |
| .toc a |
| { |
| text-decoration: none; |
| } |
| |
| .toc a:hover |
| { |
| text-decoration: underline; |
| } |
| |
| #content .toc > :first-child |
| { |
| margin-top: 0; |
| } |
| |
| #content .toc > :last-child |
| { |
| margin-bottom: 0; |
| } |
| |
| /** === END TOCs === **/ |
| |
| /** === BOTTOM PAGE NAV (scrollnav) === **/ |
| |
| .scrollnav { |
| margin-bottom: 1em; |
| } |
| .scrollnav .prev { |
| text-align: left; |
| float: left; |
| font-size: inherit; |
| } |
| .scrollnav .prev:before { |
| padding-right: 0.5em; |
| content: "\25C0"; |
| display: inline-block; /* text-decoration: none doesn't work, but this does */ |
| } |
| .scrollnav .next { |
| text-align: right; |
| float: right; |
| font-size: inherit; |
| } |
| .scrollnav .next:after { |
| padding-left: 0.5em; |
| content: " \25B6"; |
| display: inline-block; /* text-decoration: none doesn't work, but this does */ |
| } |
| |
| /** === END BOTTOM PAGE NAV === **/ |
| |
| /** === FOOTER === **/ |
| footer { |
| font-size: smaller; |
| padding-top: 10px; |
| } |
| |
| .footer { |
| text-align: right; |
| } |
| /** === END FOOTER === **/ |