Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix some accessibility #2

Merged
merged 2 commits into from Mar 4, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
Expand Up @@ -18,10 +18,10 @@ pub struct Props {
pub fn flashy_homepage_section_heading(props: &Props) -> Html {
let icon_component = use_memo((props.icon.clone(),), |(icon,)| match icon {
SectionIcon::Icon(id) => html! {
<Icon icon_id={id.clone()} class={classes!("text-bcss-800", "dark:text-bcss-300" )} width="48" height="48" />
<Icon icon_id={id.clone()} class={classes!("text-bcss-800", "dark:text-bcss-300" )} width="48" height="48"/* role="presentation"*/ />
},
SectionIcon::Emoji(emoji) => html! {
<p class="text-6xl">{emoji.clone()}</p>
<p class="text-6xl" role="presentation">{emoji.clone()}</p>
},
});

Expand Down
Expand Up @@ -46,7 +46,7 @@ pub fn flashy_homepage_section(props: &Props) -> Html {
if let Some(image_src) = (*image_src).clone() {
<div class="md:max-w-[40%] mt-14 md:mt-20 md:ml-8">
<img src={image_src} class="h-auto rounded-2xl shadow-xl shadow-bcss-900/40 dark:brightness-95"
loading="lazy" />
loading="lazy" role="presentation" />
</div>
}
</div>
Expand Down
Expand Up @@ -5,7 +5,7 @@ use crate::components::flashy_homepage::tracks::track_grid_item::TrackGridItem;
#[function_component(TrackGrid)]
pub fn track_grid() -> Html {
html! {
<div class="w-full grid md:grid-cols-3 grid-cols-1 gap-4 mt-8" role="list">
<ul class="w-full grid md:grid-cols-3 grid-cols-1 gap-4 mt-8">
<TrackGridItem track_name="Hackers' Choice" background_image="img/track_hackers_choice.webp"
track_caption="People are great, and we famously always make good decisions as a group. The biggest decision of your collective lives is now upon you! (Debatably) Who’s got the funniest project? Which project really tugs at your heart strings? Which project do you think is just the best (except your own, obviously). It really is up to you!"
track_prize="TBA" track_company="BCSS" track_company_link="https://thesubath.com/bcss" />
Expand All @@ -14,12 +14,11 @@ pub fn track_grid() -> Html {
track_caption="Think you can use deep learning to solve P=NP? Or how about a universal password hash cracker? We're looking for the most mind-bogglingly techy projects which manage to do something incredible in just 24 hours. The standards are always high, and this year will be no different!"
track_prize="TBA" track_company="BCSS" track_company_link="https://thesubath.com/bcss" />

<div class="h-40 flex justify-center items-center border-2 border-gray-200 dark:border-bcss-800 rounded-2xl"
role="listitem">
<li class="h-full flex justify-center items-center border-2 border-gray-200 dark:border-bcss-800 rounded-2xl">
<p class="text-bcss-500 dark:text-bcss-400 font-light">
{"More tracks coming soon..."}
</p>
</div>
</div>
</li>
</ul>
}
}
Expand Up @@ -29,8 +29,8 @@ pub fn track_grid_item(props: &Props) -> Html {

html! {
<>
<div class="w-full h-40 relative rounded-2xl overflow-hidden shadow-bcss-900/40 shadow-xl hover:scale-105 transition-transform"
role="listitem">
<li
class="w-full h-40 relative rounded-2xl overflow-hidden shadow-bcss-900/40 shadow-xl hover:scale-105 transition-transform">
<div style={format!("background-image: url('{}');", props.background_image.clone())}
class="absolute top-0 left-0 w-full h-full bg-bcss-200 brightness-75 blur-sm" />
<a class="absolute top-0 left-0 w-full h-full flex flex-col justify-center items-center text-center drop-shadow cursor-pointer px-2"
Expand All @@ -42,7 +42,7 @@ pub fn track_grid_item(props: &Props) -> Html {
{"from "}<strong>{props.track_company.clone()}</strong>
</span>
</a>
</div>
</li>

<Modal open={show_modal}>
<div class="flex items-center justify-between space-x-6">
Expand Down
4 changes: 2 additions & 2 deletions packages/frontend/src/pages/home.rs
Expand Up @@ -46,8 +46,8 @@ pub fn home_page() -> Html {
<HeroGradientContainer>
<div class="w-full px-4 sm:px-6 md:px-8 lg:px-[5%] xl:px-[10%] flex items-center">
<div class="space-y-4 flex-1 md:mr-10">
<img src="img/logo.svg" alt="Bath Hack 24 Logo" class="lg:h-44 md:h-32 h-28" />
<h1 class="text-4xl md:text-5xl xl:text-6xl font-hero text-bcss-100 leading-none">
<img src="img/logo.svg" role="presentation" class="lg:h-48 md:h-32 h-24" />
<h1 class="text-3xl sm:text-5xl md:text-6xl xl:text-7xl font-hero text-bcss-100 leading-none">
{ "Bath Hack 2024" }
</h1>
<p class="text-heroSubtitle text-bcss-100">
Expand Down