Difference between revisions of "Template:Digital Talent Nav"

From wiki
Jump to navigation Jump to search
m (Removed Ecosystem for Digital Talent tab)
 
(44 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 +
<!--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:
 
{{#css:
 
+
.menubar a:visited {
.headcontainer {
+
  color: #FFFFFF;
font-family: "Open Sans",sans-serif;
 
font-style: normal;
 
font-weight: 200;
 
}
 
 
 
h1 {
 
color: #00A196;
 
padding-bottom: 0px;
 
font-size: 40px !important;
 
font-family: "Open Sans",sans-serif !important;
 
        border: none;
 
}
 
 
 
.headercontent
 
{
 
width:900px;
 
margin-left: auto;
 
margin-right: auto;
 
 
}
 
}
  
.menubar
+
.menubar {
{
+
  background-color:#3D3D3D;
background-color:#3D3D3D;
+
  height: auto;
height: 50px;
+
  padding: 0;
padding: 0;
+
  margin: 0;
margin: 0;
+
  font-family: "Open Sans",sans-serif;
 
+
  font-style: normal;
}
+
  font-weight: 200;
  
.headercontent p
 
{
 
color: #000000;
 
font-size: 20px;
 
padding: 0;
 
margin: 0;
 
 
}
 
}
.menubar ul
 
{
 
  list-style-type: none;
 
  margin: 0;
 
  padding: 0;
 
  overflow: hidden;
 
  padding: auto; /* Remove padding */
 
  margin: auto; /* Remove margins */
 
  
width: 900px;
+
.menubar ul {
 +
  list-style-type: none;
 +
  margin: 0;
 +
  padding: 0;
 +
  overflow: hidden;
 +
  width: 100%;
 
}
 
}
  
.menubar li
+
.menubar li {
{
+
  display: inline-block;
  display: block;
+
  color: #FFFFFF;
  color: #FFFFFF;
+
  text-align: center;
  text-align: center;
+
  padding-top: 15px;
  padding: 15px 15px;
+
  padding-bottom: 15px;
  text-decoration: none;
+
  text-decoration: none;
float: left;
 
 
}
 
}
  
.menubar li:hover
+
.menubar li:hover {
{
+
  background: #000000;
background: #000000;
 
 
}
 
}
  
 
.menubar li:focus
 
.menubar li:focus
 
{
 
{
background: #000000;
+
  background: #000000;
 
}
 
}
  
li a
+
.menubar li a {
{
+
  color: white;
color: white;
+
  padding: 20px;
 
}
 
}
li a:hover:not(.active) {
+
.menubar li a:hover:not(.active) {
  color: #FFFFFF;
+
  color: #FFFFFF;
 
}
 
}
  
Line 82: Line 55:
 
}
 
}
  
.hero_header {
+
.rainbow_bar {
color: #FFFFFF;
+
  height: 20px;
text-align: center;
+
  background: linear-gradient(90deg,#ffad31,#52c765,#27c9bc,#ff5958);
margin-top: 0px;
+
  margin-bottom: 30px;
margin-right: 0px;
 
margin-bottom: 0px;
 
margin-left: 0px;
 
letter-spacing: 4px;
 
}
 
/* Hero Section */
 
.hero {
 
background-color: #FFFFFF;
 
padding-top: 30px;
 
padding-bottom: 30px;
 
}
 
 
 
.rainbow_bar
 
{
 
height: 20px;
 
background: linear-gradient(90deg,#ffad31,#52c765,#27c9bc,#ff5958);
 
 
}
 
}
  
 
}}
 
}}
<div class="headcontainer">
 
  <div class="hero" id="hero">
 
    <div class="headercontent">
 
      <h1>Digital Talent</h1>
 
      <p>Help grow digital talent and skills in the government of Canada</p>
 
    </div>
 
  </div>
 
  <!-- About Section -->
 
 
 
<div class="menubar">
 
<div class="menubar">
       <ul>
+
       <ul role="menu">
         <li>[[Digital_Talent|Home]]</li>
+
         <li role="menuitem">[[Digital_Talent|Home]]</li>
         <li>[[Digital_Talent/Digital_Talent_Strategy|Digital Talent Strategy]]</li>
+
         <li role="menuitem">[[Digital_Talent/Digital_Talent_Strategy|Digital Talent Strategy]]</li>
         <li>[[Digital_Talent/Digital_Skills|Digital Skills Initiative]]</li>
+
         <li role="menuitem">[[Digital_Talent/Digital_Skills|Digital Skills Initiative]]</li>  
         <li>[[Digital_Talent/Ecosystem_for_Digital_Talent|Ecosystem for Digital Talent]]</li>
+
         <!--<li role="menuitem">[[Digital_Talent/Ecosystem_for_Digital_Talent|Ecosystem for Digital Talent]]</li>-->
         <li>[[Digital_Talent/Contact|Contact]]</li>
+
        <li role="menuitem">[[Digital_Talent/Learning_Paths|Learning Paths]]</li>
 +
        <li role="menuitem">[[Digital_Talent/Digital_Badges|Digital Badges]]</li>
 +
         <li role="menuitem">[[Digital_Talent/Contact|Contact]]</li>
 
       </ul>
 
       </ul>
 
   </div>
 
   </div>
 
   <div class="rainbow_bar"></div>
 
   <div class="rainbow_bar"></div>
 
<!--Navigation coding ENDS-->
 

Latest revision as of 12:50, 10 July 2024