initial commit

This commit is contained in:
Tholut A 2026-08-08 17:55:56 +07:00
commit 7e466e29d2
28 changed files with 17360 additions and 0 deletions

51
entrypoints/popup/App.vue Normal file
View file

@ -0,0 +1,51 @@
<script lang="ts" setup>
import ToggleOnOff from "@/components/ToggleOnOff.vue";
import Todo from "@/components/Todo.vue"
import BlockedSite from "@/components/BlockedSite.vue"
const currentMenu = ref("main")
const menuLists = [
"main",
"completed",
"blocked sites",
]
const changeMenu = (menu: string) => {
currentMenu.value = menu
}
</script>
<template>
<ToggleOnOff />
<h1>let me focus</h1>
<ul style="text-align: center;" v-for="menu in menuLists">
<li>
<button @click="changeMenu(menu)">[{{ menu }}]</button>
</li>
</ul>
<Todo v-if="currentMenu === 'main'" showInput hoverShowDeleteButton />
<Todo v-if="currentMenu === 'completed'" showOnlyCompleted showClearAllTodo />
<BlockedSite v-if="currentMenu === 'blocked sites'" />
<br/>
[{{browser.runtime.getManifest().version}}]
</template>
<style scoped>
ul {
padding: 0;
display: inline-block;
}
li {
list-style: none;
margin: 0px 5px;
}
li button {
cursor: pointer;
}
.logo {
height: 6em;
filter: drop-shadow(0 0 1em #ffffff);
}
</style>

View file

@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>let me focus</title>
<meta name="manifest.type" content="browser_action" />
</head>
<body>
<div id="app"></div>
<script type="module" src="./main.ts"></script>
</body>
</html>

View file

@ -0,0 +1,5 @@
import { createApp } from 'vue';
import './style.css';
import App from './App.vue';
createApp(App).mount('#app');

View file

@ -0,0 +1,42 @@
:root {
font-family: monospace;
line-height: 1.5;
font-weight: 400;
color-scheme: light dark;
color: #ffffff;
background-color: #222222;
}
body {
margin: 0;
display: flex;
place-items: center;
min-width: 400px;
min-height: 100vh;
}
h1 {
font-size: 2.4em;
}
button {
font-size: 1em;
font-weight: 500;
}
#app {
max-width: 400px;
margin: 0 auto;
padding: 2rem;
text-align: center;
}
@media (prefers-color-scheme: light) {
:root {
color: #222222;
background-color: #ffffff;
}
button {
background-color: #f9f9f9;
}
}