Skip to content

Commit

Permalink
refactor: comment out unused styles and add aria-labels for accessibi…
Browse files Browse the repository at this point in the history
…lity
  • Loading branch information
xuelink committed Jan 9, 2025
1 parent de376eb commit 0251aaf
Show file tree
Hide file tree
Showing 7 changed files with 102 additions and 75 deletions.
30 changes: 15 additions & 15 deletions src/lib/components/organisms/About.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -75,19 +75,19 @@
}
}
.socials {
display: flex;
align-items: center;
gap: 15px;
// .socials {
// display: flex;
// align-items: center;
// gap: 15px;
@mixin for-phone-only {
justify-content: center;
margin-bottom: 10px;
span {
display: none;
}
}
}
// @mixin for-phone-only {
// justify-content: center;
// margin-bottom: 10px;
// span {
// display: none;
// }
// }
// }
.image {
width: 100%;
Expand All @@ -103,9 +103,9 @@
font-size: 1.2em;
}
.github {
margin-left: 5px;
}
// .github {
// margin-left: 5px;
// }
a {
transition: all 0.2s ease-in-out;
Expand Down
30 changes: 25 additions & 5 deletions src/lib/components/organisms/BCSponsors.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,12 @@
<h2>Powered by Growing Companies Worldwide</h2>
<div class="sponsor-container">
<div>
<a href="https://www.cloudflare.com" target="_blank" rel="noopener noreferrer">
<a
href="https://www.cloudflare.com"
target="_blank"
rel="noopener noreferrer"
aria-label="Cloudflare"
>
<svg
fill="var(--color--text)"
width="58px"
Expand All @@ -26,7 +31,12 @@
</a>
</div>
<div>
<a href="https://www.digitalocean.com" target="_blank" rel="noopener noreferrer">
<a
href="https://www.digitalocean.com"
target="_blank"
rel="noopener noreferrer"
aria-label="DigitalOcean"
>
<svg
width="52px"
height="52px"
Expand All @@ -50,7 +60,12 @@
</a>
</div>
<div>
<a href="https://www.backblaze.com" target="_blank" rel="noopener noreferrer">
<a
href="https://www.backblaze.com"
target="_blank"
rel="noopener noreferrer"
aria-label="Backblaze"
>
<svg
width="50px"
height="50px"
Expand All @@ -71,7 +86,7 @@
</a>
</div>
<div>
<a href="https://nodejs.org" target="_blank" rel="noopener noreferrer">
<a href="https://nodejs.org" target="_blank" rel="noopener noreferrer" aria-label="Node.js">
<svg
width="50px"
height="50px"
Expand All @@ -93,7 +108,12 @@
</a>
</div>
<div>
<a href="https://appwrite.io" target="_blank" rel="noopener noreferrer">
<a
href="https://appwrite.io"
target="_blank"
rel="noopener noreferrer"
aria-label="Appwrite"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="45"
Expand Down
19 changes: 12 additions & 7 deletions src/lib/components/organisms/CSponsors.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,12 @@
</a>
</div>
<div>
<a href="https://facebook.com" target="_blank" rel="noopener noreferrer">
<a
href="https://facebook.com"
target="_blank"
rel="noopener noreferrer"
aria-label="Facebook"
>
<svg
width="68px"
height="68px"
Expand All @@ -56,7 +61,7 @@
</a>
</div>
<div>
<a href="https://tiktok.com" target="_blank" rel="noopener noreferrer">
<a href="https://tiktok.com" target="_blank" rel="noopener noreferrer" aria-label="TikTok">
<svg
fill="var(--color--text)"
width="50px"
Expand All @@ -75,7 +80,7 @@
</a>
</div>
<div>
<a href="https://google.com" target="_blank" rel="noopener noreferrer">
<a href="https://google.com" target="_blank" rel="noopener noreferrer" aria-label="Google">
<svg
width="45px"
height="45px"
Expand Down Expand Up @@ -188,7 +193,7 @@
</a>
</div>
<div>
<a href="https://huawei.com" target="_blank" rel="noopener noreferrer">
<a href="https://huawei.com" target="_blank" rel="noopener noreferrer" aria-label="Huawei">
<svg
xmlns="http://www.w3.org/2000/svg"
width="50"
Expand Down Expand Up @@ -221,9 +226,9 @@
text-align: center;
}
.second-sponsor {
margin-top: 80px;
}
// .second-sponsor {
// margin-top: 80px;
// }
.sponsor-container {
display: grid;
Expand Down
18 changes: 9 additions & 9 deletions src/lib/components/organisms/FAQ.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -113,10 +113,8 @@
}}
id="accordion-button-5"
aria-expanded={item?.isOpen}
><span class="accordion-title">{item?.title}</span><span
class="icon"
aria-hidden="true"
/></button
><span class="accordion-title">{item?.title}</span><span class="icon" aria-hidden="true"
></span></button
>
<div class="accordion-content">
<p>{@html item?.content}</p>
Expand All @@ -129,7 +127,7 @@

