705
edits
Changes
Jump to navigation
Jump to search
Template:DTL Comm Hub Nav (view source)
Revision as of 12:50, 14 November 2023
, 12:50, 14 November 2023Created page with "<!--The following line of code hides the page title--> {{DISPLAYTITLE:<span style="position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px);">{{FULLPAGE..."
<!--The following line of code hides the page title-->
{{DISPLAYTITLE:<span style="position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px);">{{FULLPAGENAME}}</span>}}
{{#css:
.menubar a:visited {
color: #FFFFFF;
}
.menubar {
background-color:#3D3D3D;
height: auto;
padding: 0;
margin: 0;
font-family: "Open Sans",sans-serif;
font-style: normal;
font-weight: 200;
}
.menubar ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
width: 100%;
}
.menubar li {
display: inline-block;
color: #FFFFFF;
text-align: center;
padding-top: 15px;
padding-bottom: 15px;
text-decoration: none;
}
.menubar li:hover {
background: #000000;
}
.menubar li:focus
{
background: #000000;
}
.menubar li a {
color: white;
padding: 20px;
}
.menubar li a:hover:not(.active) {
color: #FFFFFF;
}
.active {
color: #FFFFFF;
}
.rainbow_bar {
height: 20px;
background: linear-gradient(90deg,#ffad31,#52c765,#27c9bc,#ff5958);
}
}}
<div class="menubar">
<ul role="menu">
<li role="menuitem">[[Digital_Talent|Home]]</li>
<li role="menuitem">[[Digital_Talent/Digital_Talent_Strategy|Resource Hub]]</li>
<li role="menuitem">[[Digital_Talent/Digital_Skills|Talent Quest]]</li>
<li role="menuitem">[[Digital_Talent/Ecosystem_for_Digital_Talent|Community/Program Updates]]</li>
<li role="menuitem">[[Digital_Talent/EX_Learning_Paths|Event Calendar]]</li>
</ul>
</div>
<div class="rainbow_bar"></div>
{{DISPLAYTITLE:<span style="position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px);">{{FULLPAGENAME}}</span>}}
{{#css:
.menubar a:visited {
color: #FFFFFF;
}
.menubar {
background-color:#3D3D3D;
height: auto;
padding: 0;
margin: 0;
font-family: "Open Sans",sans-serif;
font-style: normal;
font-weight: 200;
}
.menubar ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
width: 100%;
}
.menubar li {
display: inline-block;
color: #FFFFFF;
text-align: center;
padding-top: 15px;
padding-bottom: 15px;
text-decoration: none;
}
.menubar li:hover {
background: #000000;
}
.menubar li:focus
{
background: #000000;
}
.menubar li a {
color: white;
padding: 20px;
}
.menubar li a:hover:not(.active) {
color: #FFFFFF;
}
.active {
color: #FFFFFF;
}
.rainbow_bar {
height: 20px;
background: linear-gradient(90deg,#ffad31,#52c765,#27c9bc,#ff5958);
}
}}
<div class="menubar">
<ul role="menu">
<li role="menuitem">[[Digital_Talent|Home]]</li>
<li role="menuitem">[[Digital_Talent/Digital_Talent_Strategy|Resource Hub]]</li>
<li role="menuitem">[[Digital_Talent/Digital_Skills|Talent Quest]]</li>
<li role="menuitem">[[Digital_Talent/Ecosystem_for_Digital_Talent|Community/Program Updates]]</li>
<li role="menuitem">[[Digital_Talent/EX_Learning_Paths|Event Calendar]]</li>
</ul>
</div>
<div class="rainbow_bar"></div>
