lauchmelder/FuriKani
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

finished popup styling

Browse source
This commit is contained in:
Lauchmelder 2022-03-20 17:40:08 +01:00
parent 1f5452b98a
commit 3b02d6a4b2
No known key found for this signature in database
GPG key ID: C2403C69D78F011D
3 changed files with 42 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
manifest.json
View file

@ -1,7 +1,7 @@
{
"name": "FuriKani",
"description": "Removes furigana on websites based on your WaniKani level",
"version": "0.5.1",
"version": "0.6",
"manifest_version": 3,
"action": {
"default_popup": "popup.html"

7
popup.html
View file

@ -6,7 +6,7 @@
<body>
<header>
<h1>FuriKani</h1>
<h2>v0.5.1</h2>
<h2>v0.6</h2>
</header>
<div id="token-area">
@ -51,7 +51,10 @@
</div>
<footer>
Using WaniKani Level <span id="level"></span>
<span id="level-text">Using WaniKani Level <span id="level"></span></span>
<span id="author" >Made by <a target="_blank" href="https://github.com/Lauchmelder23">Lauchmelder</a></span>
<a id="source" target="_blank" href="https://github.com/Lauchmelder23/FuriKani">Source Code</a>
</footer>
<script src="src/popup.js"></script>

43
src/styles.css
View file

@ -4,14 +4,17 @@
padding: 0px;
box-sizing: border-box;
border-radius: 0px;
color: #ECB365
}
body
{
border: 5px solid #04293A;
background-color: #041C32;
display: grid;
grid-template-rows: 1.5fr 1fr 3fr 2fr;
width: 250px;
margin: 0.5rem;
grid-template-rows: 1.5fr 0.5fr 2.5fr 1fr;
width: 275px;
padding: 0.5rem;
}
header
@ -19,6 +22,8 @@ header
display: grid;
grid-template-columns: 8fr 1fr;
align-items: baseline;
border-bottom: 1px solid #064663;
margin-bottom: 0.5rem;
}
h1
@ -36,6 +41,7 @@ h2
{
display: grid;
grid-template-rows: 1fr 1fr;
margin-bottom: -10px;
}
#input-area
@ -50,25 +56,34 @@ h2
}
#token
{
border: none;
background-color: #064663;
color: #ECB365;
}
#token::placeholder
{
border-width: 1px;
background-color: #064663;
color: #8d7553;
}
#submit-token
{
border-width: 1px;
background-color: white;
border: none;
background-color: #064663;
font-size: 1rem;
}
#submit-token:hover
{
background-color: grey;
background-color: #04293A;
}
#submit-token:host()
{
background-color: rgb(85, 85, 85);
background-color: #041C32;
}
#settings-area
@ -90,6 +105,20 @@ h2
align-items: center;
}
footer
{
border-top: 1px solid #064663;
display: grid;
grid-template-rows: repeat(3, 1fr);
justify-items: right;
}
a, a:visited
{
text-decoration: none;
color: #2e94c3;
}
/* The switch - the box around the slider */
.switch {
position: relative;