|
|
| (93 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| /* Adding hook to Font Awesome --------------------------------------------------------------------*/ | | /* CSS placed here will be applied to all skins */ |
| @import "https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css";
| | body h1.firstHeading { display: none; } |
| | /* Hide the default image arrows */ |
| | .wikitable.sortable th .mw-sorticon { |
| | background-image: none !important; |
| | } |
| | |
| | /* Add Unicode arrows for sorting */ |
| | .wikitable.sortable th::after { |
| | content: " ↕"; /* Neutral arrow */ |
| | color: white; /* Match arrow color */ |
| | } |
| | |
| | .wikitable.sortable th[data-sort-type="number"]::after { |
| | content: " ↑"; /* Ascending arrow */ |
| | } |
|
| |
|
| /*---------------DCK Edits 11/15/2021---------------*/
| | .wikitable.sortable th[data-sort-type="number"].headerSortDown::after { |
| /* Table of Contents modifications ---------------------------------------------------------------*/ | | content: " ↓"; /* Descending arrow */ |
| #toc{
| |
| margin: 0;
| |
| } | | } |
| .toctogglecheckbox:checked ~ ul { | | |
| display: none;
| | |
| | /*START - DELETE DCK testing 3/22/24*/ |
| | .tab { |
| | margin-left: 25px; |
| } | | } |
| @media print {
| | .h2dck{ |
| .toctogglecheckbox:checked + .toctitle {
| | font-family: "Open Sans", sans-serif; |
| display: none;
| | font-size: 1.8em; |
| }
| | margin-top: 1.8em; |
| } | | } |
| @media screen {
| | .cFloat:not(:hover) { |
| :not(:checked) > .toctogglecheckbox {
| | opacity: 0.65; |
| display: inline !important;
| |
| position: absolute;
| |
| opacity: 0;
| |
| z-index: -1;
| |
| }
| |
| .toctogglespan {
| |
| font-size: 94%;
| |
| }
| |
| :not(:checked) > .toctogglespan:before {
| |
| content: " [";
| |
| }
| |
| :not(:checked) > .toctogglespan:after {
| |
| content: "]";
| |
| }
| |
| .toctogglelabel {
| |
| cursor: pointer;
| |
| color: #0645ad;
| |
| }
| |
| .toctogglelabel:hover {
| |
| text-decoration: underline;
| |
| }
| |
| .toctogglecheckbox:focus + .toctitle .toctogglelabel {
| |
| text-decoration: underline;
| |
| outline: dotted 1px;
| |
| outline: auto -webkit-focus-ring-color;
| |
| }
| |
| .toctogglecheckbox:checked + .toctitle .toctogglelabel:after {
| |
| content: "show";
| |
| }
| |
| .toctogglecheckbox:not(:checked) + .toctitle .toctogglelabel:after {
| |
| content: "hide";
| |
| }
| |
| .toc h2 {
| |
| display: inline;
| |
| /*border: 0;
| |
| padding: 0;
| |
| font-size: 100%;
| |
| font-weight: bold;*/
| |
| }
| |
| } | | } |
|
| |
|
| | .cFloat:hover { |
| | opacity: 1.0; |
| | } |
| .noautonum .tocnumber { | | .noautonum .tocnumber { |
| display: none; | | display: none; |
| Line 86: |
Line 65: |
| opacity: 1.0; | | opacity: 1.0; |
| } | | } |
| | } |
| | |
| | /*Adding in for underlining links*/ |
| | |
| | #content a { |
| | text-decoration: underline; |
| | } |
| | |
| | #toc a { |
| | text-decoration: none; |
| } | | } |
|
| |
|
| Line 91: |
Line 80: |
| /*This will add scroll bars to the TOC based on the visible height of the window. ----------------*/ | | /*This will add scroll bars to the TOC based on the visible height of the window. ----------------*/ |
| /*Figuring out how to get it to only do this when not collapsed was a bear -----------------------*/ | | /*Figuring out how to get it to only do this when not collapsed was a bear -----------------------*/ |
| @media only screen and (max-height: 800px) { | | @media only screen and (max-height: 2000px) { |
| .toctogglecheckbox:not(:checked) ~ ul { | | .toctogglecheckbox:not(:checked) ~ ul { |
| display: block; | | display: block; |
| height:70vh; | | height:60vh; |
| overflow: scroll; | | overflow: scroll; |
| } | | } |
| } | | } |
| | /*END - DELETE DCK Testing*/ |
|
| |
|
| /*This will create a circle around the item.*/
| |
| .justthetip {
| |
| height: 25px;
| |
| width: 25px;
| |
| background-color: #13548e;
| |
| border-radius: 50%;
| |
| display: inline-flex;
| |
| justify-content: center;
| |
| align-items: center;
| |
| color: white;
| |
| font-weight: bold;
| |
| z-index: -1;
| |
| }
| |
|
| |
|
| .TMI {
| |
| height: 25px;
| |
| width: 25px;
| |
| background-color: #555555;
| |
| border-radius: 10%;
| |
| display: inline-flex;
| |
| justify-content: center;
| |
| align-items: center;
| |
| color: white;
| |
| font-weight: bold;
| |
| z-index: -1;
| |
| }
| |
|
| |
|
| .tooltip { | | /* Don't number the table of contents. Currently numbering is applied manually to the heading title */ |
| position: relative;
| | .tocnumber { |
| display: inline-block;
| | display:none |
| background: none;
| |
| width:auto;
| |
| left: auto;
| |
| padding: 0;
| |
| } | | } |
|
| |
|
| .tooltipTMI {
| | /* Styling for the Main Page */ |
| position: relative;
| |
| display: inline-block;
| |
| background: none;
| |
| width:auto;
| |
| left: auto;
| |
| padding: 0;
| |
| }
| |
|
| |
|
| .tooltiptext{ | | body.page-Main_Page h1 { |
| z-index: 1;
| | display: none; /* Don't show the title ("Main Page") of the main page */ |
| }
| |
| .tooltip .tooltiptext {
| |
| visibility: hidden;
| |
| width: 300px; /*I don't like that this is static, but I've got bigger fish to fry */
| |
| background-color: #13548e;
| |
| color: #fff;
| |
| text-align: center;
| |
| border-radius: 6px;
| |
| padding: 10px;
| |
| position: absolute;
| |
| top: 120%;
| |
| margin-left: -162px;
| |
| z-index: 1;
| |
| }
| |
| | |
| .tooltipTMI .tooltiptext {
| |
| visibility: hidden;
| |
| width: 300px; /*I don't like that this is static, but I've got bigger fish to fry */
| |
| background-color: #555555;
| |
| color: #fff;
| |
| text-align: center;
| |
| border-radius: 6px;
| |
| padding: 10px;
| |
| position: absolute;
| |
| top: 120%;
| |
| margin-left: -162px;
| |
| z-index: 1;
| |
| }
| |
| | |
| .tooltip .tooltiptext::after {
| |
| content: "";
| |
| position: absolute;
| |
| bottom: 100%;
| |
| margin-left: -5px;
| |
| border-width: 5px 5px 5px 5px;
| |
| left: 50%;
| |
| border-style: solid;
| |
| border-color: transparent transparent #004684 transparent;
| |
| }
| |
| /*This is the little triangle */
| |
| .tooltipTMI .tooltiptext::after {
| |
| content: "";
| |
| position: absolute;
| |
| bottom: 100%;
| |
| margin-left: -5px;
| |
| border-width: 5px 5px 5px 5px;
| |
| left: 50%;
| |
| border-style: solid;
| |
| border-color: transparent transparent #555555 transparent;
| |
| }
| |
| | |
| .tooltip:hover .tooltiptext {
| |
| visibility: visible;
| |
| /*This causes the tooltip window to be on top of everything else, since it temporary.*/
| |
| z-index: 1;
| |
| }
| |
| | |
| .tooltipTMI:hover .tooltiptext {
| |
| visibility: visible;
| |
| /*This causes the tooltip window to be on top of everything else, since it temporary.*/
| |
| z-index: 1;
| |
| }
| |
| | |
| /*---------------DCK Edits 11/15/2021---------------*/
| |
| | |
| /* CSS placed here will be applied to all skins --------------------------------------------------*/
| |
| | |
| | |
| /* Color values used on this site. ---------------------------------------------------------------*/
| |
| /*
| |
| Black = #000
| |
| White = #fff
| |
| Red = #ff0000
| |
| Blue = #2d5296
| |
| Orange = #fa6c34
| |
| Light Grey = #ededed (Table Background Color)
| |
| */
| |
| | |
| | |
| /* Sets the width of the content on the Foreground Skin ------------------------------------------*/
| |
| .row {
| |
| max-width: 80%;
| |
| }
| |
| | |
| | |
| /* Navigation Container Settings -----------------------------------------------------------------*/
| |
| nav.top-bar,
| |
| .top-bar.expanded .title-area {
| |
| background: #2d5296;
| |
| }
| |
| | |
| #navwrapper {
| |
| background: #2d5296;
| |
| }
| |
| | |
| #top-bar-left li,
| |
| #top-bar-left li a {
| |
| background: #2d5296;
| |
| border: 1px solid #2d5296;
| |
| } | | } |
| | /* Apply flex-box to screens (not print) */ |
| | @media screen { |
| | .main-flexcontainer { |
| | margin-top: 20px; |
| | display: flex; |
| | flex-wrap: wrap; |
| | } |
|
| |
|
| #top-bar-right li,
| | .main-flexbox { |
| #top-bar-right li a { | | border: 1px solid #CCC; |
| background: #2d5296; | | padding: 0 1em 1em; |
| } | | margin: 0 10px 20px; |
| | box-shadow: 0 2px 2px rgba(0,0,0,0.1); |
| | } |
|
| |
|
| #top-bar-left li:hover,
| | .main-flexbox ul { |
| #top-bar-left li a:hover,
| | list-style: none; |
| #top-bar-right li:hover:not(.has-form),
| | line-height: 2; |
| #top-bar-right li a:hover {
| | margin-left: 0.5em; |
| background: #fa6c34; | | } |
| color: #fff; | |
| } | |
|
| |
|
| .page-Main_Page #firstHeading {
| |
| display: none;
| |
| }
| |
|
| |
|
| #tagline {
| | /* End styling for the Main Page */ |
| display: none;
| |
| }
| |
|
| |
|
| #editform, #toolbar, #wpTextbox1 {
| | /* Site wide edits here */ |
| width: 100%;
| |
| }
| |
|
| |
|
| .top-bar-section .has-dropdown > a:hover:after {
| | body #p-coll-print_export {display:none} |
| border-color: #fa6c34 transparent transparent transparent;
| | #footer { display: none; } |
| } | | body { font-size: larger; } |
|
| |
|
| .top-bar-section .has-dropdown > a:hover:after {
| |
| border-color: #fff transparent transparent transparent;
| |
| }
| |
|
| |
| /* Back to Top Button Settings ------------------------------------------------------------------*/
| |
| .noprint {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: #2d5296;
| |
| background-color: #fff;
| |
| position: fixed;
| |
| bottom: 2.0%;
| |
| left: 0.5%;
| |
| padding: 0;
| |
| margin: 0%;
| |
| }
| |
|
| |
| /* Change the body font-family for entire site. -------------------------------------------------*/
| |
| body {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: #000;
| |
| }
| |
|
| |
| p {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: #000;
| |
| margin: 0 0 1.0em 0;
| |
| line-height: 1.5em;
| |
| }
| |
|
| |
| #p_white {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: #fff;
| |
| margin: 0 0 1.0em 0;
| |
| line-height: 1.5em;
| |
| }
| |
|
| |
|
| |
| .note_black {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: #000;
| |
| background-color: #E8E8E8;
| |
| border: 2px solid #000;
| |
| padding: 1em
| |
| }
| |
|
| |
| .note_green {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: green;
| |
| background-color: #E8E8E8;
| |
| border: 2px solid #000;
| |
| padding: 1em
| |
| }
| |
|
| |
| .note_red {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: red;
| |
| background-color: #E8E8E8;
| |
| border: 2px solid #000;
| |
| padding: 1em
| |
| }
| |
|
| |
| .image_center{
| |
| margin: 0;
| |
| padding: 0;
| |
| color: #ff0000;
| |
| text-align: center;
| |
| }
| |
|
| |
| #engineering_scale {
| |
| width: 45%;
| |
| float:left;
| |
| box-sizing: border-box;
| |
| }
| |
|
| |
| #architectural_scale {
| |
| width: 45%;
| |
| float:right;
| |
| box-sizing: border-box;
| |
| clear: right;
| |
| }
| |
|
| |
| .clear_float {
| |
| clear: both;
| |
| }
| |
|
| |
| .main_page {
| |
| border: 1px solid #2d5296;
| |
| }
| |
|
| |
| #welcome_main {
| |
| color: #ffffff;
| |
| background-color: #fa6c34;
| |
| border-left: 20px solid #2d5296;
| |
| padding: 10px;
| |
| text-transform: uppercase;
| |
| }
| |
|
| |
|
| |
| /* Hiding categories at the bottom of each page. -------------------------------------------------*/
| |
| .catlinks { display: none; }
| |
|
| |
|
| |
| /* Headers - For Use Inside of MediaWiki Table of Contents ---------------------------------------*/
| |
| #firstHeading.title {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 2.3em;
| |
| color: #fff;
| |
| background-color: #fa6c34;
| |
| line-height: 1.60em;
| |
| border-left: 20px solid #2d5296;
| |
| padding-left: 10px;
| |
| text-transform: uppercase;
| |
| }
| |
|
| |
| h1 {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 2.0em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
| h2 {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.8em;
| |
| color: #2d5296;
| |
| margin-top: 1.8em;
| |
| border-bottom: 1px solid #2d5296;
| |
| }
| |
|
| |
| h2.first_on_page {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.8em;
| |
| color: #2d5296;
| |
| margin-top: 1.0em;
| |
| border-bottom: 1px solid #2d5296;
| |
| }
| |
|
| |
| h3 {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.2em;
| |
| color: #2d5296;
| |
| margin-top: 1.2em;
| |
| font-weight: bold;
| |
| /*text-decoration: underline;*/
| |
| }
| |
|
| |
| h4 {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.1em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
| h5 {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.0em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
| h6 {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 0.9em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
|
| |
| /* Header - For use Outside of MediaWiki Table of Contents ---------------------------------------*/
| |
| .h1_outtoc {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 2.0em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
| .h2_outtoc {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.8em;
| |
| color: #2d5296;
| |
| margin-top: 1.8em;
| |
| border-bottom: 1px solid #2d5296;
| |
| }
| |
|
| |
| h2.outtoc_first_on_page {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.8em;
| |
| color: #2d5296;
| |
| margin-top: 1.0em;
| |
| border-bottom: 1px solid #2d5296;
| |
| }
| |
|
| |
| .h3_outtoc {
| |
| font-family: "Open Sans", sans-serif;
| |
| /*font-size: 1.6em;*/
| |
| font-size: 1.2em;
| |
| color: #2d5296;
| |
| /*border-bottom: 1px solid #2d5296; */
| |
| }
| |
|
| |
| .h4_outtoc {
| |
| font-family: "Open Sans", sans-serif;
| |
| /*font-size: 1.4em;*/
| |
| font-size: 1.1em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
| .h5_outtoc {
| |
| font-family: "Open Sans", sans-serif;
| |
| /*font-size: 1.2em;*/
| |
| font-size: 1.0em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
| .h6_outtoc {
| |
| font-family: "Open Sans", sans-serif;
| |
| /*font-size: 1.0em;*/
| |
| font-size: 0.9em;
| |
| color: #2d5296;
| |
| }
| |
|
| |
|
| |
| /* Headers - For Use With Manual Type Wiki Pages -------------------------------------------------*/
| |
| h2.manual {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.8em;
| |
| color: #2d5296;
| |
| margin-top: 3.6em;
| |
| border-bottom: 1px solid #2d5296;
| |
| }
| |
|
| |
| h3.manual {
| |
| font-family: "Open Sans", sans-serif;
| |
| font-size: 1.2em;
| |
| color: #2d5296;
| |
| margin-top: 2.0em;
| |
| font-weight: bold;
| |
| text-decoration: underline;
| |
| }
| |
|
| |
|
| |
| /* Alerts or Warnings text settings---------------------------------------------------------------*/
| |
| .warning_red{
| |
| color: #ff0000;
| |
| font-size: 20px;
| |
| text-decoration: underline;
| |
| }
| |
|
| |
|
| |
| /* Class for adding margin-bottom to tags requiring addition bottom offsets, such as <li> --------*/
| |
| li.page_content {
| |
| margin-bottom: 1.25em;
| |
| }
| |
|
| |
| li.page_content_1-1 {
| |
| margin-bottom: 1.0em;
| |
| }
| |
|
| |
| ul.ul_proper_spacing {
| |
| margin: 0 0 0 2.0em;
| |
| }
| |
|
| |
| /* CSS for Links ---------------------------------------------------------------------------------*/
| |
| /* A link that has not been visited */
| |
| a:link {
| |
| color: blue;
| |
| }
| |
|
| |
| /* A link that has been visited */
| |
| a:visited {
| |
| color: blue;
| |
| }
| |
|
| |
| /* A link that is hovered on */
| |
| a:hover {
| |
| color: red;
| |
| }
| |
|
| |
| /* A link that is selected */
| |
| a:active {
| |
| color: green;
| |
| }
| |
|
| |
| /* Indentation Settings -------------------------------------------------------------------------*/
| |
|
| |
| .tab {
| |
| margin-left: 25px;
| |
| }
| |
|
| |
| .tab0 {
| |
| margin-left: 0px;
| |
| }
| |
|
| |
| .tab1 {
| |
| margin-left: 25px;
| |
| }
| |
|
| |
| .tab2 {
| |
| margin-left:25px;
| |
| }
| |
|
| |
| .tab3 {
| |
| margin-left: 25px;
| |
| }
| |
|
| |
| .tab4 {
| |
| margin-left: 25px;
| |
| }
| |
|
| |
|
| |
| /* Style the button that is used to open and close the collapsible content -----------------------*/
| |
| .collapsible {
| |
| background-color: #fa6c34;
| |
| color: #fff;
| |
| cursor: pointer;
| |
| padding: 18px;
| |
| width: 100%;
| |
| border: none;
| |
| text-align: left;
| |
| outline: none;
| |
| font-size: 15px;
| |
| }
| |
|
| |
|
| |
| /* Add a background color to the button if it is clicked on --------------------------------------*/
| |
| /* Add the .active class with JS, and when you move the mouse over it (hover) --------------------*/
| |
| .active, .collapsible:hover {
| |
| background-color: #ccc;
| |
| }
| |
|
| |
|
| |
| /* Style the collapsible content. Note: hidden by default */
| |
| .content {
| |
| padding: 0 18px;
| |
| display: none;
| |
| overflow: hidden;
| |
| background-color: #f1f1f1;
| |
| }
| |
|
| |
|
| |
| /* DelDOT Table Settings -------------------------------------------------------------------------*/
| |
| .deldot_table {
| |
| color: #000;
| |
| background-color: #ededed;
| |
| margin: 1em 0;
| |
| border: 1px solid #2d5296;
| |
| border-collapse: collapse;
| |
| }
| |
|
| |
| table.deldot_table > * > tr > th,
| |
| table.deldot_table > * > tr > td {
| |
| border: 1px solid #2d5296;
| |
| }
| |
|
| |
| table.deldot_table > * > tr > th {
| |
| color: #fff;
| |
| background-color: #2d5296;
| |
| text-align: center;
| |
| }
| |
|
| |
| table.deldot_table * ul {
| |
| padding: 0;
| |
| margin: 0;
| |
| }
| |
|
| |
| table.deldot_table * li {
| |
| padding: 5px 0 ;
| |
| margin: 0;
| |
| }
| |
|
| |
| table.deldot_table * th,
| |
| table.deldot_table * td {
| |
| padding: 10px;
| |
| }
| |
|
| |
|
| table.deldot_table * ul,
| | /* Float Table of Contents to the right */ |
| table.deldot_table * ol {
| | #toc { |
| margin: 0 0 0 30px;
| | float: right; |
| | margin:0 0 1em 1em; |
| | position:fixed; |
| | top:100px; |
| | right:10px; |
| | max-width:50%; |
| | max-height: 1%; /* Adjust the maximum height as needed */ |
| | overflow-y: scroll; |
| } | | } |