klemek/coverify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'template/master'

Browse Source
This commit is contained in:
klemek
2025-12-20 16:13:55 +01:00
parent 9475478c17 12cc248df4
commit fd05dcfedd
7 changed files with 133 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.editorconfig
+5 -1
View File
@@ -5,8 +5,12 @@ root = true
[*] [*]
indent_style = space indent_style = space
indent_size = 2 indent_size = 4
end_of_line = lf end_of_line = lf
charset = utf-8 charset = utf-8
trim_trailing_whitespace = true trim_trailing_whitespace = true
insert_final_newline = true insert_final_newline = true
[Makefile]
indent_style = tab
indent_size = 2
.github/workflows/ci.yml
-1
View File
@@ -17,7 +17,6 @@ jobs:
build: build:
runs-on: ubuntu-latest runs-on: ubuntu-latest
needs: eslint
steps: steps:
- uses: actions/checkout@v2 - uses: actions/checkout@v2
- uses: oven-sh/setup-bun@v2 - uses: oven-sh/setup-bun@v2
Makefile
+40
View File
@@ -0,0 +1,40 @@
ifeq ($(shell which bun &>/dev/null && echo 1 || echo 0), 1)
NPM ?= bun
endif
NPM ?= npm
.PHONY: help
help: ## show this message
@echo "Usage: make [target1] (target2) ..."
@echo ""
@echo "Commands/Targets:"
@grep -E '(^[a-zA-Z0-9_%-]+:.*?##.*$$)|(^##)' $(MAKEFILE_LIST) | awk 'BEGIN {FS = ":.*?## "}{printf "\033[32m%-20s\033[0m %s\n", $$1, $$2}' | sed -e 's/\[32m##/[33m/'
@echo ""
@echo "Environment:"
@grep -E '^[a-zA-Z0-9_-]+\s*[?:]?=.*$$' $(MAKEFILE_LIST) | grep -Eo '^[a-zA-Z0-9_-]+' | xargs -I {} make -s print-{}
.PHONY: print-%
print-%:
@echo -e '\033[32m$*\033[0m = $($*)'
build: ## build static site in "dist"
@$(NPM) run build
.PHONY: run
def: ## run dev version of static site
@$(NPM) run dev
lint: ## lint code
@$(NPM) run lint
fix: ## fix and reformat code
@$(NPM) run format
@$(NPM) run lint-fix
update-template: ## update code from template
@(git remote | grep template &>/dev/null) || git remote add template https://github.com/klemek/vue-boilerplate.git
git fetch template
git merge template/master --allow-unrelated-histories
package.json
+1 -1
View File
@@ -13,7 +13,7 @@
"build-only": "vite build", "build-only": "vite build",
"type-check": "vue-tsc --build", "type-check": "vue-tsc --build",
"lint": "eslint . --cache", "lint": "eslint . --cache",
"fix": "eslint . --fix --cache", "lint-fix": "eslint . --fix --cache",
"format": "prettier --write --experimental-cli src/" "format": "prettier --write --experimental-cli src/"
}, },
"dependencies": { "dependencies": {
src/App.vue
+47 -47
View File
@@ -1,70 +1,70 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted } from "vue"; import { ref, onMounted } from "vue";
import LucideIcon from "./components/LucideIcon.vue"; import LucideIcon from "./components/LucideIcon.vue";
import CustomButton from "./components/CustomButton.vue" import CustomButton from "./components/CustomButton.vue";
const visible = ref<boolean>(false); const visible = ref<boolean>(false);
onMounted(() => { onMounted(() => {
setTimeout(() => { setTimeout(() => {
visible.value = true; visible.value = true;
}); });
}); });
</script> </script>
<template> <template>
<main :style="{ display: visible ? 'inherit' : 'none' }"> <main :style="{ display: visible ? 'inherit' : 'none' }">
<!-- TODO: 1. rename app --> <!-- TODO: 1. rename app -->
<h1> <h1>
<LucideIcon name="package" /> <LucideIcon name="package" />
Vue-Boilerplate Vue-Boilerplate
</h1> </h1>
<br /> <br />
<p> <p>
Fill this page with <i>whatever</i> you're going to develop. Fill this page with <i>whatever</i> you're going to develop.
<br> <br />
<b>Then enjoy!</b> <b>Then enjoy!</b>
</p> </p>
<CustomButton> <CustomButton>
<LucideIcon name="square-arrow-right"/> This is a sample button yay <LucideIcon name="square-arrow-right" /> This is a sample button yay
</CustomButton> </CustomButton>
<br /> <br />
<hr /> <hr />
<small class="footer"> <small class="footer">
<LucideIcon name="at-sign" /> <LucideIcon name="at-sign" />
&nbsp; &nbsp;
<a href="https://github.com/klemek" target="_blank">klemek</a> <a href="https://github.com/klemek" target="_blank">klemek</a>
- -
<!-- TODO: 1. rename app --> <!-- TODO: 1. rename app -->
<LucideIcon name="github" /> <LucideIcon name="github" />
&nbsp; &nbsp;
<a href="https://github.com/klemek/vue-boilerplate" target="_blank"> <a href="https://github.com/klemek/vue-boilerplate" target="_blank">
Repository Repository
</a> </a>
- 2025 - 2025
</small> </small>
</main> </main>
</template> </template>
<style scoped> <style scoped>
.button { .button {
display: block; display: block;
width: 100%; width: 100%;
text-decoration: none; text-decoration: none;
padding: 1em; padding: 1em;
margin-bottom: 0.75em; margin-bottom: 0.75em;
border: 1px solid var(--color-primary); border: 1px solid var(--color-primary);
border-radius: 0.5em; border-radius: 0.5em;
background-color: var(--background); background-color: var(--background);
cursor: pointer; cursor: pointer;
font-size: 1.333em; font-size: 1.333em;
} }
.button:hover { .button:hover {
background-color: var(--background-secondary); background-color: var(--background-secondary);
} }
.footer { .footer {
opacity: 50%; opacity: 50%;
} }
</style> </style>
src/components/CustomButton.vue
+19 -19
View File
@@ -1,36 +1,36 @@
<script setup lang="ts"> <script setup lang="ts">
interface Props { interface Props {
href?: string; href?: string;
color?: string; color?: string;
} }
defineProps<Props>(); defineProps<Props>();
</script> </script>
<template> <template>
<component <component
:is="href ? 'a' : 'div'" :is="href ? 'a' : 'div'"
:class="`button ${color ? 'b-' + color + ' ' + color : ''}`" :class="`button ${color ? 'b-' + color + ' ' + color : ''}`"
> >
<slot></slot> <slot></slot>
</component> </component>
</template> </template>
<style scoped> <style scoped>
.button { .button {
display: block; display: block;
width: 100%; width: 100%;
text-decoration: none; text-decoration: none;
padding: 1em; padding: 1em;
margin-bottom: 0.75em; margin-bottom: 0.75em;
border: 1px solid var(--color-primary); border: 1px solid var(--color-primary);
border-radius: 0.5em; border-radius: 0.5em;
background-color: var(--background); background-color: var(--background);
cursor: pointer; cursor: pointer;
font-size: 1.333em; font-size: 1.333em;
} }
.button:hover { .button:hover {
background-color: var(--background-secondary); background-color: var(--background-secondary);
} }
</style> </style>
src/components/LucideIcon.vue
+21 -18
View File
@@ -3,27 +3,30 @@ import { computed, onMounted } from "vue";
import * as icons from "lucide-vue-next"; import * as icons from "lucide-vue-next";
interface Props { interface Props {
name: string; name: string;
color?: string; color?: string;
strokeWidth?: string; strokeWidth?: string;
defaultClass?: string; defaultClass?: string;
} }
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {
color: "currentColor", color: "currentColor",
strokeWidth: "2", strokeWidth: "2",
defaultClass: "lucide", defaultClass: "lucide",
}); });
function kebab2camel(kebab: string): string { function kebab2camel(kebab: string): string {
return kebab return kebab
.split("-") .split("-")
.map((item) => item.charAt(0).toUpperCase() + item.slice(1).toLowerCase()) .map(
.join(""); (item) =>
item.charAt(0).toUpperCase() + item.slice(1).toLowerCase(),
)
.join("");
} }
onMounted(() => { onMounted(() => {
console.log(kebab2camel(props.name)); console.log(kebab2camel(props.name));
}); });
// @ts-expect-error: cannot infer type of all exported data // @ts-expect-error: cannot infer type of all exported data
@@ -31,10 +34,10 @@ const icon = computed(() => icons[kebab2camel(props.name)]);
</script> </script>
<template> <template>
<component <component
:is="icon" :is="icon"
:color="color" :color="color"
:stroke-width="strokeWidth" :stroke-width="strokeWidth"
:default-class="defaultClass" :default-class="defaultClass"
/> />
</template> </template>