refactor: moved counter component to content folder

This commit is contained in:
Sergey Yarkov 2022-08-15 17:24:52 +03:00
parent 8552126506
commit 6a68833cf7
5 changed files with 1 additions and 62 deletions

View File

@ -1,4 +1,4 @@
import { Component } from "solid-js"; import type { Component } from "solid-js";
import { createSignal, createEffect, For } from "solid-js"; import { createSignal, createEffect, For } from "solid-js";
import { search, selectedTags } from "@stores/searchStore"; import { search, selectedTags } from "@stores/searchStore";

View File

@ -1,14 +0,0 @@
.counter {
margin: 2rem 0;
display: flex;
flex-direction: column;
align-items: center;
row-gap: 15px;
border: 1px solid var(--border-color);
border-radius: var(--border-radius-md);
padding: 15px 5px;
& div {
display: flex;
column-gap: 3px;
}
}

View File

@ -1,45 +0,0 @@
import type { Component } from "solid-js";
import { createSignal, createEffect } from "solid-js";
import Button from "@components/Button";
import "./Counter.scss";
const Counter: Component<{ tick?: number }> = (props) => {
const [isRunned, setIsRunned] = createSignal<boolean>(false);
const [count, setCount] = createSignal<number>(0);
const run = () => setIsRunned(true);
const stop = () => setIsRunned(false);
const inc = () => setCount(count() + 1);
const dec = () => setCount(count() - 1);
createEffect(() => {
setInterval(() => {
if (isRunned()) {
setCount(count() + 1);
}
}, props.tick || 200);
});
return (
<div class="counter">
<span>{count()}</span>
<div>
<Button disabled={isRunned()} onClick={run}>
Run
</Button>
<Button disabled={isRunned()} onClick={inc}>
+
</Button>
<Button disabled={isRunned()} onClick={dec}>
-
</Button>
<Button disabled={!isRunned()} onClick={stop}>
Stop
</Button>
</div>
</div>
);
};
export default Counter;

View File

@ -1 +0,0 @@
export { default } from "./Counter";

View File

@ -4,7 +4,6 @@ import PageLayout from "@layouts/default.astro";
import SkillsList from "@components/SkillsList"; import SkillsList from "@components/SkillsList";
import SkillsBlock from "@components/SkillsBlock"; import SkillsBlock from "@components/SkillsBlock";
// TODO: import content based on user ui language
import ArticleContent from "@components/ArticleContent"; import ArticleContent from "@components/ArticleContent";
import { getLanguageFromURL } from "@root/utils"; import { getLanguageFromURL } from "@root/utils";
import { useTranslation } from "@i18n/utils"; import { useTranslation } from "@i18n/utils";