Made shared button component and implemented usage

This commit is contained in:
2025-01-10 13:23:06 +00:00
parent 50477c680e
commit 27b748802a
3 changed files with 48 additions and 9 deletions

View File

@@ -1,15 +1,22 @@
<script>
import "./BottomCall.scss";
import Button from "../shared_components/Button.svelte";
</script>
<div class="btmcall">
<div class="btmcall-text">Interested in the project?</div>
<div class="btmcall-buttons">
<div class="btmcall-button1">
<div class="btmcall-get-involved">Get Involved!</div>
</div>
<div class="btmcall-button2">
<div class="btmcall-contact-us">Contact Us</div>
</div>
<Button
class="btmcall-button1"
text="Get Involved!"
inner_class="btmcall-get-involved"
hotkey="g"
/>
<Button
class="btmcall-button2"
text="Contact Us"
inner_class="btmcall-contact-us"
hotkey="c"
/>
</div>
</div>

View File

@@ -1,5 +1,6 @@
<script>
import "./Splash.scss";
import Button from "../shared_components/Button.svelte";
</script>
<div class="splash">
@@ -18,8 +19,11 @@
the collaboration and innovation that will build the future of this
technology.
</div>
<div class="splash-button">
<div class="splash-get-involved">Get Involved!</div>
</div>
<Button
class="splash-button"
text="Get Involved!"
inner_class="splash-get-involved"
hotkey="g"
/>
</div>
</div>

View File

@@ -0,0 +1,28 @@
<script>
export let text = "Button_Text";
export let inner_class = "";
export let redirectFunc = () => {};
export let hotkey = "";
function handleKeypress(event) {
if (
event.key === hotkey ||
event.key === "Enter" ||
event.key === " "
) {
event.preventDefault();
redirectFunc();
}
}
</script>
<div
class="cursor-pointer select-none {$$props.class}"
style="cursor: pointer;"
on:click={redirectFunc}
on:keydown={handleKeypress}
tabindex="0"
role="button"
>
<div class={inner_class}>{text}</div>
</div>