mirror of
https://github.com/Cian-H/am-d-model.eu.git
synced 2025-12-22 21:41:57 +00:00
Made shared button component and implemented usage
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
28
src/shared_components/Button.svelte
Normal file
28
src/shared_components/Button.svelte
Normal 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>
|
||||
Reference in New Issue
Block a user