https://wiki.gccollab.ca/index.php?action=history&feed=atom&title=Template%3ADFO-IM-gcplus-css-override 2026-04-09T06:19:30Z Revision history for this page on the wiki MediaWiki 1.35.2 https://wiki.gccollab.ca/index.php?title=Template:DFO-IM-gcplus-css-override&diff=20717&oldid=prev 2020-03-30T14:50:12Z

<p>Created page with &quot;&lt;html&gt; &lt;style&gt; /* ===== override.css Purpose: To override the initial core.css styles. Dependancy: - core.css (runs first) -- override.css (runs second) Author: Marco Ba...&quot;</p> <p><b>New page</b></p><div>&lt;html&gt;<br /> &lt;style&gt;<br /> <br /> /* =====<br /> override.css<br /> Purpose: To override the initial core.css styles.<br /> <br /> Dependancy: <br /> - core.css (runs first)<br /> -- override.css (runs second)<br /> <br /> Author: Marco Battilana (marco.battilana@dfo-mpo.gc.ca) - Fisheries and Oceans Canada<br /> Twitter: @crazybat<br /> <br /> Revision History: <br /> ****<br /> Version 1.0<br /> (26 Oct 2018)<br /> - Brought in existing GCpedia functionality for pages. Uses same links, just styled and displayed different.<br /> <br /> Known Issues:<br /> - Incorporate additional GCpedia functionality: Language flipper, log in, etc. (PARTIALLY SOLVED! Still need to bring over remaining GCpedia items)<br /> -- Search GCpedia<br /> -- Categories<br /> -- Others???<br /> ****<br /> <br /> References:<br /> GCpedicure: www.gcpedia.gc.ca/wiki/GCpedicure<br /> Bootstrap: getbootstrap.com<br /> */<br /> <br /> /* ==== To override the initial override from core.css. DO NOT REMOVE ==== */<br /> <br /> /* === GCpedia Head content (Personal, GCpedia Tools) === */<br /> div#mw-head {<br /> position: absolute;<br /> top: -145px;<br /> display: block;<br /> height: 0;<br /> } <br /> div#mw-head #left-navigation,<br /> div#mw-head #right-navigation .pull-left,<br /> div#mw-head #right-navigation #p-cactions {<br /> display: none;<br /> } <br /> <br /> div#mw-head #p-personal {<br /> position: fixed;<br /> /*bottom: -97px;*/<br /> bottom: -109px;<br /> /*right: 140px;*/<br /> right: 82px;<br /> display: block;<br /> width: auto;<br /> }<br /> <br /> /* == NOTE: The Eng / Fr button only changed the language of GCpedia UI, NOT YOUR CONTENT. ==*/<br /> div#mw-head #right-navigation #p-views {<br /> position: fixed;<br /> /*bottom: -30px;*/<br /> bottom: -40px;<br /> display: block;<br /> right: 20px; <br /> } <br /> div#mw-head #right-navigation #p-views ul {<br /> background: #eee;<br /> border: solid hsla(0, 0%, 96%, 0.5);<br /> transition: 0.2s; <br /> border-top-left-radius: 10px;<br /> border-top-right-radius: 10px;<br /> }<br /> div#mw-head #p-personal ul {<br /> transition: 0.2s;<br /> }<br /> <br /> div#mw-head #right-navigation #p-views ul::before {<br /> color: white;<br /> background: #222;<br /> display: block;<br /> float: right;<br /> margin-bottom: 5px;<br /> content: ' Views \A\A\A\A\A';<br /> white-space: pre-wrap;<br /> position: relative;<br /> top: -30px;<br /> border-top-left-radius: 10px;<br /> border-top-right-radius: 10px;<br /> border: solid 1px #777;<br /> padding: 0 5px;<br /> }<br /> div#mw-head #p-personal ul::before {<br /> color: white;<br /> background: #222;<br /> display: block;<br /> float: right;<br /> margin-bottom: 5px;<br /> content: ' Personal Tools \A\A\A\A';<br /> white-space: pre-wrap;<br /> position: relative;<br /> top: -30px;<br /> border-top-left-radius: 10px;<br /> border-top-right-radius: 10px;<br /> border: solid 1px #777;<br /> padding: 0 5px;<br /> }<br /> <br /> div#mw-head #right-navigation #p-views:hover {<br /> bottom: 30px;<br /> transition: 0.2s; <br /> z-index: 10000;<br /> }<br /> div#mw-head #p-personal:hover {<br /> /*bottom: -35px;*/<br /> bottom: -43px;<br /> transition: 0.2s;<br /> }<br /> <br /> div#mw-head #right-navigation #p-views ul li,<br /> div#mw-head #p-personal ul li {<br /> background-image: none;<br /> background: #eee;<br /> height: 30px;<br /> text-align: center;<br /> }<br /> <br /> div#mw-head #right-navigation #p-views ul li#ca-ve-edit {<br /> display: none;<br /> }<br /> <br /> div#mw-head #right-navigation #p-search #simpleSearch {<br /> height: inherit;<br /> position: fixed;<br /> right: 16px;<br /> top: 29px;<br /> }<br /> /*TO DO Have search show on very small devices, but results don't show very well on older template. Staying invisible for now.*/<br /> @media (max-width: 767px) {<br /> div#mw-head #right-navigation #p-search {<br /> display: none;<br /> }<br /> }<br /> @media screen {<br /> div#mw-head #right-navigation #p-search #simpleSearch #searchInput {<br /> font-size: inherit;<br /> padding: 0 0 0 5px;<br /> }<br /> }<br /> @media screen {<br /> div#mw-head #right-navigation #p-search #simpleSearch input {<br /> background-color: none;<br /> }<br /> }<br /> <br /> @media screen {<br /> div#simpleSearch #searchButton, div#simpleSearch #mw-searchButton {<br /> background-color: #ccc;<br /> }<br /> }<br /> <br /> <br /> .icon#ca-unfavorite a, .icon#ca-favorite a {<br /> padding-top: 2.3em;<br /> }<br /> <br /> @media screen {<br /> div.vectorTabs {<br /> background-image: none;<br /> background-image: none !ie;<br /> }<br /> }<br /> @media screen {<br /> div.vectorTabs span {<br /> display: inherit;<br /> background-image: none;<br /> background-image: none !ie;<br /> }<br /> }<br /> @media screen {<br /> div.vectorTabs ul {<br /> height: auto;<br /> }<br /> }<br /> @media screen {<br /> div.vectorTabs ul li {<br /> line-height: 0;<br /> }<br /> }<br /> @media screen {<br /> #p-personal {<br /> top: auto;<br /> background: #eee;<br /> border: solid hsla(0, 0%, 96%, 0.5);<br /> border-top-left-radius: 10px;<br /> border-top-right-radius: 10px;<br /> }<br /> }<br /> @media screen {<br /> #p-personal ul {<br /> padding-left: 0;<br /> }<br /> }<br /> @media screen {<br /> #p-personal li {<br /> font-size: 0.8em;<br /> padding: 0 0.375em;<br /> }<br /> }<br /> <br /> /*TO DO: Figure out a way to make GCpedia tools not sticky on the footer with small resolutions. For now, don't show as it's hard to edit a GCpedia page with such a small window.*/<br /> @media (max-width: 767px) {<br /> div#mw-head #right-navigation #p-views {<br /> display: none;<br /> }<br /> }<br /> @media (max-width: 767px) {<br /> div#mw-head #p-personal {<br /> display: none;<br /> }<br /> }<br /> <br /> /* === GCpedia Left Navigation content === */<br /> /* == Eng / Fr button (Used to flip the language of your CONTENT ==*/<br /> <br /> div#mw-panel {<br /> position: absolute;<br /> left: -9999px;<br /> display: block;<br /> } <br /> <br /> div#mw-panel #p-lang .interlanguage-link {<br /> position: fixed;<br /> top: -2px;<br /> right: 17px;<br /> display: block;<br /> font-size: inherit;<br /> }<br /> <br /> @media (max-width: 767px) {<br /> div#mw-panel #p-lang .interlanguage-link {<br /> position: fixed;<br /> /*top: -4px;*/<br /> left: 0;<br /> width: 95px;<br /> height: 0px;<br /> }<br /> }<br /> div#mw-panel #p-lang .interlanguage-link a {<br /> color: #fff;<br /> /*padding: 15px;*/<br /> padding-left: 71px;<br /> padding-right: 71px;<br /> line-height: 2.1rem;<br /> display: block;<br /> /*background: #333;*/<br /> /*border: solid 1px #aaa;*/<br /> font-weight: bold;<br /> }<br /> @media (max-width: 767px) {<br /> div#mw-panel #p-lang .interlanguage-link a {<br /> line-height: 0;<br /> padding-left: 10px;<br /> padding-right: 10px;<br /> display: inline;<br /> }<br /> } <br /> div#mw-panel #p-lang .interlanguage-link a::after {<br /> /*content:'';<br /> display:block;<br /> width:0px;<br /> height:2px;<br /> background:#00d6fe;<br /> transition: 0.2s;*/<br /> }<br /> div#mw-panel #p-lang .interlanguage-link a:hover::after {<br /> /*width:100%;*/<br /> }<br /> <br /> &lt;/style&gt;<br /> &lt;/html&gt;</div>

Zahid.siddiqi