Difference between revisions of "User:Soli/header"

From wiki
Jump to navigation Jump to search
 
(25 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<!-- STRUCTURE AND INSTRUCTIONS:
+
__NOTOC__
 +
<multilang>
 +
<!--
  
Home (LOCKED)
+
ENGLISH content starts here!
|
+
-- -->
-- Header (LOCKED) <<< YOU ARE HERE - NOTHING TO DO!
+
@en|
|
+
<div style="display:block; position:relative; text-align:center; width:100%;">
-- Spotlight (LOCKED)
+
<div style="background: linear-gradient(90deg, rgba(28,48,74,0.1) 0%, rgba(98, 185, 229,1) 50%, rgba(28,48,74,0.1) 100%); padding-bottom:10px; padding-top:10px; width=100%;">
|
+
<!--
  ---- Spotlight article 1
 
  |
 
  ---- Spotlight article 2
 
|
 
-- Main (LOCKED)
 
|
 
  ---- Main-a
 
    |
 
    ---- Main-a-article
 
    |
 
  ---- Main-b
 
    |
 
    ---- Main-b-article
 
    |
 
  ---- Main-c and so on...
 
    |
 
    ---- Main-c-article and so on...
 
|
 
-- Footer (LOCKED)
 
-->
 
<div class="carousel-caption text left"
 
    style="box-sizing:border-box;
 
                display:block;
 
                position:relative;
 
                text-align:center;
 
                text-size-adjust:100%;
 
                width:100%;
 
                -webkit-tap-highlight-color:rgba(0, 0, 0, 0);">
 
    <div style="background-color:#1C304A;
 
                    background-size:cover;
 
                    box-sizing:border-box;
 
                    display:block;
 
                    max-width:100%;
 
                    position:relative;
 
                    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
 
                    width=100%;">
 
        <span style="max-width:100%;">[[File:Accessible-together.jpg|frameless|3000px|center|caption]]</span>
 
  
        <h1 style="border-bottom-color:#1C304A;"><span style="box-sizing:border-box;
+
Change HEADER IMAGE HERE!
                    color:rgb(255, 255, 255);
+
-->
                    display:inline;
+
<div style="max-width:100%;">[[File:Accessible-together-transparent.png|frameless|500px|center|A group for of people with differing assistive needs.]]</div>
                    font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
+
<h2 style="border-bottom:0px;">
                    font-size:60px;
+
<div style="color:#1C304A; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:35px; font-weight:700; padding-left:20px; padding-right:20px; text-align:center; text-shadow:rgba(255, 255, 255, 0.6) 0px 1px 2px;">
                    font-weight:700;
+
<!--
                    height:auto;
+
 
                    margin-block-end:0px;
+
EDIT H2 HEADER HERE! (H1 is inserted as the WIKI PAGE TITLE)
                    margin-block-start:0px;
+
-- -->
                    margin-bottom:0px;
+
<strong>OPSA: Office of Public Service Accessibility</strong></div>
                    margin-inline-end:0px;
+
</h2>
                    margin-inline-start:0px;
+
</div>
                    margin-left:0px;
+
<div style="text-align:center; padding-bottom:10px;">
                    margin-right:0px;
+
<div style="color:#1C304A; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:20px; padding-left:40px; padding-right:40px; text-align:center; text-shadow:rgba(255, 255, 255, 0.6) 0px 1px 2px;">
                    margin-top:0px;
+
<!--
                    padding-left:20px;
+
 
                    padding-right:20px;
+
EDIT HEADER CAPTION here!
                    text-align:center;
+
-- -->
                    text-shadow:rgba(0, 0, 0, 0.6) 0px 1px 2px;
+
<strong>The Accessibility Hub serves as a source for guidance, tools, tips, and best practices for
                    text-size-adjust:100%;
+
departments and agencies. The hub will be developed over time with the engagement of persons
                    width:auto;
+
with disabilities and other public servants.
                    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);">
+
</strong></div>
            <strong>OPSA: </strong></h1><h2 style="border-bottom-color:#1C304A;"><strong>Office of Public Service Accessibility</strong></span></h2>
+
</h3>
    </div>
+
</div>
    <div class="width"
 
        style="text-align:center;
 
                padding-bottom:20px;">
 
        <p style="background-color:rgb(255, 255, 255);
 
                        box-sizing:border-box;
 
                        color:#1C304A;
 
                        display:inline;
 
                        font-family:Helvetica Neue, Helvetica, Arial, sans-serif;
 
                        font-size:21px;
 
                        font-weight:700;
 
                        height:auto;
 
                        line-height:40px;
 
                        padding-left:40px;
 
                        padding-right:40px;
 
                        text-align:center;
 
                        text-size-adjust:100%;
 
                        width:auto;
 
                        -webkit-tap-highlight-color:rgba(0, 0, 0, 0);">
 
            <strong>The Accessibility Hub serves as a source for guidance, tools, tips, and best
 
                practices for departments and agencies. The hub will be developed over time with the
 
                engagement of persons with disabilities and other public servants.
 
            </strong></p>
 
    </div>
 
 
</div>
 
</div>
<div style="text-align:center;
+
<div style="text-align:center; padding-bottom:10px; padding-top:10px;"><p>
            background-color:#1C304A;
+
<!--
            padding-bottom:10px;
+
 
            padding-top:10px;">
+
Button STARTS HERE!
    <p><span class="btn btn-lg btn-primary"
+
EDIT button LABEL and LINK here (see link at end of this DIV)!
            style="background-color:rgb(255, 255, 255);
+
-- -->
                    background-image:none;