<style lang="scss">
@use '../../../lib/scss/breakpoints.scss';
#faq {
display: flex;
flex-direction: column;
Expand All @@ -143,9 +141,9 @@
padding: 40px 0 50px;
}
.hello {
text-align: center;
}
// .hello {
// text-align: center;
// }
}
$yellow: var(--color--primary);
Expand Down Expand Up @@ -254,7 +252,9 @@
opacity: 0;
max-height: 0;
overflow: hidden;
transition: opacity 200ms linear, max-height 200ms linear;
transition:
opacity 200ms linear,
max-height 200ms linear;
will-change: opacity, max-height;
p {
Expand Down
62 changes: 32 additions & 30 deletions src/lib/components/organisms/Footer.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -164,7 +164,7 @@
</div>
</div>
<div class="footer-logo">
<a href="/">
<a href="/" aria-label="LangX">
<svg xmlns="http://www.w3.org/2000/svg" width="100.852" height="21.544">
<path
fill="#000"
Expand Down Expand Up @@ -242,35 +242,37 @@
grid-row-start: 1;
}
.credits {
position: relative;
background-color: var(--color--yellow);
border-radius: 5px;
padding: 15px 10px;
font-weight: 400;
font-size: 80%;
color: var(--color--text);
margin-top: 1rem;
box-shadow: 10px 10px 3px rgba(0, 0, 0, 0.5), 0 0 8px rgba(0, 0, 0, 0.5);
max-width: 400px;
@mixin for-phone-only {
display: none;
}
a {
color: var(--color--text);
text-decoration: none;
transition: all 0.2s ease-in-out;
font-weight: bold;
&:hover {
color: var(--color--text);
filter: drop-shadow(0px 0px 3px var(--color--text-shade));
transition: color 0.5s ease-in-out;
}
}
}
// .credits {
// position: relative;
// background-color: var(--color--yellow);
// border-radius: 5px;
// padding: 15px 10px;
// font-weight: 400;
// font-size: 80%;
// color: var(--color--text);
// margin-top: 1rem;
// box-shadow:
// 10px 10px 3px rgba(0, 0, 0, 0.5),
// 0 0 8px rgba(0, 0, 0, 0.5);
// max-width: 400px;
// @mixin for-phone-only {
// display: none;
// }
// a {
// color: var(--color--text);
// text-decoration: none;
// transition: all 0.2s ease-in-out;
// font-weight: bold;
// &:hover {
// color: var(--color--text);
// filter: drop-shadow(0px 0px 3px var(--color--text-shade));
// transition: color 0.5s ease-in-out;
// }
// }
// }
}
.links-wrapper {
Expand Down
6 changes: 3 additions & 3 deletions src/lib/components/organisms/Testimonials.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -180,7 +180,7 @@
</div>
</div>
{/each}
<button id="next" on:click={handleNext}>
<button id="next" on:click={handleNext} aria-label="Next">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
Expand All @@ -191,7 +191,7 @@
<path stroke-linecap="round" stroke-linejoin="round" d="m8.25 4.5 7.5 7.5-7.5 7.5" />
</svg>
</button>
<button id="prev" on:click={handlePrev}>
<button id="prev" on:click={handlePrev} aria-label="Previous">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
Expand All @@ -214,7 +214,7 @@
active = index;
loadShow();
}}
/>
></span>
{/each}
</div>
</section>
Expand Down
12 changes: 6 additions & 6 deletions src/routes/(blog-article)/+layout.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -153,12 +153,12 @@
box-shadow: var(--image-shadow);
border-radius: 6px;
img {
width: 100%;
height: 100%;
max-height: 400px;
object-fit: cover;
}
// img {
// width: 100%;
// height: 100%;
// max-height: 400px;
// object-fit: cover;
// }
}
:global(.cover-image img) {
Expand Down

0 comments on commit 0251aaf

Please sign in to comment.