initial commit
This commit is contained in:
commit
7e466e29d2
28 changed files with 17360 additions and 0 deletions
51
entrypoints/popup/App.vue
Normal file
51
entrypoints/popup/App.vue
Normal 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>
|
||||
13
entrypoints/popup/index.html
Normal file
13
entrypoints/popup/index.html
Normal 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>
|
||||
5
entrypoints/popup/main.ts
Normal file
5
entrypoints/popup/main.ts
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
import { createApp } from 'vue';
|
||||
import './style.css';
|
||||
import App from './App.vue';
|
||||
|
||||
createApp(App).mount('#app');
|
||||
42
entrypoints/popup/style.css
Normal file
42
entrypoints/popup/style.css
Normal 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;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue