@import "cfhtfontface.css"; /* * CFHT Software Group HTML5 Style Sheet (CSS) * * There are three color schemes, selectable as: * * A CFHT-blue theme used on software.cfht. * A lighter blue theme used in our Trac. * For those who prefer dark backgrounds. * * Rather than selecting class="cfhtdark", the default theme should * generally be a light one. Use /res/js/dark.js to change the * theme to dark when the page loads depending on user settings. */ /* Fonts */ body.cfhttrac, body.cfhtsoft, body.cfhtdark { font: normal 16px arimo,sans-serif; line-height: 1.3; } .widemenu li > a, .widemenu li > b { font-family: 'cfht'; font-weight: 600; /* demi */ } .smallmenu div > input, .smallmenu li > a, .menubox li > a, .menubox li > b { font-family: 'cfht'; font-weight: 600; /* demi */ text-transform: uppercase; } /* Colors */ body.cfhtsoft { color: #000; background: #fff; } .cfhtsoft .smallmenu div > input, .cfhtsoft .smallmenu li > a, .cfhtsoft .menubox li > a, .cfhtsoft .widemenu li > a { background: #e4e4e4; border-color: #ccc; } .cfhtsoft .menubox li > b, .cfhtsoft .widemenu li > b { background: #f9f9f9; border-color: #fff; } .cfhtsoft { --shadowtop: #cff; --shadowbot: #777; --linkbg: #eee; --linkfg: #23a; --linkhoverbg: #ff0; } .cfhtsoft .menutop { background: #ddd; } .cfhtsoft .tracctxnav { font-family: "cfht"; background: #45d; color: #fff; } .cfhtsoft .smallmenu li > a { text-decoration: none; color: #45d; } /* Trac Colors */ body.cfhttrac { color: #000; background: #fff; } .cfhttrac .smallmenu div > input, .cfhttrac .smallmenu li > a, .cfhttrac .menubox li > a, .cfhttrac .widemenu li > a { background: #e4e4e4; border-color: #ccc; } .cfhttrac .menubox li > b, .cfhttrac .widemenu li > b { background: #f9f9f9; border-color: #fff; } .cfhttrac { --shadowtop: #cff; --shadowbot: #777; --linkbg: #eee; --linkfg: #23a; --linkhoverbg: #ff0; } .cfhttrac .menutop { background: #7da9c9; } .cfhttrac .tracctxnav { font-family: "cfht"; background: #23a; color: #fff; } .cfhttrac .smallmenu li > a { text-decoration: none; color: #23a; } /* Dark Colors */ body.cfhtdark { color: #eee; background: #222; } .cfhtdark #xproj-search { color: #222; } .cfhtdark input[type=text] { background: #5df; color: #222; } .cfhtdark input[type=date] { background: #5df; color: #222; } .cfhtdark input[type=button], .cfhtdark input[type=reset], .cfhtdark input[type=submit], .cfhtdark .smallmenu div > input, .cfhtdark .smallmenu li > a, .cfhtdark .menubox li > a, .cfhtdark .widemenu li > a { background: #249; border-color: #359; color: #0ff; } .cfhtdark div > input { color: #8ff; } .cfhtdark .menubox li > b, .cfhtdark .widemenu li > b { background: #111; border-color: #444; } .cfhtdark { --shadowtop: #27c; --shadowbot: #111; --linkbg: #239; --linkfg: #9df; --linkhoverbg: #46a; } .cfhtdark .menutop { background: #444; } .cfhtdark .tracctxnav { font-family: "cfht"; background: #249; color: #ddf; } .cfhtdark .smallmenu li > a { text-decoration: none; color: #39f; } /* * Additional overrides for Trac CSS to make Dark Mode work. */ .cfhtdark #ticket { background: #224; } .cfhtdark .tickets tbody tr:hover { background: #eed; color: #ee2; } .cfhtdark #content { background: #111; } .cfhtdark #content.search #results dt a { color: #3cf; } .cfhtdark #prefs { background: #666; } .cfhtdark #prefs fieldset legend { color: #fff; } .cfhtdark #info { background: #666; color: #eee; } .cfhtdark #info .props { background: #666; color: #eee; } .cfhtdark table.wiki th { border: 1px solid #555; } .cfhtdark table.wiki td { border: 1px solid #555; background: #252525; } .cfhtdark pre.wiki { background: #222; border-color: #444; } .cfhtdark table.wiki th { background: #333; } .cfhtdark table.listing th { background: #444; } .cfhtdark table.listing td { background: #000; border: 1px solid #444; } .cfhtdark table.code th { background: #444; } .cfhtdark table.code td { background: #111; } .cfhtdark .wiki-toc { background: #335; color: #5df; border: 1px outset #669; } .cfhtdark #dirlist td.change { color: #ddd; } .cfhtdark h2 { background: #333; color: #6bf; } .cfhtdark h3 { color: #6bf; } .cfhtdark dt > :active { background: #055; } .cfhtdark dt > :link { color: #0af; } .cfhtdark table.progress tbody td { background: #444; } .cfhtdark table.progress tbody td.closed { background: #173; } body.cfhtdark a:active { background: #055; background-repeat: no-repeat; } body.cfhtdark a:link { color: #3cf; } body.cfhtdark a:visited { color: #3cf; } body.cfhtdark a:hover { background: #055; background-repeat: no-repeat; } body.cfhtdark dt:hover { background: #055; background-repeat: no-repeat; } .cfhtdark pre.diff { background: #111; } .cfhtdark table.trac-diff thead th { background: #333; } .cfhtdark table.trac-diff thead td { background: #333; } .cfhtdark table.trac-diff tbody th { background: #333; } .cfhtdark table.trac-diff tbody.skipped td { background: #333; } .cfhtdark table.trac-diff td { background: #000; } .cfhtdark .diff table.inline tbody.mod td.l, .cfhtdark .diff table.inline tbody.rem td.l { background: #611; color: #fff; } .cfhtdark .diff table.inline tbody.mod td.r, .cfhtdark .diff table.inline tbody.add td.r { background: #050; color: #fff; } .cfhtdark .diff li.entry { background: #111; border-color: #222; } .cfhtdark .info h2 { background: #555; border-color: #151; } .cfhtdark :link, .cfhtdark :visited, .cfhtdark dt em, .cfhtdark .milestone .info h2 em, .cfhtdark #content.report h3 a em, .cfhtdark #content.build h2.config :link, .cfhtdark #content.build h2.config :visited, .cfhtdark .plugin h3 a { color: #1fc; } .cfhttrac body a:link { color: var(--linkfg); background: transparent; } .cfhttrac body a:visited { color: var(--linkfg); background: transparent; } .cfhttrac body a:hover { color: var(--linkfg); background: var(--linkhoverbg); } .cfhttrac body a:active { color: var(--linkfg); background: transparent; } .cfhtsoft body a:link { color: var(--linkfg); background: transparent; } .cfhtsoft body a:visited { color: var(--linkfg); background: transparent; } .cfhtsoft body a:hover { color: var(--linkfg); background: var(--linkhoverbg); } .cfhtsoft body a:active { color: var(--linkfg); background: transparent; } .cfhtdark body a:link { color: var(--linkfg); background: transparent; } .cfhtdark body a:visited { color: var(--linkfg); background: transparent; } .cfhtdark body a:hover { color: var(--linkfg); background: var(--linkhoverbg); } .cfhtdark body a:active { color: var(--linkfg); background: transparent; } /* Set link style */ .smallmenu li > a:link, .menubox li > a:link, .widemenu li > a:link { text-decoration: none; color: var(--linkfg); background: var(--linkbg); } .smallmenu li > a:visited, .menubox li > a:visited, .widemenu li > a:visited { text-decoration: none; color: var(--linkfg); background: var(--linkbg); } .smallmenu div a:hover, .menubox li > a:hover, .widemenu li > a:hover { text-decoration: none; color: var(--linkfg); background: var(--linkhoverbg); } .smallmenu li > a:active, .menubox li > a:active, .widemenu li > a:active { text-decoration: none; color: var(--linkfg); background: var(--linkbg); } /* Layout and Sizes */ /* Disable unhelpful automatic "font boost" behavior of some browsers. */ * { -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } h1 { text-align: center; } body.cfhtsoft { margin: 0 0 0 0; } body.cfhttrac { margin: 0 0 0 0; } body.cfhtdark { margin: 0 0 0 0; } .menutop { text-align: center; position: relative; padding-top: 0.2em; padding-bottom: 0.2em; padding-left: 0.3em; margin: 0; } .menuimg img { position: absolute; left: 0; top: 0; width: auto; height: 4.5em; } .smallmenu div { position: absolute; right: 0.3em; top: 0.1em; width: 24vw; height: 4.5em; text-align: right; } .smallmenu li > a, .smallmenu div > a, .smallmenu span > input, .smallmenu div > input { display: inline-block; width: 8em; white-space: nowrap; font-size: 10pt; padding: .1em 0 .1em 0; margin: 0; text-align: center; box-sizing: border-box; box-shadow: 1px 1px 3px 0 var(--shadowbot); border-width: 1px; border-radius: 3px; border-style: solid; } .smallmenu div > input { margin: .1em; } .menubox { margin: 0 22vw 0 22vw; } .widemenu { list-style: none; padding: 0; box-sizing: border-box; } .menubox { list-style: none; padding: 0; box-sizing: border-box; max-width: 60em; /* With

width 15em, this makes up to 3 columns. */ } .menubox li { width: 15em; display: inline-block; position: relative; padding: 0.2em 0.1em 0.2em 0.1em; margin: 0; box-sizing: border-box; } .widemenu li { padding: 0.25em 5vw 0.25em 5vw; } .smallmenu li { display: inline-block; position: relative; padding: 0.2em 0.1em 0.2em 0.1em; margin: 0; box-sizing: border-box; } .smallmenu ul { margin: 0; padding: 0; } .menubox li > a, .menubox li > b, .widemenu li > a { display: block; width: 100%; white-space: nowrap; font-size: 13pt; padding: .1em 0 .1em 0; margin: 0; position: relative; text-align: center; box-sizing: border-box; box-shadow: 1px 1px 2px 0 var(--shadowbot), -1px -1px 1.6px var(--shadowtop); border-width: 1px; border-radius: 4px; border-style: solid; } .tracctxnav div { width: 100%; height: 15px; text-align: center; } /* * Make fonts and links much bigger for touch devices. */ @media (pointer:none), (pointer:coarse) and (max-width:640px) { * { font-size: 3.4vw; } .menubox li { width: 10.5em; } .widemenu li > a, .menubox li > a, .menubox li > b { padding: .5em 0 .5em 0; font-size: 3.9vw; border-radius: 5px; } .smallmenu span > input, .smallmenu div > input, .smallmenu li > a { padding: .5em 0 .5em 0; font-size: 3.2vw; border-radius: 4px; } .smallmenu div { width: 60vw; margin: 1em 0 0 0; } /* Place image above menu */ .menuimg img { position: static; width: 100%; height: auto; } .menubox { margin: 0; } } /* * Printing */ @media print { .menuimg, .menutop { display: none !important; } }