Compare commits
No commits in common. "v1.0.30" and "main" have entirely different histories.
32 changed files with 963 additions and 1441 deletions
|
|
@ -5,7 +5,7 @@ WORKDIR /usr/src/app
|
|||
|
||||
# Install app dependencies
|
||||
COPY package*.json ./
|
||||
#COPY .npmrc ./
|
||||
COPY .npmrc ./
|
||||
COPY yarn.lock ./
|
||||
RUN yarn install --frozen-lockfile
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "ba-website",
|
||||
"version": "1.0.30",
|
||||
"version": "1.0.16",
|
||||
"description": "The Bridgeman Accessible main website",
|
||||
"main": "server.js",
|
||||
"scripts": {
|
||||
|
|
@ -10,8 +10,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@BridgemanAccessible/ba-auth": "^1.0.0",
|
||||
"@BridgemanAccessible/ba-logging": "^1.0.0",
|
||||
"@BridgemanAccessible/ba-web-framework": "^1.0.11",
|
||||
"@BridgemanAccessible/ba-web-framework": "^1.0.0",
|
||||
"@BridgemanAccessible/listmonk-node-client": "^1.0.0",
|
||||
"ejs": "^3.1.6",
|
||||
"express": "^4.17.1",
|
||||
|
|
|
|||
|
|
@ -1,65 +0,0 @@
|
|||
<h1>Our Team</h1>
|
||||
<p>
|
||||
Our team is made up of experienced professionals who are passionate about digital accessibility.
|
||||
Here are a few of our key team members:
|
||||
</p>
|
||||
<ul>
|
||||
<%
|
||||
people.forEach(
|
||||
(person) => {
|
||||
%>
|
||||
<li>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item" style="padding: 1rem">
|
||||
<%
|
||||
if (typeof(person.image) !== 'undefined') {
|
||||
%>
|
||||
<img src="img/<%= person.image %>" alt="A photo of <%= person.fname %> <%= person.lname %>">
|
||||
<%
|
||||
}
|
||||
else {
|
||||
%>
|
||||
<i class="fa-solid fa-user fa-3x"></i>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
</div>
|
||||
<div class="side-by-side-item">
|
||||
<h3><%= person.fname %> <%= person.lname %></h3>
|
||||
<p><%= person.position %></p>
|
||||
<%
|
||||
if (typeof(person.bio) !== 'undefined') {
|
||||
%>
|
||||
<p><%= person.bio %></p>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
<%
|
||||
if (typeof(person.website) !== 'undefined') {
|
||||
%>
|
||||
<a href="<%= person.website %>"><i class="fa-solid fa-globe"></i> Website</a>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
<%
|
||||
if (typeof(person.email) !== 'undefined') {
|
||||
%>
|
||||
<a href="mailto:<%= person.email %>"><i class="fa-solid fa-envelope"></i> Email</a>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
<%
|
||||
if (typeof(person.phone) !== 'undefined') {
|
||||
%>
|
||||
<a href="tel:<%= person.phone %>"><i class="fa-solid fa-phone"></i> Call</a>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<%
|
||||
}
|
||||
);
|
||||
%>
|
||||
</ul>
|
||||
|
|
@ -1,118 +0,0 @@
|
|||
%#
|
||||
principles.ejs
|
||||
This template should be included within a main base layout.
|
||||
It requires FontAwesome Pro to be loaded in the main <head>.
|
||||
%>
|
||||
|
||||
<header class="hero-section">
|
||||
<div class="hero-content">
|
||||
<h1 class="fade-in">Built on Principle: Our Technology & Values</h1>
|
||||
<p class="fade-in" style="animation-delay: 0.2s;">
|
||||
At Bridgeman Accessible, our commitment to digital inclusion runs deeper than the products you see. For years, we have been meticulously building a digital foundation based on a simple, powerful idea: the best way to serve our community is to build with principle, integrity, and unparalleled expertise.
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="page-section experts-section fade-in-section">
|
||||
<div class="section-container">
|
||||
<div class="experts-grid">
|
||||
<div class="experts-text">
|
||||
<h2>Designed by Experts, For Everyone</h2>
|
||||
<p>
|
||||
Our work is a direct reflection of who we are. We are proud that our entire technology team is composed of people with disabilities.
|
||||
This is not a footnote; it is our <strong>greatest strategic advantage</strong>.
|
||||
</p>
|
||||
<p>
|
||||
Our lived experiences give us an intuitive and profound understanding of accessibility that cannot be learned from a manual.
|
||||
We build with an unwavering commitment to quality and real-world usability because we are the community we serve.
|
||||
The result is a platform that is not just compliant, but <strong>authentically and fundamentally accessible</strong> in its very DNA.
|
||||
</p>
|
||||
</div>
|
||||
<div class="experts-image-container"></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="page-section key-section fade-in-section">
|
||||
<div class="section-container">
|
||||
<div class="section-header">
|
||||
<h2>A Single, Secure Digital Key</h2>
|
||||
<p>We believe your digital experience should be seamless and secure. That’s why we’ve invested heavily in creating a unified account platform that serves as your single key to our entire digital world.</p>
|
||||
</div>
|
||||
<div class="key-grid">
|
||||
<div class="key-item">
|
||||
<i class="fa-sharp fa-solid fa-key-skeleton fa-3x"></i>
|
||||
<h3>Simplicity & Convenience</h3>
|
||||
<p>With one secure login, you can access every tool and service we offer. No more juggling multiple passwords or accounts.</p>
|
||||
</div>
|
||||
<div class="key-item">
|
||||
<i class="fa-sharp fa-solid fa-shield-halved fa-3x"></i>
|
||||
<h3>Uncompromising Security</h3>
|
||||
<p>Your trust is our priority. We use the latest industry-standard security protocols to protect your information and ensure your data is safe.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="page-section sovereignty-section fade-in-section">
|
||||
<div class="section-container">
|
||||
<div class="section-header">
|
||||
<h2>A Foundation of Digital Sovereignty</h2>
|
||||
<p>We consciously choose a different path from big tech. To guarantee the highest level of security and privacy, we own and operate our own core infrastructure right here in Canada, on our own hardware.</p>
|
||||
</div>
|
||||
<div class="sovereignty-grid">
|
||||
<div class="sovereignty-image-container"></div>
|
||||
<div class="sovereignty-text">
|
||||
<ul>
|
||||
<li>
|
||||
<i class="fa-sharp fa-solid fa-server"></i>
|
||||
<div>
|
||||
<h4>You Control Your Data</h4>
|
||||
<p>By self-hosting, we offer our clients true data sovereignty. Your data stays here, under the protection of Canadian privacy laws.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa-sharp fa-solid fa-lock-keyhole"></i>
|
||||
<div>
|
||||
<h4>Enhanced Security</h4>
|
||||
<p>We have complete control over our technology stack, reducing external dependencies and strengthening our security posture.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa-sharp fa-solid fa-hand-holding-heart"></i>
|
||||
<div>
|
||||
<h4>Value-Driven Choices</h4>
|
||||
<p>This approach reflects our commitment to our community and country over pure profit, ensuring our technology aligns with our values.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="page-section result-section fade-in-section">
|
||||
<div class="section-container">
|
||||
<div class="section-header">
|
||||
<h2>Excellence You Can Rely On</h2>
|
||||
<p>Our commitment to building on principle delivers tangible benefits for our clients and community.</p>
|
||||
</div>
|
||||
<ul class="result-list">
|
||||
<li>
|
||||
<i class="fa-sharp fa-solid fa-circle-check"></i>
|
||||
<span>Rock-Solid Reliability</span>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa-sharp fa-solid fa-circle-check"></i>
|
||||
<span>Agility and Innovation</span>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa-sharp fa-solid fa-circle-check"></i>
|
||||
<span>Authentic Partnership</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="cta-container">
|
||||
<a href="/contact" class="cta-button">Partner With Us</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -49,67 +49,55 @@
|
|||
</ul>
|
||||
</section>
|
||||
|
||||
<%# <section class="about-team"> %>
|
||||
<%# <h2>Our Team</h2> %>
|
||||
<%# <p>Our team is made up of experienced professionals who are passionate about digital accessibility. Here are a few of our key team members:</p> %>
|
||||
<%# <ul> %>
|
||||
<%# < %>
|
||||
<%# people.forEach( %>
|
||||
<%# (person) => { %>
|
||||
<%# > %>
|
||||
<%# <li> %>
|
||||
<%# <div class="side-by-side"> %>
|
||||
<%# <div class="side-by-side-item" style="padding: 1rem"> %>
|
||||
<%# < %>
|
||||
<%# if (typeof(person.image) !== 'undefined') { %>
|
||||
<%# > %>
|
||||
<%# <img src="img/<= person.image >" alt="A photo of <= person.fname > <= person.lname >"> %>
|
||||
<%# < %>
|
||||
<%# } %>
|
||||
<%# else { %>
|
||||
<%# > %>
|
||||
<%# <i class="fa-solid fa-user fa-3x"></i> %>
|
||||
<%# < %>
|
||||
<%# } %>
|
||||
<%# > %>
|
||||
<%# </div> %>
|
||||
<%# <div class="side-by-side-item"> %>
|
||||
<%# <h3><= person.fname > <= person.lname ></h3> %>
|
||||
<%# <p><= person.position ></p> %>
|
||||
<%# < %>
|
||||
<%# if (typeof(person.bio) !== 'undefined') { %>
|
||||
<%# > %>
|
||||
<%# <p><= person.bio ></p> %>
|
||||
<%# < %>
|
||||
<%# } %>
|
||||
<%# > %>
|
||||
<%# < %>
|
||||
<%# if (typeof(person.website) !== 'undefined') { %>
|
||||
<%# > %>
|
||||
<%# <a href="<= person.website >"><i class="fa-solid fa-globe"></i> Website</a> %>
|
||||
<%# < %>
|
||||
<%# } %>
|
||||
<%# > %>
|
||||
<%# < %>
|
||||
<%# if (typeof(person.email) !== 'undefined') { %>
|
||||
<%# > %>
|
||||
<%# <a href="mailto:<= person.email >"><i class="fa-solid fa-envelope"></i> Email</a> %>
|
||||
<%# < %>
|
||||
<%# } %>
|
||||
<%# > %>
|
||||
<%# < %>
|
||||
<%# if (typeof(person.phone) !== 'undefined') { %>
|
||||
<%# > %>
|
||||
<%# <a href="tel:<= person.phone >"><i class="fa-solid fa-phone"></i> Call</a> %>
|
||||
<%# < %>
|
||||
<%# } %>
|
||||
<%# > %>
|
||||
<%# </div> %>
|
||||
<%# </div> %>
|
||||
<%# </li> %>
|
||||
<%# < %>
|
||||
<%# } %>
|
||||
<%# ); %>
|
||||
<%# > %>
|
||||
<%# </ul> %>
|
||||
<%# </section> %>
|
||||
<section class="about-team">
|
||||
<h2>Our Team</h2>
|
||||
<p>Our team is made up of experienced professionals who are passionate about digital accessibility. Here are a few of our key team members:</p>
|
||||
<ul>
|
||||
<%
|
||||
people.forEach(
|
||||
(person) => {
|
||||
%>
|
||||
<li>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item" style="padding: 1rem">
|
||||
<%
|
||||
if (typeof(person.image) !== 'undefined') {
|
||||
%>
|
||||
<img src="img/<%= person.image %>" alt="A photo of <%= person.fname %> <%= person.lname %>">
|
||||
<%
|
||||
}
|
||||
%>
|
||||
</div>
|
||||
<div class="side-by-side-item">
|
||||
<h3><%= person.fname %> <%= person.lname %></h3>
|
||||
<p><%= person.position %></p>
|
||||
<%
|
||||
if (typeof(person.bio) !== 'undefined') {
|
||||
%>
|
||||
<p><%= person.bio %></p>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
<%
|
||||
if (typeof(person.website) !== 'undefined') {
|
||||
%>
|
||||
<a href="<%= person.website %>"><i class="fa-solid fa-globe"></i> Website</a>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
<%
|
||||
if (typeof(person.email) !== 'undefined') {
|
||||
%>
|
||||
<a href="mailto:<%= person.email %>"><i class="fa-solid fa-envelope"></i> Contact</a>
|
||||
<%
|
||||
}
|
||||
%>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<%
|
||||
}
|
||||
);
|
||||
%>
|
||||
</ul>
|
||||
</section>
|
||||
|
|
@ -2,14 +2,14 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="description" content="<% if(typeof description !== 'undefined') { %><%= description %><% } else { %>Bridgeman Accessible Website<% } %>">
|
||||
<meta name="keywords" content="<% if(typeof keywords !== 'undefined') { %><%= keywords %><% } else { %>digital accessibility, accessible events, accessible websites, accessible documents, Bridgeman Accessible<% } %>">
|
||||
<meta name="description" content="Bridgeman Accessible Website">
|
||||
<meta name="keywords" content="digital accessibility, accessible events, accessible websites, accessible documents, Bridgeman Accessible">
|
||||
<meta name="author" content="Bridgeman Accessible">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title><%= title %> - Bridgeman Accessible</title>
|
||||
<link rel="stylesheet" type="text/css" href="/css/style.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/nav.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/accessibility.css">
|
||||
<link rel="stylesheet" type="text/css" href="css/style.css">
|
||||
<link rel="stylesheet" type="text/css" href="css/nav.css">
|
||||
<link rel="stylesheet" type="text/css" href="css/accessibility.css">
|
||||
<% if (typeof extraStyles !== 'undefined') { %>
|
||||
<% if (Array.isArray(extraStyles)) { %>
|
||||
<% for (let style of extraStyles) { %>
|
||||
|
|
|
|||
|
|
@ -1,70 +0,0 @@
|
|||
<section class="contact-hero">
|
||||
<div class="contact-hero-content">
|
||||
<h1>Connect with Bridgeman Accessible</h1>
|
||||
<p>We're here to help you build a more inclusive digital world. Reach out with any questions, feedback, or to discuss your accessibility needs.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="contact-details-section">
|
||||
<div class="contact-details-container">
|
||||
<div class="contact-info-block">
|
||||
<h2>Get In Touch</h2>
|
||||
<p class="contact-item">
|
||||
<a href="mailto:info@bridgemanaccessible.com" class="icon-link">
|
||||
<span class="icon" aria-hidden="true">✉</span> info@bridgemanaccessible.com
|
||||
</a>
|
||||
</p>
|
||||
<p class="contact-item">
|
||||
<a href="tel:+14314781655" class="icon-link">
|
||||
<span class="icon" aria-hidden="true">☎</span> 431-478-1655
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="newsletter-block">
|
||||
<h2>Stay Updated</h2>
|
||||
<p>Subscribe to our newsletter for the latest insights, tips, and news on digital accessibility.</p>
|
||||
<form action="/subscribe" method="POST" class="newsletter-form">
|
||||
<div class="form-group">
|
||||
<label for="newsletter-email">Email Address <span class="required">(required)</span></label>
|
||||
<input type="email" id="newsletter-email" name="email" required autocomplete="email" aria-required="true">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="newsletter-fname">First Name (optional)</label>
|
||||
<input type="text" id="newsletter-fname" name="firstName" autocomplete="given-name">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="newsletter-lname">Last Name (optional)</label>
|
||||
<input type="text" id="newsletter-lname" name="lastName" autocomplete="family-name">
|
||||
</div>
|
||||
<button type="submit" class="button primary-button">Subscribe</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="feedback-section">
|
||||
<div class="feedback-container">
|
||||
<h2>Send Us Your Feedback</h2>
|
||||
<p>Your thoughts help us improve. Please share any suggestions, report an issue, or just tell us what you think.</p>
|
||||
<form action="/submit-feedback" method="POST" class="feedback-form">
|
||||
<div class="form-group">
|
||||
<label for="feedback-name">Your Name (optional)</label>
|
||||
<input type="text" id="feedback-name" name="name" autocomplete="name">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="feedback-email">Your Email (optional)</label>
|
||||
<input type="email" id="feedback-email" name="email" autocomplete="email">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="feedback-subject">Subject</label>
|
||||
<input type="text" id="feedback-subject" name="subject" required aria-required="true">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="feedback-message">Your Message <span class="required">(required)</span></label>
|
||||
<textarea id="feedback-message" name="message" rows="7" required aria-required="true"></textarea>
|
||||
</div>
|
||||
<button type="submit" class="button secondary-button">Submit Feedback</button>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -1 +0,0 @@
|
|||
<h1>Education and Training</h1>
|
||||
|
|
@ -20,34 +20,11 @@
|
|||
<% } else { %>
|
||||
<li><a href="products" class="nav-link"><i class="fas fa-laptop-binary"></i> Products</a></li>
|
||||
<% } %>
|
||||
<% if (title === 'Search Terms') { %>
|
||||
<li><a href="seo" class="nav-link active"><i class="fas fa-search"></i> Search Terms</a></li>
|
||||
<% } else { %>
|
||||
<li><a href="seo" class="nav-link"><i class="fas fa-search"></i> Search Terms</a></li>
|
||||
<% } %>
|
||||
<li class="dropdown">
|
||||
<% if (title === 'About') { %>
|
||||
<a href="about" class="nav-link active"><i class="fas fa-info-circle"></i> About Us</a>
|
||||
<li><a href="about" class="nav-link active"><i class="fas fa-info-circle"></i > About Us</a></li>
|
||||
<% } else { %>
|
||||
<a href="about" class="nav-link"><i class="fas fa-info-circle"></i> About Us</a>
|
||||
<% } %>
|
||||
<%# <ul class="dropdown-menu"> %>
|
||||
<%# < if (title === 'Our Team') { > %>
|
||||
<%# <li><a href="about/our-team" class="dropdown-link active">Our Team</a></li> %>
|
||||
<%# < } else { > %>
|
||||
<%# <li><a href="about/our-team" class="dropdown-link">Our Team</a></li> %>
|
||||
<%# < } > %>
|
||||
<%# < if (title === 'Principals') { > %>
|
||||
<%# <li><a href="about/principals" class="dropdown-link active">Our Principals</a></li> %>
|
||||
<%# < } else { > %>
|
||||
<%# <li><a href="about/principals" class="dropdown-link">Our Principals</a></li> %>
|
||||
<%# < } > %>
|
||||
<%# </ul> %>
|
||||
</li>
|
||||
<% if (title === 'Contact') { %>
|
||||
<li><a href="contact" class="nav-link active"><i class="fas fa-address-book"></i> Contact Us</a></li>
|
||||
<% } else { %>
|
||||
<li><a href="contact" class="nav-link"><i class="fas fa-address-book"></i> Contact Us</a></li>
|
||||
<li><a href="about" class="nav-link"><i class="fas fa-info-circle"></i> About Us</a></li>
|
||||
<% } %>
|
||||
<li><a href="mailto:info@bridgemanaccessible.ca" class="nav-link"><i class="fas fa-envelope"></i> Contact Us</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
49
src/pages/new-design-2.ejs
Normal file
49
src/pages/new-design-2.ejs
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Thermometer Layout</title>
|
||||
<link rel="stylesheet" href="/css/new-design-2.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="page-container">
|
||||
<main class="content-area">
|
||||
<section class="card-section" aria-describedby="thermometer-indicator-section1">
|
||||
<h2 class="card-header">Section Title 1</h2>
|
||||
<div class="card-content">
|
||||
<p>This is the content for the first section. It can contain multiple paragraphs and other elements.</p>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<button class="read-more">Read More</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card-section" aria-describedby="thermometer-indicator-section2">
|
||||
<h2 class="card-header">Another Section</h2>
|
||||
<div class="card-content">
|
||||
<p>More interesting content for the second section goes here.</p>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<button class="read-more">Learn More</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
<aside class="thermometer-area" aria-label="Amount of managed by us spectrum">
|
||||
<div class="thermometer-graphic-container">
|
||||
<div class="thermometer-graphic" role="img" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="thermometer-bulb"></div>
|
||||
</div>
|
||||
<div class="thermometer-label">Amount of managed by us</div>
|
||||
</div>
|
||||
<div id="thermometer-indicator-section1" class="visually-hidden">Section 1 is located at approximately 30% in the managed amount spectrum.</div>
|
||||
<div id="thermometer-indicator-section2" class="visually-hidden">Section 2 is located at approximately 60% in the managed amount spectrum.</div>
|
||||
</aside>
|
||||
<div class="triangle-connector-container">
|
||||
<div class="triangle-connector top"></div>
|
||||
<div class="triangle-connector bottom"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
146
src/pages/new-design-3.ejs
Normal file
146
src/pages/new-design-3.ejs
Normal file
|
|
@ -0,0 +1,146 @@
|
|||
<!-- <!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Thermometer Layout</title>
|
||||
<link rel="stylesheet" href="/css/new-design-3.css">
|
||||
</head>
|
||||
<body> -->
|
||||
<div class="page-container">
|
||||
<div class="content-area">
|
||||
<section class="card-section top" aria-describedby="thermometer-indicator-section1">
|
||||
<div class="card-header">
|
||||
<h2>Self-Serve Tools (Products)</h2>
|
||||
<small>Price: Varies</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We provide a variety of self-serve tools that can be used to help make technology (or people's use of technology) more accessible.
|
||||
These tools are designed to be user-friendly and can be used by individuals or organizations without the need for specialized training or expertise.
|
||||
</p>
|
||||
<ul>
|
||||
<li>Accessibility Events Platform (AEP)</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="/products">Go to Products page</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card-section middle" aria-describedby="thermometer-indicator-section2">
|
||||
<div class="card-header">
|
||||
<h2>Event, Media, Documents and Website Support</h2>
|
||||
<small>Price: $125/hour (subject to change)</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We provide technical support for situations where there are disability/accessibility specific requirements or concerns.
|
||||
</p>
|
||||
<h3>Event Support</h3>
|
||||
<p>
|
||||
We specialize in helping facilitate any technical needs for accessibility features such as CART & captions, ASL/LSQ, and more.
|
||||
Our services are available for both online and hybrid events, and may be available for in-person events on a case by case basis.
|
||||
Noting, our office is located in Winnipeg, Manitoba, Canada and we are not able to travel outside of the city for in-person events at this time.
|
||||
</p>
|
||||
<!-- <p>
|
||||
More specifically, we often provide the following services (though may be open to others upon request):
|
||||
</p>
|
||||
<ul>
|
||||
<li>Event planning and coordination as it relates to needed technology and features (including researching and reporting on needed equipment, licenses or other resources or requirements)</li>
|
||||
<li>Event setup and troubleshooting</li>
|
||||
<li>Event moderation and technical problem troubleshooting</li>
|
||||
<li>Event recording and editing</li>
|
||||
</ul> -->
|
||||
<h3>Media Accessibility</h3>
|
||||
<p>We can help clients to remediate (make accessible) any media that they have created or are using.</p>
|
||||
<h3>Document Accessibility</h3>
|
||||
<p>We can help clients to remediate (make accessible) any documents that they have created or are using.</p>
|
||||
<p>
|
||||
Our past work has focused on PDFs, Word documents, PowerPoints and Excel spreadsheets.
|
||||
We are open to working with other document types as well, but with other formats we may not be able to provide the same level of support.
|
||||
</p>
|
||||
<h3>Website Advising/Testing</h3>
|
||||
<p>
|
||||
We do offer some limited website testing and advising services (that don't include development).
|
||||
Though this is somewhat limited (at least as A La Carte) compared to our many, many competitors in this area.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="#">Read More</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card-section middle" aria-describedby="thermometer-indicator-section3">
|
||||
<div class="card-header">
|
||||
<h2>Consulting and Co-Development</h2>
|
||||
<small>Price: $80/consultant or developer/hour (subject to change)</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We work very closely with or alongside developers to make software and hardware accessible.
|
||||
Our team has extensive experience in not only accessibility (which many of our compeitors do as well) but in software development and engineering as well.
|
||||
Which means we provide you the uniquely specific experience and guidance that goes so much deeper than "you should do X because of Y which makes it more accessible" but the
|
||||
"your app is doing X which isn't accessible because of Y but if you look at line N in file M of your code you can do Z to fix it".
|
||||
</p>
|
||||
<p>
|
||||
This comes with the caveat that we are often more interested in the how than the what.
|
||||
Which means our clients are expected to have a good idea of what they want to build and what solutions may or may not work for them.
|
||||
We can help with this to an extent but we are not a design or content creation agency and we do not provide design or content development services.
|
||||
We have often had partners like disability specific organizations that can help with accessible design and content creation and we are happy to connect you and work with them as appropriate.
|
||||
</p>
|
||||
<p>
|
||||
In specific cases where the product or service will provide a meaningful and significant contribution to advancing the accessibility of technology we also offer co-development not only on accessibility but on the product or service in general.
|
||||
When applicable, we don't just bring accessibility into the development but also development expertise in areas such as infrastructure, security, testing and more.
|
||||
</p>
|
||||
<ul>
|
||||
<li>Accessibility issue root cause analysis (and solution suggestion)</li>
|
||||
<li>Technial design as it relates to accessibility integration or subsystems</li>
|
||||
<li>Assistive technology or accessibility tool integration (ex. accessibility testing in CI pipelines suggestion and setup)</li>
|
||||
<li>Training and education (on developer tools, coding languages, APIs or other technical topics around accessibility)</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="mailto:info@bridgemanaccessible.ca">Contact Us</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card-section bottom" aria-describedby="thermometer-indicator-section4">
|
||||
<div class="card-header">
|
||||
<h2>Disability Organization Technical Support</h2>
|
||||
<small>Price: $45/contractor/hour - minimum 10 hours (subject to change)</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We provide IT support to disability-specific organizations or organiztions that work significanlty with people living with disabilities and help them become more digitally literate and efficient.
|
||||
Our team has experience working with a variety of organizations and can provide customized solutions to meet their unique needs.
|
||||
</p>
|
||||
<ul>
|
||||
<li>IT support and troubleshooting</li>
|
||||
<li>Training and education on technology use</li>
|
||||
<li>Assistive technology support</li>
|
||||
<li>Database management</li>
|
||||
<li>Website design and development</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="mailto:info@bridgemanaccessible.ca">Contact Us</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
<aside class="thermometer-area" aria-label="Amount of managed by us spectrum">
|
||||
<div class="thermometer-graphic-container">
|
||||
<div class="thermometer-graphic" role="img" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="thermometer-bulb"></div>
|
||||
</div>
|
||||
<div class="thermometer-label">Amount we're involved / managed by us</div>
|
||||
</div>
|
||||
<div id="thermometer-indicator-section1" class="visually-hidden">Located near the top at approximately the 25% in the managed amount spectrum.</div>
|
||||
<div id="thermometer-indicator-section2" class="visually-hidden">Located about half way down at approximately 50% in the managed amount spectrum.</div>
|
||||
<div id="thermometer-indicator-section3" class="visually-hidden">Located about three-quarters of the way down at approximately 75% in the managed amount spectrum.</div>
|
||||
<div id="thermometer-indicator-section4" class="visually-hidden">Located near the bottom at approximately 100% in the managed amount spectrum.</div>
|
||||
</aside>
|
||||
</div>
|
||||
<!-- </body>
|
||||
</html> -->
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
<h1>Accessible Resources Winnipeg</h1>
|
||||
<p>
|
||||
At Bridgeman Accessible, we understand that people living with disabilities face unique challenges.
|
||||
And one of our fundamental goals is to help create and support a more inclusive digital experience for everyone.
|
||||
</p>
|
||||
<p>
|
||||
To that extent, we are based in Winnipeg and are, to the extent possible, willing and open to working with mostly businesses (but some individuals in very specific circumstances) to create and maintain their digital accessibility.
|
||||
Including helping them find relevant accessibility related resources that exist in the community.
|
||||
</p>
|
||||
<p>
|
||||
As examples, we can help with:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Finding and recommending local resources for accommodation services (ex. sign language interpretation, CART/captioning, etc...)</li>
|
||||
<li>Connecting with organizations that provide assistive technology</li>
|
||||
<li>Identifying community groups focused on disability advocacy</li>
|
||||
</ul>
|
||||
<p>
|
||||
Our team is dedicated to fostering an inclusive environment where all individuals can thrive.
|
||||
If you or someone you know is looking for resources please don't hesitate to <a href="/contact">reach out</a>.
|
||||
</p>
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
<h1>Disabled Accommodations Winnipeg</h1>
|
||||
<p>
|
||||
At Bridgeman Accessible, we understand that people living with disabilities face unique challenges.
|
||||
And one of our fundamental goals is to help create and support a more inclusive digital experience for everyone.
|
||||
</p>
|
||||
<p>
|
||||
To that extent, we are based in Winnipeg and are, to the extent possible, willing and open to working with businesses to create and maintain their digital accessibility.
|
||||
Including helping them put in place and be comfortable with digital accessibility accommodations.
|
||||
</p>
|
||||
<p>
|
||||
As examples, we can help with:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Conducting digital accessibility audits</li>
|
||||
<li>Providing training on digital accessibility best practices</li>
|
||||
<li>Assisting with the implementation of accessible design principles</li>
|
||||
<li>Offering ongoing support and consultation on digital accessibility matters</li>
|
||||
</ul>
|
||||
<p>
|
||||
Our team is dedicated to fostering an inclusive environment where all individuals can thrive.
|
||||
If you or someone you know requires assistance, please don't hesitate to <a href="/contact">reach out</a>.
|
||||
</p>
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
<h1>Search (SEO) Terms</h1>
|
||||
<p>
|
||||
We'll be completely honest in saying this and the other pages in this section exist purely to help us boost our Advertising (and particularly Google Ads) and Search Engine Optimization (SEO) rankings.
|
||||
</p>
|
||||
<p>Here are some of the key terms and phrases we use for advertising on search engines (keep in mind we limit our area based on financial constraints etc...):</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/seo/disabled-accommodations-winnipeg">Disabled Accommodations Winnipeg</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/seo/translator-services-winnipeg">Translator Services Winnipeg</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/seo/sign-language-translators-winnipeg">Sign Language Translators Winnipeg</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/seo/accessible-resources-winnipeg">Accessible Resources Winnipeg</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/seo/assistive-tech-winnipeg">Assistive Tech Winnipeg</a>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Additional relevant terms include:</p>
|
||||
<ul>
|
||||
<li>Digital Accessibility</li>
|
||||
<li>Web Accessibility</li>
|
||||
<li>Inclusive Design</li>
|
||||
<li>Accessibility Digital Standards</li>
|
||||
<li>WCAG Compliance</li>
|
||||
<li>Accessible Web Development</li>
|
||||
<li>Assistive Technology (sometimes abbreviated a11y)</li>
|
||||
<li>User Experience (UX)</li>
|
||||
<li>Digital Inclusion</li>
|
||||
<li>Accessibility Audits</li>
|
||||
</ul>
|
||||
<p>
|
||||
We think these terms can help us connect with individuals and organizations seeking to improve their digital accessibility practices.
|
||||
Which is what we're all about.
|
||||
</p>
|
||||
<p>
|
||||
If you have any questions or suggestions regarding these terms, please feel free to <a href="/contact">contact us</a>.
|
||||
</p>
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
<h2>Translator Services Winnipeg</h2>
|
||||
<p>
|
||||
Upfront, we <strong>DO NOT</strong> provide direct translation services of any kind.
|
||||
We do work with translators (specifically sign language translators of different kinds) throughout our work to ensure our content is accessible to all.
|
||||
And we endeavor to make these interactions as easy as possible using digital tools and resources.
|
||||
</p>
|
||||
<p>
|
||||
But, again, we <strong>DO NOT</strong> provide direct translation services of any kind.
|
||||
</p>
|
||||
<p>
|
||||
To be transparent, we go back-and-forth on whether this is something we should include as a search term.
|
||||
We do not want to mislead anyone into thinking we provide these services.
|
||||
But we also recognize that people may search for this more than "niche" things like "digital accessibility support" or similar.
|
||||
</p>
|
||||
<p>
|
||||
If you as a potential customer have any questions or an opinion on this search phrase please feel free to <a href="/contact">contact us</a> and let us know.
|
||||
</p>
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
<h2>Translator Services Winnipeg</h2>
|
||||
<p>
|
||||
Upfront, we <strong>DO NOT</strong> provide direct translation services of any kind.
|
||||
We do work with translators (specifically sign language translators of different kinds) throughout our work to ensure our content is accessible to all.
|
||||
And we endeavor to make these interactions as easy as possible using digital tools and resources.
|
||||
</p>
|
||||
<p>
|
||||
But, again, we <strong>DO NOT</strong> provide direct translation services of any kind.
|
||||
</p>
|
||||
<p>
|
||||
To be transparent, we go back-and-forth on whether this is something we should include as a search term.
|
||||
We do not want to mislead anyone into thinking we provide these services.
|
||||
But we also recognize that people may search for this more than "niche" things like "digital accessibility support" or similar.
|
||||
</p>
|
||||
<p>
|
||||
If you as a potential customer have any questions or an opinion on this search phrase please feel free to <a href="/contact">contact us</a> and let us know.
|
||||
</p>
|
||||
|
|
@ -1,146 +1,67 @@
|
|||
<!-- <!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Thermometer Layout</title>
|
||||
<link rel="stylesheet" href="/css/new-design-3.css">
|
||||
</head>
|
||||
<body> -->
|
||||
<div class="page-container">
|
||||
<div class="content-area">
|
||||
<section class="card-section top" aria-describedby="thermometer-indicator-section1">
|
||||
<div class="card-header">
|
||||
<h2>Self-Serve Tools (Products)</h2>
|
||||
<small>Price: Varies</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We provide a variety of self-serve tools that can be used to help make technology (or people's use of technology) more accessible.
|
||||
These tools are designed to be user-friendly and can be used by individuals or organizations without the need for specialized training or expertise.
|
||||
</p>
|
||||
<ul>
|
||||
<li>Accessibility Events Platform (AEP)</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="/products">Go to Products page</a>
|
||||
</div>
|
||||
</section>
|
||||
<h1>Our Services</h1>
|
||||
|
||||
<section class="card-section middle" aria-describedby="thermometer-indicator-section2">
|
||||
<div class="card-header">
|
||||
<h2>Event, Media, Documents and Website Support</h2>
|
||||
<small>Price: $125/hour (subject to change)</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We provide technical support for situations where there are disability/accessibility specific requirements or concerns.
|
||||
</p>
|
||||
<h3>Event Support</h3>
|
||||
<p>
|
||||
We specialize in helping facilitate any technical needs for accessibility features such as CART & captions, ASL/LSQ, and more.
|
||||
Our services are available for both online and hybrid events, and may be available for in-person events on a case by case basis.
|
||||
Noting, our office is located in Winnipeg, Manitoba, Canada and we are not able to travel outside of the city for in-person events at this time.
|
||||
</p>
|
||||
<!-- <p>
|
||||
More specifically, we often provide the following services (though may be open to others upon request):
|
||||
</p>
|
||||
<ul>
|
||||
<li>Event planning and coordination as it relates to needed technology and features (including researching and reporting on needed equipment, licenses or other resources or requirements)</li>
|
||||
<li>Event setup and troubleshooting</li>
|
||||
<li>Event moderation and technical problem troubleshooting</li>
|
||||
<li>Event recording and editing</li>
|
||||
</ul> -->
|
||||
<h3>Media Accessibility</h3>
|
||||
<p>We can help clients to remediate (make accessible) any media that they have created or are using.</p>
|
||||
<h3>Document Accessibility</h3>
|
||||
<p>We can help clients to remediate (make accessible) any documents that they have created or are using.</p>
|
||||
<p>
|
||||
Our past work has focused on PDFs, Word documents, PowerPoints and Excel spreadsheets.
|
||||
We are open to working with other document types as well, but with other formats we may not be able to provide the same level of support.
|
||||
</p>
|
||||
<h3>Website Advising/Testing</h3>
|
||||
<p>
|
||||
We do offer some limited website testing and advising services (that don't include development).
|
||||
Though this is somewhat limited (at least as A La Carte) compared to our many, many competitors in this area.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="#">Read More</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card-section middle" aria-describedby="thermometer-indicator-section3">
|
||||
<div class="card-header">
|
||||
<h2>Consulting and Co-Development</h2>
|
||||
<small>Price: $80/consultant or developer/hour (subject to change)</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We work very closely with or alongside developers to make software and hardware accessible.
|
||||
Our team has extensive experience in not only accessibility (which many of our compeitors do as well) but in software development and engineering as well.
|
||||
Which means we provide you the uniquely specific experience and guidance that goes so much deeper than "you should do X because of Y which makes it more accessible" but the
|
||||
"your app is doing X which isn't accessible because of Y but if you look at line N in file M of your code you can do Z to fix it".
|
||||
</p>
|
||||
<p>
|
||||
This comes with the caveat that we are often more interested in the how than the what.
|
||||
Which means our clients are expected to have a good idea of what they want to build and what solutions may or may not work for them.
|
||||
We can help with this to an extent but we are not a design or content creation agency and we do not provide design or content development services.
|
||||
We have often had partners like disability specific organizations that can help with accessible design and content creation and we are happy to connect you and work with them as appropriate.
|
||||
</p>
|
||||
<p>
|
||||
In specific cases where the product or service will provide a meaningful and significant contribution to advancing the accessibility of technology we also offer co-development not only on accessibility but on the product or service in general.
|
||||
When applicable, we don't just bring accessibility into the development but also development expertise in areas such as infrastructure, security, testing and more.
|
||||
</p>
|
||||
<ul>
|
||||
<li>Accessibility issue root cause analysis (and solution suggestion)</li>
|
||||
<li>Technial design as it relates to accessibility integration or subsystems</li>
|
||||
<li>Assistive technology or accessibility tool integration (ex. accessibility testing in CI pipelines suggestion and setup)</li>
|
||||
<li>Training and education (on developer tools, coding languages, APIs or other technical topics around accessibility)</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="mailto:info@bridgemanaccessible.ca">Contact Us</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card-section bottom" aria-describedby="thermometer-indicator-section4">
|
||||
<div class="card-header">
|
||||
<h2>Disability Organization Technical Support</h2>
|
||||
<small>Price: $45/contractor/hour - minimum 10 hours (subject to change)</small>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>
|
||||
We provide IT support to disability-specific organizations or organiztions that work significanlty with people living with disabilities and help them become more digitally literate and efficient.
|
||||
Our team has experience working with a variety of organizations and can provide customized solutions to meet their unique needs.
|
||||
</p>
|
||||
<ul>
|
||||
<li>IT support and troubleshooting</li>
|
||||
<li>Training and education on technology use</li>
|
||||
<li>Assistive technology support</li>
|
||||
<li>Database management</li>
|
||||
<li>Website design and development</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-bottom">
|
||||
<a class="read-more" href="mailto:info@bridgemanaccessible.ca">Contact Us</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
<aside class="thermometer-area" aria-label="Amount of managed by us spectrum">
|
||||
<div class="thermometer-graphic-container">
|
||||
<div class="thermometer-graphic" role="img" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="thermometer-bulb"></div>
|
||||
</div>
|
||||
<div class="thermometer-label">Amount we're involved / managed by us</div>
|
||||
</div>
|
||||
<div id="thermometer-indicator-section1" class="visually-hidden">Located near the top at approximately the 25% in the managed amount spectrum.</div>
|
||||
<div id="thermometer-indicator-section2" class="visually-hidden">Located about half way down at approximately 50% in the managed amount spectrum.</div>
|
||||
<div id="thermometer-indicator-section3" class="visually-hidden">Located about three-quarters of the way down at approximately 75% in the managed amount spectrum.</div>
|
||||
<div id="thermometer-indicator-section4" class="visually-hidden">Located near the bottom at approximately 100% in the managed amount spectrum.</div>
|
||||
</aside>
|
||||
</div>
|
||||
<!-- </body>
|
||||
</html> -->
|
||||
<section class="service">
|
||||
<h2>Event and Assistive Technology Support</h2>
|
||||
<small>Price: $125/hour (subject to change)</small>
|
||||
<p>
|
||||
We provide technical support for situations where there are disability/accessibility specific requirements or concerns.
|
||||
</p>
|
||||
<h3>Event Support</h3>
|
||||
<p>
|
||||
We specialize in features such as captions, ASL/LSQ, English/French interpretation, and more.
|
||||
Our services are available for both online and hybrid events, and may be available for in-person events on a case by case basis.
|
||||
</p>
|
||||
<p>
|
||||
More specifically, we often provide the following services (though may be open to others upon request):
|
||||
</p>
|
||||
<ul>
|
||||
<li>Event planning and coordination as it relates to needed technology and features (including researching and reporting on needed equipment, licenses or other resources or requirements)</li>
|
||||
<li>Event setup and troubleshooting</li>
|
||||
<li>Event moderation and technical problem troubleshooting</li>
|
||||
<li>Event recording and editing</li>
|
||||
</ul>
|
||||
<h3>Specialized Technology Support</h3>
|
||||
<p>
|
||||
We allow clients to feel confident that their employees of any abilities will be well supported when it comes to technology.
|
||||
</p>
|
||||
</section>
|
||||
<section class="service">
|
||||
<h2>Co-Development and Consulting</h2>
|
||||
<small>Price: $80/hour (subject to change)</small>
|
||||
<p>
|
||||
We work very closely with or alongside developers to make software and hardware accessible.
|
||||
Our team has extensive experience in not only accessibility (which many of our compeitors do as well) but in software development and engineering as well.
|
||||
Which means we provide you the uniquely specific experience and guidance that goes so much deeper than "you should do X because of Y which makes it more accessible" but the
|
||||
"your app is doing X which isn't accessible because of Y but if you look at line N in file M of your code you can do Z to fix it".
|
||||
</p>
|
||||
<p>
|
||||
This comes with the caveat that we are often more interested in the how than the what. Which means our clients are expected to have a good idea of what they want to build and
|
||||
what solutions may or may not work for them. We can help with this to an extent but we are not a design or content creation agency and we do not provide design or content development services.
|
||||
We have often had partners like disability specific organizations that can help with accessible design and content creation and we are happy to connect you and work with them as appropriate.
|
||||
</p>
|
||||
<p>
|
||||
In specific cases where the product or service will provide a meaningful and significant contribution to advancing the accessibility of technology we also offer co-development not only on accessibility but on the product or service in general.
|
||||
When applicable, we don't just bring accessibility into the development but also development expertise in areas such as infrastructure, security, testing and more.
|
||||
</p>
|
||||
<ul>
|
||||
<li>Accessibility issue root cause analysis (and solution suggestion)</li>
|
||||
<li>Technial design as it relates to accessibility integration or subsystems</li>
|
||||
<li>Assistive technology or accessibility tool integration (ex. accessibility testing in CI pipelines suggestion and setup)</li>
|
||||
<li>Training and education (on developer tools, coding languages, APIs or other technical topics around accessibility)</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="service">
|
||||
<h2>Disability Organization Technical Support</h2>
|
||||
<small>Price: $45/hour (subject to change)</small>
|
||||
<p>
|
||||
We provide IT support to disability-specific organizations and help them become more digitally literate and efficient.
|
||||
Our team has experience working with a variety of organizations and can provide customized solutions to meet their unique needs.
|
||||
</p>
|
||||
<ul>
|
||||
<li>IT support and troubleshooting</li>
|
||||
<li>Training and education</li>
|
||||
<li>Assistive technology support</li>
|
||||
<li>Database management</li>
|
||||
<li>Website design and development (limited)</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
|
@ -1,67 +0,0 @@
|
|||
<h1>Our Services</h1>
|
||||
|
||||
<section class="service">
|
||||
<h2>Event and Assistive Technology Support</h2>
|
||||
<small>Price: $125/hour (subject to change)</small>
|
||||
<p>
|
||||
We provide technical support for situations where there are disability/accessibility specific requirements or concerns.
|
||||
</p>
|
||||
<h3>Event Support</h3>
|
||||
<p>
|
||||
We specialize in features such as captions, ASL/LSQ, English/French interpretation, and more.
|
||||
Our services are available for both online and hybrid events, and may be available for in-person events on a case by case basis.
|
||||
</p>
|
||||
<p>
|
||||
More specifically, we often provide the following services (though may be open to others upon request):
|
||||
</p>
|
||||
<ul>
|
||||
<li>Event planning and coordination as it relates to needed technology and features (including researching and reporting on needed equipment, licenses or other resources or requirements)</li>
|
||||
<li>Event setup and troubleshooting</li>
|
||||
<li>Event moderation and technical problem troubleshooting</li>
|
||||
<li>Event recording and editing</li>
|
||||
</ul>
|
||||
<h3>Specialized Technology Support</h3>
|
||||
<p>
|
||||
We allow clients to feel confident that their employees of any abilities will be well supported when it comes to technology.
|
||||
</p>
|
||||
</section>
|
||||
<section class="service">
|
||||
<h2>Co-Development and Consulting</h2>
|
||||
<small>Price: $80/hour (subject to change)</small>
|
||||
<p>
|
||||
We work very closely with or alongside developers to make software and hardware accessible.
|
||||
Our team has extensive experience in not only accessibility (which many of our compeitors do as well) but in software development and engineering as well.
|
||||
Which means we provide you the uniquely specific experience and guidance that goes so much deeper than "you should do X because of Y which makes it more accessible" but the
|
||||
"your app is doing X which isn't accessible because of Y but if you look at line N in file M of your code you can do Z to fix it".
|
||||
</p>
|
||||
<p>
|
||||
This comes with the caveat that we are often more interested in the how than the what. Which means our clients are expected to have a good idea of what they want to build and
|
||||
what solutions may or may not work for them. We can help with this to an extent but we are not a design or content creation agency and we do not provide design or content development services.
|
||||
We have often had partners like disability specific organizations that can help with accessible design and content creation and we are happy to connect you and work with them as appropriate.
|
||||
</p>
|
||||
<p>
|
||||
In specific cases where the product or service will provide a meaningful and significant contribution to advancing the accessibility of technology we also offer co-development not only on accessibility but on the product or service in general.
|
||||
When applicable, we don't just bring accessibility into the development but also development expertise in areas such as infrastructure, security, testing and more.
|
||||
</p>
|
||||
<ul>
|
||||
<li>Accessibility issue root cause analysis (and solution suggestion)</li>
|
||||
<li>Technial design as it relates to accessibility integration or subsystems</li>
|
||||
<li>Assistive technology or accessibility tool integration (ex. accessibility testing in CI pipelines suggestion and setup)</li>
|
||||
<li>Training and education (on developer tools, coding languages, APIs or other technical topics around accessibility)</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="service">
|
||||
<h2>Disability Organization Technical Support</h2>
|
||||
<small>Price: $45/hour (subject to change)</small>
|
||||
<p>
|
||||
We provide IT support to disability-specific organizations and help them become more digitally literate and efficient.
|
||||
Our team has experience working with a variety of organizations and can provide customized solutions to meet their unique needs.
|
||||
</p>
|
||||
<ul>
|
||||
<li>IT support and troubleshooting</li>
|
||||
<li>Training and education</li>
|
||||
<li>Assistive technology support</li>
|
||||
<li>Database management</li>
|
||||
<li>Website design and development (limited)</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
|
@ -12,17 +12,9 @@ export class AboutController extends BaseController {
|
|||
* @param req The request object.
|
||||
* @param res The response object.
|
||||
*/
|
||||
@Page('About Us', 'about.ejs')
|
||||
@Page('About', 'about.ejs')
|
||||
@GET('/about')
|
||||
private aboutPage(req: Request, res: Response) {}
|
||||
|
||||
@Page('Our Principals', 'about/principals.ejs')
|
||||
@GET('/about/principals')
|
||||
private principalsPage(req: Request, res: Response) {}
|
||||
|
||||
@Page('Our Team', 'about/our-team.ejs')
|
||||
@GET('/about/our-team')
|
||||
private ourTeamPage(req: Request, res: Response) {
|
||||
private about(req: Request, res: Response) {
|
||||
return {
|
||||
people: [
|
||||
{
|
||||
|
|
@ -38,19 +30,9 @@ export class AboutController extends BaseController {
|
|||
'Alan started Bridgeman Accessible because he saw over and over again companies that were lead by non-disabled people and non-developers trying to solve digital accessibility problems. ' +
|
||||
'Moreover, they would only every consult or give advice but never build or innovate in ways that would help the community and the industry in a meaningful and impactful way.',
|
||||
image: 'alan.jpeg',
|
||||
//website: 'https://alanbridgeman.ca/',
|
||||
email: 'alan@bridgemanaccessible.com',
|
||||
phone: '+1 (431) 478-1655 Ext. 200'
|
||||
website: 'https://alanbridgeman.ca/',
|
||||
email: 'alan@alanbridgeman.ca'
|
||||
},
|
||||
{
|
||||
fname: 'Mohamed',
|
||||
lname: 'Behi',
|
||||
position: 'Education & Training Consultant',
|
||||
bio: '' +
|
||||
'Mohamed is a passionate advocate for disability rights and accessibility. He has been involved in the disability community for many years, working with various organizations to promote inclusion and accessibility. ',
|
||||
email: 'mohamed@bridgemanaccessible.com',
|
||||
phone: '+1 (431) 478-1655 Ext. 201'
|
||||
}
|
||||
//{
|
||||
// fname: 'John',
|
||||
// lname: 'Oberton',
|
||||
|
|
|
|||
|
|
@ -1,16 +0,0 @@
|
|||
import { Request, Response } from 'express';
|
||||
import { Controller, GET, Page, BaseController } from '@BridgemanAccessible/ba-web-framework';
|
||||
|
||||
/** The ContactController class is responsible for handling the contact page of the site. */
|
||||
@Controller()
|
||||
export class ContactController extends BaseController {
|
||||
/**
|
||||
* Route for rendering the contact page.
|
||||
*
|
||||
* @param req The request object.
|
||||
* @param res The response object.
|
||||
*/
|
||||
@Page('Contact', 'contact.ejs', [], ['contact'])
|
||||
@GET('/contact')
|
||||
private contact(req: Request, res: Response) {}
|
||||
}
|
||||
|
|
@ -22,7 +22,7 @@ export class HomeController extends BaseController {
|
|||
};
|
||||
}
|
||||
|
||||
//@Page('New Design', 'new-design-3.ejs', [], ['new-design-3'])
|
||||
//@GET('/new-design')
|
||||
//private newPage(req: Request, res: Response) {}
|
||||
@Page('New Design', 'new-design-3.ejs', [], ['new-design-3'])
|
||||
@GET('/new-design')
|
||||
private newPage(req: Request, res: Response) {}
|
||||
}
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
import { Request, Response } from 'express';
|
||||
|
||||
import { Controller, GET, Page, BaseController } from '@BridgemanAccessible/ba-web-framework';
|
||||
|
||||
@Controller()
|
||||
export class SEOController extends BaseController {
|
||||
@Page('Search Terms', 'seo-terms/index.ejs')
|
||||
@GET('/seo')
|
||||
private seoIndex(req: Request, res: Response) {
|
||||
return {
|
||||
keywords: ['Bridgeman Accessible', 'SEO', 'Winnipeg', 'disabled accommodations winnipeg', 'translator services winnipeg', 'sign language translators winnipeg', 'accessible resources winnipeg', 'assistive tech winnipeg'].join(', '),
|
||||
description: 'Bridgeman Accessible SEO terms and pages for better search engine visibility.'
|
||||
}
|
||||
}
|
||||
|
||||
@Page('Disabled Accommodations Winnipeg', 'seo-terms/disabled-accommodations-winnipeg.ejs')
|
||||
@GET('/seo/disabled-accommodations-winnipeg')
|
||||
private disabledAccommodationsWinnipegPage(req: Request, res: Response) {
|
||||
return {
|
||||
keywords: ['Bridgeman Accessible', 'SEO', 'Winnipeg', 'disabled accommodations winnipeg'].join(', '),
|
||||
description: 'Disabled accommodations in Winnipeg are essential for ensuring accessibility and inclusivity. Bridgeman Accessible provides insights and resources on this topic.'
|
||||
}
|
||||
}
|
||||
|
||||
@Page('Translator Services Winnipeg', 'seo-terms/translator-services-winnipeg.ejs')
|
||||
@GET('/seo/translator-services-winnipeg')
|
||||
private translatorServicesWinnipegPage(req: Request, res: Response) {
|
||||
return {
|
||||
keywords: ['Bridgeman Accessible', 'SEO', 'Winnipeg', 'translator services winnipeg'].join(', '),
|
||||
description: 'Translator services in Winnipeg are essential for bridging communication gaps. Bridgeman Accessible provides information on available translation services.'
|
||||
}
|
||||
}
|
||||
|
||||
@Page('Sign Language Translators Winnipeg', 'seo-terms/sign-language-translators-winnipeg.ejs')
|
||||
@GET('/seo/sign-language-translators-winnipeg')
|
||||
private signLanguageTranslatorsWinnipegPage(req: Request, res: Response) {
|
||||
return {
|
||||
keywords: ['Bridgeman Accessible', 'SEO', 'Winnipeg', 'sign language translators winnipeg'].join(', '),
|
||||
description: 'Sign language translators in Winnipeg play a vital role in communication accessibility. Bridgeman Accessible provides information on what sign language translation services it provides.'
|
||||
}
|
||||
}
|
||||
|
||||
@Page('Accessible Resources Winnipeg', 'seo-terms/accessible-resources-winnipeg.ejs')
|
||||
@GET('/seo/accessible-resources-winnipeg')
|
||||
private accessibleResourcesWinnipegPage(req: Request, res: Response) {
|
||||
return {
|
||||
keywords: ['Bridgeman Accessible', 'SEO', 'Winnipeg', 'accessible resources winnipeg'].join(', '),
|
||||
description: 'Accessible resources in Winnipeg are essential for promoting inclusivity. Bridgeman Accessible offers a range of resources to support accessibility initiatives.'
|
||||
}
|
||||
}
|
||||
|
||||
@Page('Assistive Tech Winnipeg', 'seo-terms/assistive-tech-winnipeg.ejs')
|
||||
@GET('/seo/assistive-tech-winnipeg')
|
||||
private assistiveTechWinnipegPage(req: Request, res: Response) {
|
||||
return {
|
||||
keywords: ['Bridgeman Accessible', 'SEO', 'Winnipeg', 'assistive tech winnipeg'].join(', '),
|
||||
description: 'Assistive technology in Winnipeg is crucial for enhancing accessibility. Bridgeman Accessible provides information and resources on assistive tech solutions.'
|
||||
}
|
||||
}
|
||||
|
||||
@GET('/site-map.xml')
|
||||
private siteMap(req: Request, res: Response) {
|
||||
res.type('xml');
|
||||
res.sendFile('static/xml/sitemap.xml', { root: __dirname + '/..' });
|
||||
}
|
||||
|
||||
@GET('/robots.txt')
|
||||
private robotsTxt(req: Request, res: Response) {
|
||||
res.type('text/plain');
|
||||
res.sendFile('static/robots.txt', { root: __dirname + '/..' });
|
||||
}
|
||||
}
|
||||
|
|
@ -12,7 +12,7 @@ export class ServicesController extends BaseController {
|
|||
* @param req The request object.
|
||||
* @param res The response object.
|
||||
*/
|
||||
@Page('Services', 'services.ejs', [], ['services'])
|
||||
@Page('Services', 'services.ejs')
|
||||
@GET('/services')
|
||||
private services(req: Request, res: Response) {}
|
||||
}
|
||||
|
|
@ -10,7 +10,7 @@ const domain = process.env.DOMAIN || 'localhost';
|
|||
*
|
||||
* @param app The Express app that gets created/started.
|
||||
*/
|
||||
function onStart(app: App) {
|
||||
function onStart(app: Application) {
|
||||
// Currently within the Server class implementation,
|
||||
// which is then implemented by the accounts dashboard,
|
||||
// only the RFC8414 path/callback is setup by default
|
||||
|
|
@ -18,8 +18,7 @@ function onStart(app: App) {
|
|||
// this should be easy enough to change but don't want to fiddle with it right now
|
||||
//const oidcLink = PointerServer.createOIDCLink('account.bridgemanaccessible.ca');
|
||||
const rfc8414Link = PointerServer.createRFC8414Link('account.bridgemanaccessible.ca');
|
||||
PointerServer.setup(app.getExpressApp(), { links: [/*oidcLink, */rfc8414Link] });
|
||||
app.getInitializer().getRouter().addOutsideFrameworkRoute('/.well-known/webfinger');
|
||||
PointerServer.setup(app, { links: [/*oidcLink, */rfc8414Link] });
|
||||
}
|
||||
|
||||
async function main() {
|
||||
|
|
|
|||
|
|
@ -1,273 +0,0 @@
|
|||
/* General Reset & Base Styles (Assume some global styles exist, but these are good additions) */
|
||||
:root {
|
||||
/* Define your brand colors */
|
||||
--primary-color: #0056b3; /* A deep blue for Bridgeman Accessible */
|
||||
--secondary-color: #28a745; /* A complementary green */
|
||||
--accent-color: #ffc107; /* A bright accent color */
|
||||
--text-color: light-dark(#333, #f8f9fa); /* Dark text for light mode, light text for dark mode */
|
||||
--light-text-color: #f8f9fa;
|
||||
--background-light: light-dark(#f4f7f6, #343a40); /* Light background for light mode, dark for dark mode */
|
||||
--background-dark: light-dark(#e9ecef, #212529); /* Dark background for dark mode */
|
||||
--border-color: light-dark(#ced4da, #495057); /* Light border for light mode, dark for dark mode */
|
||||
|
||||
/* Font sizes (adjust as needed) */
|
||||
--font-size-base: 1rem;
|
||||
--font-size-large: 1.25rem;
|
||||
--font-size-xl: 2rem;
|
||||
--font-size-xxl: 2.5rem;
|
||||
|
||||
/* Spacing */
|
||||
--spacing-xs: 0.5rem;
|
||||
--spacing-sm: 1rem;
|
||||
--spacing-md: 1.5rem;
|
||||
--spacing-lg: 2rem;
|
||||
--spacing-xl: 3rem;
|
||||
|
||||
/* Border Radius */
|
||||
--border-radius: 8px;
|
||||
|
||||
/* Shadow */
|
||||
--box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Arial', sans-serif; /* Or your preferred brand font */
|
||||
line-height: 1.6;
|
||||
color: var(--text-color);
|
||||
background-color: var(--background-light);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* --- Section Styling --- */
|
||||
.contact-hero {
|
||||
background: linear-gradient(to right, var(--primary-color), #003366); /* Darker blue blend */
|
||||
color: var(--light-text-color);
|
||||
padding: var(--spacing-xl) var(--spacing-sm);
|
||||
text-align: center;
|
||||
box-shadow: var(--box-shadow);
|
||||
margin-bottom: var(--spacing-lg);
|
||||
}
|
||||
|
||||
.contact-hero-content {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.contact-hero h1 {
|
||||
font-size: var(--font-size-xxl);
|
||||
margin-bottom: var(--spacing-sm);
|
||||
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.contact-hero p {
|
||||
font-size: var(--font-size-large);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.contact-details-section,
|
||||
.feedback-section {
|
||||
padding: var(--spacing-xl) var(--spacing-sm);
|
||||
background-color: var(--background-light);
|
||||
}
|
||||
|
||||
.contact-details-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap; /* Allows wrapping on smaller screens */
|
||||
gap: var(--spacing-xl); /* Space between blocks */
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
justify-content: center; /* Center blocks when they wrap */
|
||||
}
|
||||
|
||||
.contact-info-block,
|
||||
.newsletter-block {
|
||||
flex: 1; /* Allows blocks to grow and shrink */
|
||||
min-width: 300px; /* Minimum width before wrapping */
|
||||
background-color: light-dark(#fff, #343a40);
|
||||
padding: var(--spacing-lg);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: var(--box-shadow);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.feedback-container {
|
||||
max-width: 700px;
|
||||
margin: 0 auto;
|
||||
background-color: light-dark(#fff, #343a40);
|
||||
padding: var(--spacing-lg);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: var(--box-shadow);
|
||||
}
|
||||
|
||||
/* --- Headings --- */
|
||||
h2 {
|
||||
color: var(--primary-color);
|
||||
font-size: var(--font-size-xl);
|
||||
margin-bottom: var(--spacing-md);
|
||||
border-bottom: 2px solid var(--accent-color); /* Underline effect */
|
||||
padding-bottom: var(--spacing-xs);
|
||||
}
|
||||
|
||||
/* --- Contact Information Styles --- */
|
||||
.contact-info-block .contact-item {
|
||||
font-size: var(--font-size-large);
|
||||
margin-bottom: var(--spacing-md);
|
||||
display: flex; /* For icon alignment */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.contact-info-block .icon-link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.contact-info-block .icon-link:hover,
|
||||
.contact-info-block .icon-link:focus {
|
||||
color: var(--secondary-color);
|
||||
outline: 2px solid var(--secondary-color); /* Accessibility focus */
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.contact-info-block .icon {
|
||||
margin-right: var(--spacing-sm);
|
||||
font-size: var(--font-size-large);
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
|
||||
/* --- Form Styles --- */
|
||||
.form-group {
|
||||
margin-bottom: var(--spacing-md);
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: var(--spacing-xs);
|
||||
font-weight: bold;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.form-group input[type="text"],
|
||||
.form-group input[type="email"],
|
||||
.form-group textarea {
|
||||
width: 100%;
|
||||
padding: var(--spacing-xs) var(--spacing-sm);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--border-radius);
|
||||
font-size: var(--font-size-base);
|
||||
color: var(--text-color);
|
||||
box-sizing: border-box; /* Include padding in width */
|
||||
transition: border-color 0.3s ease, box-shadow 0.3s ease;
|
||||
}
|
||||
|
||||
.form-group input[type="text"]:focus,
|
||||
.form-group input[type="email"]:focus,
|
||||
.form-group textarea:focus {
|
||||
border-color: var(--primary-color);
|
||||
box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.2); /* Focus ring */
|
||||
outline: none; /* Remove default outline */
|
||||
}
|
||||
|
||||
.form-group textarea {
|
||||
resize: vertical; /* Allow vertical resizing */
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.required {
|
||||
color: #dc3545; /* Red for required indicator */
|
||||
font-weight: normal;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
/* --- Button Styles --- */
|
||||
.button {
|
||||
display: inline-block;
|
||||
padding: var(--spacing-sm) var(--spacing-md);
|
||||
border: none;
|
||||
border-radius: var(--border-radius);
|
||||
font-size: var(--font-size-large);
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
|
||||
}
|
||||
|
||||
.primary-button {
|
||||
background-color: var(--primary-color);
|
||||
color: var(--light-text-color);
|
||||
}
|
||||
|
||||
.primary-button:hover,
|
||||
.primary-button:focus {
|
||||
background-color: #004494; /* Darker primary */
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
|
||||
outline: 2px solid var(--accent-color); /* Accessible focus */
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.secondary-button {
|
||||
background-color: var(--secondary-color);
|
||||
color: var(--light-text-color);
|
||||
margin-top: var(--spacing-md); /* Space below forms */
|
||||
}
|
||||
|
||||
.secondary-button:hover,
|
||||
.secondary-button:focus {
|
||||
background-color: #218838; /* Darker secondary */
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
|
||||
outline: 2px solid var(--accent-color); /* Accessible focus */
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
|
||||
/* --- Responsive Adjustments --- */
|
||||
@media (max-width: 768px) {
|
||||
.contact-details-container {
|
||||
flex-direction: column; /* Stack blocks vertically on smaller screens */
|
||||
gap: var(--spacing-lg);
|
||||
}
|
||||
|
||||
.contact-info-block,
|
||||
.newsletter-block {
|
||||
min-width: unset; /* Remove min-width to allow full width */
|
||||
width: 100%; /* Take full width */
|
||||
}
|
||||
|
||||
.contact-hero h1 {
|
||||
font-size: var(--font-size-xl);
|
||||
}
|
||||
|
||||
.contact-hero p {
|
||||
font-size: var(--font-size-base);
|
||||
}
|
||||
|
||||
.contact-details-section,
|
||||
.feedback-section {
|
||||
padding: var(--spacing-lg) var(--spacing-sm);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.contact-hero {
|
||||
padding: var(--spacing-lg) var(--spacing-xs);
|
||||
}
|
||||
.contact-hero h1 {
|
||||
font-size: var(--font-size-large);
|
||||
}
|
||||
.contact-hero p {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
h2 {
|
||||
font-size: var(--font-size-large);
|
||||
}
|
||||
.button {
|
||||
width: 100%; /* Full width buttons on very small screens */
|
||||
padding: var(--spacing-sm) var(--spacing-xs);
|
||||
}
|
||||
}
|
||||
|
|
@ -82,11 +82,6 @@ nav {
|
|||
color: light-dark(#333, #DDD);
|
||||
}
|
||||
|
||||
.nav-links.active li:last-child a {
|
||||
background-color: light-dark(#0077c2, #005f99);
|
||||
color: light-dark(#fff, #000);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
nav {
|
||||
align-items: center;
|
||||
|
|
|
|||
196
src/static/css/new-design-2.css
Normal file
196
src/static/css/new-design-2.css
Normal file
|
|
@ -0,0 +1,196 @@
|
|||
body {
|
||||
font-family: sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #f4f4f4;
|
||||
display: flex; /* Enable flexbox for overall layout */
|
||||
}
|
||||
|
||||
.page-container {
|
||||
display: flex; /* Enable flexbox for main content and thermometer areas */
|
||||
width: 100%;
|
||||
max-width: 1200px; /* Optional: Limit page width */
|
||||
margin: 20px auto; /* Center the container */
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
position: relative; /* For positioning the triangle connectors */
|
||||
}
|
||||
|
||||
.content-area {
|
||||
width: 85%;
|
||||
padding-right: 5%; /* Spacing for the triangle */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.card-section {
|
||||
background-color: white;
|
||||
border: 1px solid #ddd;
|
||||
box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 20px;
|
||||
padding: 20px;
|
||||
position: relative; /* To potentially position elements within the card */
|
||||
}
|
||||
|
||||
.card-header h2 {
|
||||
margin-top: 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
color: #555;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.card-bottom .read-more {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 15px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.card-bottom .read-more:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
|
||||
.thermometer-area {
|
||||
width: 10%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start; /* Align items to the top */
|
||||
padding-left: 5px; /* Spacing from the content area */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.thermometer-graphic-container {
|
||||
display: flex;
|
||||
flex-direction: row; /* Label to the right of the graphic */
|
||||
align-items: center; /* Vertically align label and graphic */
|
||||
margin-top: 20px; /* Adjust top margin as needed */
|
||||
}
|
||||
|
||||
.thermometer-graphic {
|
||||
background: linear-gradient(to bottom, #fdd835, #e1f5fe); /* Two-color fade/gradient */
|
||||
width: 30px; /* Adjust thickness as needed */
|
||||
height: 200px; /* Adjust height as needed */
|
||||
border-radius: 15px;
|
||||
border: 1px solid #ccc;
|
||||
position: relative; /* For positioning the bulb */
|
||||
}
|
||||
|
||||
.thermometer-bulb {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 40px; /* Adjust bulb width */
|
||||
height: 40px; /* Adjust bulb height */
|
||||
background-color: #f44336; /* Thermometer bulb color */
|
||||
border-radius: 50%;
|
||||
border: 1px solid #ccc;
|
||||
margin-bottom: -10px; /* Overlap with the main graphic */
|
||||
}
|
||||
|
||||
.thermometer-label {
|
||||
font-size: 0.8em;
|
||||
color: #777;
|
||||
margin-left: 10px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.triangle-connector-container {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 85%; /* Align with the right edge of the content area */
|
||||
width: 5%; /* The gap between content and thermometer */
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around; /* Distribute triangles vertically */
|
||||
align-items: flex-end; /* Align triangles to the right */
|
||||
padding: 20px 0; /* Add some vertical padding */
|
||||
box-sizing: border-box;
|
||||
pointer-events: none; /* Allow clicks to pass through */
|
||||
}
|
||||
|
||||
.triangle-connector {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 15px solid transparent; /* Adjust size */
|
||||
border-left: 15px solid white; /* Match card background */
|
||||
border-bottom: 15px solid transparent; /* Adjust size */
|
||||
}
|
||||
|
||||
/* Target the top triangle */
|
||||
.triangle-connector.top {
|
||||
border-top-width: 0; /* Start from a point */
|
||||
border-bottom-width: 20px; /* Adjust vertical expansion */
|
||||
border-left-width: 20px; /* Adjust horizontal expansion */
|
||||
border-left-color: white;
|
||||
}
|
||||
|
||||
/* Target the bottom triangle */
|
||||
.triangle-connector.bottom {
|
||||
border-top-width: 20px; /* Adjust vertical expansion */
|
||||
border-left-width: 20px; /* Adjust horizontal expansion */
|
||||
border-bottom-width: 0; /* End at a point */
|
||||
border-left-color: white;
|
||||
/* You might need to adjust positioning based on card placement */
|
||||
}
|
||||
|
||||
|
||||
/* Visually hidden class for accessibility */
|
||||
.visually-hidden {
|
||||
position: absolute !important;
|
||||
width: 1px !important;
|
||||
height: 1px !important;
|
||||
overflow: hidden !important;
|
||||
clip: rect(0 0 0 0) !important;
|
||||
margin: -1px !important;
|
||||
padding: 0 !important;
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
/* Basic responsive adjustments */
|
||||
@media (max-width: 768px) {
|
||||
body {
|
||||
flex-direction: column; /* Stack elements on smaller screens */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.page-container {
|
||||
flex-direction: column;
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
.content-area {
|
||||
width: 100%;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.thermometer-area {
|
||||
width: 80%;
|
||||
flex-direction: row; /* Label and graphic side by side */
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.thermometer-graphic-container {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.thermometer-label {
|
||||
writing-mode: horizontal-tb;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.triangle-connector-container {
|
||||
display: none; /* Hide triangles on smaller screens */
|
||||
}
|
||||
}
|
||||
141
src/static/css/new-design.css
Normal file
141
src/static/css/new-design.css
Normal file
|
|
@ -0,0 +1,141 @@
|
|||
body {
|
||||
font-family: sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #f4f4f4;
|
||||
display: flex; /* Enable flexbox for overall layout */
|
||||
}
|
||||
|
||||
.page-container {
|
||||
display: flex; /* Enable flexbox for main content and thermometer areas */
|
||||
width: 100%;
|
||||
max-width: 1200px; /* Optional: Limit page width */
|
||||
margin: 20px auto; /* Center the container */
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.content-area {
|
||||
width: 85%;
|
||||
padding-right: 5%; /* Spacing for the triangle */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.card-section {
|
||||
background-color: white;
|
||||
border: 1px solid #ddd;
|
||||
box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 20px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.card-header h2 {
|
||||
margin-top: 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
color: #555;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.card-bottom .read-more {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 15px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.card-bottom .read-more:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
|
||||
.thermometer-area {
|
||||
width: 10%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-left: 5px; /* Spacing from the content area */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.thermometer-label {
|
||||
font-size: 0.8em;
|
||||
color: #777;
|
||||
margin-bottom: 10px;
|
||||
text-align: center;
|
||||
writing-mode: vertical-lr; /* Make the label vertical */
|
||||
}
|
||||
|
||||
.thermometer-graphic {
|
||||
background: linear-gradient(to bottom, #fdd835, #e1f5fe); /* Two-color fade/gradient */
|
||||
width: 30px; /* Adjust thickness as needed */
|
||||
height: 200px; /* Adjust height as needed */
|
||||
border-radius: 15px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.triangle-connector {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 20px solid transparent; /* Adjust height to control triangle size */
|
||||
border-left: 20px solid white; /* Match card background */
|
||||
border-bottom: calc(100% - 20px) solid transparent; /* Adjust based on top border */
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 10%; /* Align with the thermometer area */
|
||||
box-sizing: border-box;
|
||||
pointer-events: none; /* Allow clicks to pass through */
|
||||
}
|
||||
|
||||
/* Visually hidden class for accessibility */
|
||||
.visually-hidden {
|
||||
position: absolute !important;
|
||||
width: 1px !important;
|
||||
height: 1px !important;
|
||||
overflow: hidden !important;
|
||||
clip: rect(0 0 0 0) !important;
|
||||
margin: -1px !important;
|
||||
padding: 0 !important;
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
/* Basic responsive adjustments */
|
||||
@media (max-width: 768px) {
|
||||
body {
|
||||
flex-direction: column; /* Stack elements on smaller screens */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.page-container {
|
||||
flex-direction: column;
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
.content-area {
|
||||
width: 100%;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.thermometer-area {
|
||||
width: 80%;
|
||||
flex-direction: row; /* Label and graphic side by side */
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.thermometer-label {
|
||||
writing-mode: horizontal-tb;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.triangle-connector {
|
||||
display: none; /* Hide triangle on smaller screens */
|
||||
}
|
||||
}
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
User-Agent: *
|
||||
Allow: /
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<sitemap>
|
||||
<url>
|
||||
<loc>https://bridgemanaccessible.ca/</loc>
|
||||
<lastmod>2025-07-12</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://bridgemanaccessible.ca/services</loc>
|
||||
<lastmod>2025-07-12</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://bridgemanaccessible.ca/products</loc>
|
||||
<lastmod>2025-07-12</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://bridgemanaccessible.ca/seo</loc>
|
||||
<lastmod>2025-07-12</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://bridgemanaccessible.ca/about</loc>
|
||||
<lastmod>2025-07-12</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://bridgemanaccessible.ca/contact</loc>
|
||||
<lastmod>2025-07-12</lastmod>
|
||||
</url>
|
||||
</sitemap>
|
||||
Loading…
Add table
Add a link
Reference in a new issue