Difference between revisions of "User:Soli/header"

From wiki
Jump to navigation Jump to search
 
(30 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
+
 
  |
+
Change HEADER IMAGE HERE!
  ---- Spotlight article 2
+
-->
|
+
<div style="max-width:100%;">[[File:Accessible-together-transparent.png|frameless|500px|center|A group for of people with differing assistive needs.]]</div>
-- Main (LOCKED)
+
<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;">
  ---- Main-a
+
<!--
    |
+
 
    ---- Main-a-article
+
EDIT H2 HEADER HERE! (H1 is inserted as the WIKI PAGE TITLE)
    |
+
-- -->
  ---- Main-b
+
<strong>OPSA: Office of Public Service Accessibility</strong></div>
    |
+
</h2>
    ---- Main-b-article
+
</div>
    |
+
<div style="text-align:center; padding-bottom:10px;">
  ---- Main-c and so on...
+
<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;">
    |
+
<!--
    ---- Main-c-article and so on...
+
 
|
+
EDIT HEADER CAPTION here!
-- Footer (LOCKED)
+
-- -->
-->
+
<strong>The Accessibility Hub serves as a source for guidance, tools, tips, and best practices for
<div class="carousel-caption text left"
+
departments and agencies. The hub will be developed over time with the engagement of persons
    style="box-sizing:border-box;
+
with disabilities and other public servants.
                display:block;
+
</strong></div>
                font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
+
</h3>
                font-size:14px;
+
</div>
                line-height:20px;
+
</div>
                position:relative;
+
<div style="text-align:center; padding-bottom:10px; padding-top:10px;"><p>
                text-align:center;
+
<!--
                text-size-adjust:100%;
+
 
                width:100%;
+
Button STARTS HERE!
                -webkit-tap-highlight-color:rgba(0, 0, 0, 0);">
+
EDIT button LABEL and LINK here (see link at end of this DIV)!
    <div style="background-color:#1C304A;
+
-- -->
                    background-size:cover;
+
<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
                    box-sizing:border-box;
+
style="color:#ffffff;">Learn more about OPSA</span>]]</strong></div></div></p>
                    display:block;
+
</div>
                    font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
+
<!--
                    font-size:14px;
+
 
                    height:auto;
+
 
                    line-height:20px;
+
FRENCH content starts here!
                    max-width:100%;
+
-- -->
                    margin-bottom:20px;
+
@fr|
                    padding-bottom:20px;
+
<div style="display:block; position:relative; text-align:center; width:100%;">
                    position:relative;
+
<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%;">
                    text-size-adjust:100%;
+
<!--
                    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
+
 
                    width=100%;">
+
Header image HERE!
        <span style="padding-bottom:20px;height:auto;max-width:100%;">[[File:Accessible-together.jpg|frameless|5500px|center|caption]]</span>
+
-->
        <h1 style="border-bottom-color:#1C304A;"><span style="box-sizing:border-box;
+
<div style="max-width:100%;">[[File:Accessible-together-transparent.png|frameless|500px|center|A group for of people with differing assistive needs.]]</div>
                    color:rgb(255, 255, 255);
+
<h2 style="border-bottom:0px;">
                    display:inline;
+
<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-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
+
<!--
                    font-size:60px;
+
 
                    font-weight:700;
+
EDIT H2 header HERE! (H1 is inserted as the WIKI PAGE TITLE)
                    height:auto;
+
-- -->
                    line-height:70px;
+
<strong>FR - OPSA: Office of Public Service Accessibility</strong></div>
                    padding-left:20px;
+
</h2>
                    padding-right:20px;
+
</div>
                    text-align:center;
+
<div style="text-align:center; padding-bottom:10px;">
                    text-shadow:rgba(0, 0, 0, 0.6) 0px 1px 2px;
+
<h3 style="border-bottom-color:#fff;">
                    text-size-adjust:100%;
+
<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;">
                    width:auto;
+
<!--
                    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);">
+
 
            <strong>OPSA</strong></h1>
+
EDIT H3 HEADER here!
        <h2 style="border-bottom-color:#1C304A;"><span style="box-sizing:border-box;
+
-- -->
                    color:rgb(255, 255, 255);
+
<strong>The Accessibility Hub serves as a source for guidance, tools, tips, and best practices for
                    display:inline;
+
departments and agencies. The hub will be developed over time with the engagement of persons
                    font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
+
with disabilities and other public servants.
                    font-size:50px;
+
</strong></div>
                    font-weight:700;
+
</h3>
                    height:auto;
+
</div>
                    line-height:70px;
 
                    padding-left:20px;
 
                    padding-right:20px;
 
                    text-align:center;
 
                    text-shadow:rgba(0, 0, 0, 0.6) 0px 1px 2px;
 
                    text-size-adjust:100%;
 
                    width:auto;
 
                    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);"><strong>Office of Public Service Accessibility</strong></span></h2>
 
    </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:30px;
 
                        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;
+
Button START HERE!
            padding-top:10px;">
+
EDIT button LABEL and LINK here (see link at end of this DIV)!
    <p><span class="btn btn-lg btn-primary"
+
-- -->
            style="background-color:rgb(255, 255, 255);
+
<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
                    background-image:none;
+
style="color:#ffffff;">Savior plus</span>]]</strong></div></div></p>
                    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-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>
 +
 +
</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.