+
<div style="background-color:#1C304A; border-bottom-color:rgb(255, 255, 255); border-bottom-left-radius:6px; border-bottom-right-radius:6px; border-bottom-style:solid; border-bottom-width:1px; border-left-color:rgb(255, 255, 255); border-left-style:solid; border-left-width:1px; border-right-color:rgb(255, 255, 255); border-right-style:solid; border-right-width:1px; border-top-color:rgb(255, 255, 255); border-top-left-radius:6px; border-top-right-radius:6px; border-top-style:solid; border-top-width:1px; line-height:24px; padding-bottom:10px; padding-left:16px; padding-right:16px; padding-top:10px; vertical-align:middle;"><strong>[[Learn more|<span
                    border-bottom-color:rgb(255, 255, 255);
+
style="color:#ffffff;">Learn more about OPSA</span>]]</strong></div></div></p>
                    border-bottom-left-radius:6px;
 
                    border-bottom-right-radius:6px;
 
                    border-bottom-style:solid;
 
                    border-bottom-width:1px;
 
                    border-image-outset:0px;
 
                    border-image-repeat:stretch;
 
                    border-image-slice:100%;
 
                    border-image-source:none;
 
                    border-image-width:1;
 
                    border-left-color:rgb(255, 255, 255);
 
                    border-left-style:solid;
 
                    border-left-width:1px;
 
                    border-right-color:rgb(255, 255, 255);
 
                    border-right-style:solid;
 
                    border-right-width:1px;
 
                    border-top-color:rgb(255, 255, 255);
 
                    border-top-left-radius:6px;
 
                    border-top-right-radius:6px;
 
                    border-top-style:solid;
 
                    border-top-width:1px;
 
                    box-sizing:border-box;
 
                    color:#1C304A;
 
                    cursor:pointer;
 
                    display:inline-block;
 
                    font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
 
                    font-size:18px;
 
                    font-weight:400;
 
                    height:45px;
 
                    line-height:24px;
 
                    margin-bottom:0px;
 
                    padding-bottom:10px;
 
                    padding-left:16px;
 
                    padding-right:16px;
 
                    padding-top:10px;
 
                    text-align:center;
 
                    text-decoration-color:#3e81d2;
 
                    text-decoration-line:none;
 
                    text-decoration-style:solid;
 
                    text-shadow:none;
 
                    text-size-adjust:100%;
 
                    touch-action:manipulation;
 
                    user-select:none;
 
                    vertical-align:middle;
 
                    white-space:nowrap;
 
                    width:150px;
 
                    -webkit-tap-hi">
 
        <strong>[[Learn more|<span style="color:#1C304A;">Learn more</span>]]
 
        </strong></span></p>
 
 
</div>
 
</div>
 +
<!--
 +
 +
 +
FRENCH content starts here!
 +
-- -->
 +
@fr|
 +
<div style="display:block; position:relative; text-align:center; width:100%;">
 +
<div style="background: linear-gradient(90deg, rgba(28,48,74,0.1) 0%, rgba(98, 185, 229,1) 50%, rgba(28,48,74,0.1) 100%); padding-bottom:10px; padding-top:10px; width=100%;">
 +
<!--
 +
 +
Header image HERE!
 +
-->
 +
<div style="max-width:100%;">[[File:Accessible-together-transparent.png|frameless|500px|center|A group for of people with differing assistive needs.]]</div>
 +
<h2 style="border-bottom:0px;">
 +
<div style="color:#1C304A; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:35px; font-weight:700; padding-left:20px; padding-right:20px; text-align:center; text-shadow:rgba(255, 255, 255, 0.6) 0px 1px 2px;">
 +
<!--
 +
 +
EDIT H2 header HERE! (H1 is inserted as the WIKI PAGE TITLE)
 +
-- -->
 +
<strong>FR - OPSA: Office of Public Service Accessibility</strong></div>
 +
</h2>
 +
</div>
 +
<div style="text-align:center; padding-bottom:10px;">
 +
<h3 style="border-bottom-color:#fff;">
 +
<div style="color:#1C304A; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:20px; padding-left:40px; padding-right:40px; text-align:center; text-shadow:rgba(255, 255, 255, 0.6) 0px 1px 2px;">
 +
<!--
 +
 +
EDIT H3 HEADER here!
 +
-- -->
 +
<strong>The Accessibility Hub serves as a source for guidance, tools, tips, and best practices for
 +
departments and agencies. The hub will be developed over time with the engagement of persons
 +
with disabilities and other public servants.
 +
</strong></div>
 +
</h3>
 +
</div>
 +
</div>
 +
<div style="text-align:center; padding-bottom:10px; padding-top:10px;"><p>
 +
<!--
 +
Button START HERE!
 +
EDIT button LABEL and LINK here (see link at end of this DIV)!
 +
-- -->
 +
<div style="background-color:#1C304A; border-bottom-color:rgb(255, 255, 255); border-bottom-left-radius:6px; border-bottom-right-radius:6px; border-bottom-style:solid; border-bottom-width:1px; border-left-color:rgb(255, 255, 255); border-left-style:solid; border-left-width:1px; border-right-color:rgb(255, 255, 255); border-right-style:solid; border-right-width:1px; border-top-color:rgb(255, 255, 255); border-top-left-radius:6px; border-top-right-radius:6px; border-top-style:solid; border-top-width:1px; line-height:24px; padding-bottom:10px; padding-left:16px; padding-right:16px; padding-top:10px; vertical-align:middle;"><strong>[[Learn more|<span
 +
style="color:#ffffff;">Savior plus</span>]]</strong></div></div></p>
 +
</div>
 +
 +
</multilang>

Latest revision as of 17:47, 23 January 2020

A group for of people with differing assistive needs.

OPSA: Office of Public Service Accessibility

The Accessibility Hub serves as a source for guidance, tools, tips, and best practices for departments and agencies. The hub will be developed over time with the engagement of persons with disabilities and other public servants.