Skip to content

Commit

Permalink
2.1
Browse files Browse the repository at this point in the history 
Some improvements to the UI
  • Loading branch information
@Sav22999
Sav22999 committed Jun 28, 2021
1 parent b85e6d2 commit c700736
Show file tree
Hide file tree
Showing 21 changed files with 372 additions and 141 deletions.
45 changes: 26 additions & 19 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,37 +1,44 @@
# <img src="img/icon-dark-96.png" width="40px" alt=""></img> Accented letters
<h1 align="center">
<br>
<img width="70" src="img/icon-dark.svg" alt="Accented Letters icon" />
<br>
<h1>Accented Letters</h1>
<br>
</h1>

This extension permits you to copy an accented letter in the clipboard. You can choose if you want to copy a lower letter or an upper letter. It supports 66 accented letters.
Official repo of https://addons.mozilla.org/it/firefox/addon/accented-letters/.
Official repository of https://addons.mozilla.org/it/firefox/addon/accented-letters/.

[![GitHub release](https://img.shields.io/github/release/Sav22999/accented-letters-addons.svg)](https://github.com/Sav22999/emoji/releases/) [![GitHub license](https://img.shields.io/github/license/Sav22999/accented-letters-addons.svg)](https://github.com/Sav22999/accented-letters-addons/blob/master/LICENSE) ![Maintenance](https://img.shields.io/badge/Maintained%3F-yes-green.svg) [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2FSav22999%2Faccented-letters-addons.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2FSav22999%2Faccented-letters-addons?ref=badge_shield)

[<img src="img/badge.png" width="170px">](https://addons.mozilla.org/it/firefox/addon/accented-letters/) [<img src="https://www.saveriomorelli.com/images/badges/a-project-of.png" width="200px" />](https://saveriomorelli.com) [<img src="https://www.saveriomorelli.com/images/badges/realised-by.png" width="200px" />](https://saveriomorelli.com)
[<img src="img/badge.png" width="170px">](https://addons.mozilla.org/it/firefox/addon/accented-letters/)

To support me, you can do a donation :smile: with PayPal or Ko-fi:
To support me, you can do a donation :smile: with **PayPal**, **LiberaPay** or **Ko-Fi**:

[<img src="img/donatePayPal.png" width="200px"></img>](https://bit.ly/3aJnnq7) [<img src="https://cdn.ko-fi.com/cdn/kofi1.png?v=2" width="200px"></img>](https://ko-fi.com/R5R31UQ8G)
<a href="https://liberapay.com/Sav22999/donate"><img alt="Donate using Liberapay" src="https://liberapay.com/assets/widgets/donate.svg"></a> [<img src="img/paypal.svg" width="160px"></img>](https://paypal.me/pools/c/8yl6auiU6e) [<img src="https://cdn.ko-fi.com/cdn/kofi1.png?v=2" width="120px"></img>](https://ko-fi.com/R5R31UQ8G)

## How to contribute
You can open an issue and there you must describe the feedback, the bug or the new feature you want. You can request a new language too.

## Supported languages

The add-ons is translated in these following languages (sort A-Z):
The add-on is translated in these following languages (sort A-Z):

- Arabic (ar)
- English (default - en-US, en-UK, en-CA)
- German (de)
- Spanish (es-ES, es-AR, es-CL, es-MX)
- French (fr)
- Italian (it)
- Japanese (ja)
- Dutch (nl)
- Polish (pl)
- Portuguese (pt-PT, pt-BR)
- Chinese (zh-CN, zh-TW)
- Arabic (`ar`)
- English (default - `en-US`, `en-UK`, `en-CA`)
- German (`de`)
- Spanish (`es-ES`, `es-AR`, `es-CL`, `es-MX`)
- French (`fr`)
- Italian (`it`)
- Japanese (`ja`)
- Dutch (`nl`)
- Polish (`pl`)
- Portuguese (`pt-PT`, `pt-BR`)
- Chinese (`zh-CN`, `zh-TW`)

## Screenshots

<img src="screenshots/2/screenshot.png" alt="screenshot new UI" height="500px" />
<img src="screenshots/2.1/1.png" alt="screenshot new UI" height="500px" />

## License
[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2FSav22999%2Faccented-letters-addons.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2FSav22999%2Faccented-letters-addons?ref=badge_large)
[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2FSav22999%2Faccented-letters-addons.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2FSav22999%2Faccented-letters-addons?ref=badge_large)
84 changes: 57 additions & 27 deletions accentedletters.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,37 +5,67 @@

<head>
<meta charset="utf-8">
<link rel="stylesheet" href="./css/accentedletters.css" />
<link rel="stylesheet" href="./css/accentedletters.css"/>
</head>

<body>
<div id="popup-content">
<div id="titles">
<input type="button" class="section_title" id="lowercase" value="Lowercase" /><input type="button" class="section_title" id="uppercase" value="Uppercase" />
</div>
<div id="letters">
<input type="button" class="letter" value="á" /><input type="button" class="letter" value="à" /><input type="button" class="letter" value="ä" /><input type="button" class="letter" value="â" /><input type="button" class="letter" value="å" /><input type="button" class="letter" value="ã" /><input type="button" class="letter" value="ā"><input type="button" class="letter" value="ă" />
<br/>
<input type="button" class="letter" value="é" /><input type="button" class="letter" value="è" /><input type="button" class="letter" value="ë" /><input type="button" class="letter" value="ê" /><input type="button" class="letter" value="ė" /><input type="button" class="letter" value="ē" /><input type="button" class="letter" value="ĕ" /><input type="button" class="letter" value="ě" />
<br/>
<input type="button" class="letter" value="í" /><input type="button" class="letter" value="ì" /><input type="button" class="letter" value="ï" /><input type="button" class="letter" value="î" /><input type="button" class="letter" value="ĩ" /><input type="button" class="letter" value="ī" /><input type="button" class="letter" value="ĭ" />
<br/>
<input type="button" class="letter" value="ó" /><input type="button" class="letter" value="ò" /><input type="button" class="letter" value="ö" /><input type="button" class="letter" value="ô" /><input type="button" class="letter" value="õ" /><input type="button" class="letter" value="ō" /><input type="button" class="letter" value="ŏ" /><input type="button" class="letter" value="ő" />
<br/>
<input type="button" class="letter" value="ú" /><input type="button" class="letter" value="ù" /><input type="button" class="letter" value="ü" /><input type="button" class="letter" value="û" /><input type="button" class="letter" value="ů" /><input type="button" class="letter" value="ũ" /><input type="button" class="letter" value="ū" /><input type="button" class="letter" value="ŭ" /><input type="button" class="letter" value="ű" />
<br/>
<input type="button" class="letter" value="ć" /><input type="button" class="letter" value="ĉ" /><input type="button" class="letter" value="ċ" /><input type="button" class="letter" value="č" /><input type="button" class="letter" value="ý" /><input type="button" class="letter" value="ŷ" /><input type="button" class="letter" value="ÿ" />
<br/>
<input type="button" class="letter" value="ń" /><input type="button" class="letter" value="ñ" /><input type="button" class="letter" value="ň" /><input type="button" class="letter" value="ǵ" /><input type="button" class="letter" value="ĝ" /><input type="button" class="letter" value="ġ" /><input type="button" class="letter" value="ğ" /><input type="button" class="letter" value="ģ" />
<br>
<input type="button" class="letter" value="ď" /><input type="button" class="letter" value="ť" /><input type="button" class="letter" value="ĥ" /><input type="button" class="letter" value="ŵ" /><input type="button" class="letter" value="ŕ" /><input type="button" class="letter" value="ř" />
<br>
<input type="button" class="letter" value="ś" /><input type="button" class="letter" value="ŝ" /><input type="button" class="letter" value="ź" /><input type="button" class="letter" value="ż" /><input type="button" class="letter" value="ž" />
</div>
<input type="text" id="text_to_copy" style="display: none;" />
<!--Model: <input type="button" class="letter" value="" />-->
<div id="popup-content">
<div id="popup-content-background"></div>
<div id="titles">
<input type="button" class="section_title" id="lowercase" value="Lowercase"/><input type="button"
class="section_title"
id="uppercase"
value="Uppercase"/>
</div>
<script src="./js/accentedletters.js"></script>
<div id="letters">
<input type="button" class="letter" value="á"/><input type="button" class="letter" value="à"/><input
type="button" class="letter" value="ä"/><input type="button" class="letter" value="â"/><input
type="button" class="letter" value="å"/><input type="button" class="letter" value="ã"/><input
type="button" class="letter" value="ā"><input type="button" class="letter" value="ă"/>
<br/>
<input type="button" class="letter" value="é"/><input type="button" class="letter" value="è"/><input
type="button" class="letter" value="ë"/><input type="button" class="letter" value="ê"/><input
type="button" class="letter" value="ė"/><input type="button" class="letter" value="ē"/><input
type="button" class="letter" value="ĕ"/><input type="button" class="letter" value="ě"/>
<br/>
<input type="button" class="letter" value="í"/><input type="button" class="letter" value="ì"/><input
type="button" class="letter" value="ï"/><input type="button" class="letter" value="î"/><input
type="button" class="letter" value="ĩ"/><input type="button" class="letter" value="ī"/><input
type="button" class="letter" value="ĭ"/>
<br/>
<input type="button" class="letter" value="ó"/><input type="button" class="letter" value="ò"/><input
type="button" class="letter" value="ö"/><input type="button" class="letter" value="ô"/><input
type="button" class="letter" value="õ"/><input type="button" class="letter" value="ō"/><input
type="button" class="letter" value="ŏ"/><input type="button" class="letter" value="ő"/>
<br/>
<input type="button" class="letter" value="ú"/><input type="button" class="letter" value="ù"/><input
type="button" class="letter" value="ü"/><input type="button" class="letter" value="û"/><input
type="button" class="letter" value="ů"/><input type="button" class="letter" value="ũ"/><input
type="button" class="letter" value="ū"/><input type="button" class="letter" value="ŭ"/><input
type="button" class="letter" value="ű"/>
<br/>
<input type="button" class="letter" value="ć"/><input type="button" class="letter" value="ĉ"/><input
type="button" class="letter" value="ċ"/><input type="button" class="letter" value="č"/><input
type="button" class="letter" value="ý"/><input type="button" class="letter" value="ŷ"/><input
type="button" class="letter" value="ÿ"/>
<br/>
<input type="button" class="letter" value="ń"/><input type="button" class="letter" value="ñ"/><input
type="button" class="letter" value="ň"/><input type="button" class="letter" value="ǵ"/><input
type="button" class="letter" value="ĝ"/><input type="button" class="letter" value="ġ"/><input
type="button" class="letter" value="ğ"/><input type="button" class="letter" value="ģ"/>
<br>
<input type="button" class="letter" value="ď"/><input type="button" class="letter" value="ť"/><input
type="button" class="letter" value="ĥ"/><input type="button" class="letter" value="ŵ"/><input
type="button" class="letter" value="ŕ"/><input type="button" class="letter" value="ř"/>
<br>
<input type="button" class="letter" value="ś"/><input type="button" class="letter" value="ŝ"/><input
type="button" class="letter" value="ź"/><input type="button" class="letter" value="ż"/><input
type="button" class="letter" value="ž"/>
</div>
<input type="text" id="text_to_copy" style="display: none;"/>
<!--Model: <input type="button" class="letter" value="" />-->
</div>
<script src="./js/accentedletters.js"></script>
</body>

</html>
76 changes: 58 additions & 18 deletions css/accentedletters.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,11 @@
src: url("../font/zillaslab.otf");
}

@font-face {
font-family: zilla slab bold;
src: url("../font/zillaslabbold.ttf");
}

body {
background-color: transparent;
color: black;
Expand All @@ -23,19 +28,40 @@ body {
height: 100%;
margin: 0px;
background-color: transparent;
border: 1px solid transparent;
border: 0px solid transparent;
position: relative;
overflow: hidden;
}

#popup-content-background {
width: 100%;
height: 100%;
margin: 0px;
background-color: transparent;
border: 0px solid transparent;
position: relative;
overflow: hidden;
background-image: url("../img/icon-dark.svg");
background-position: 250px 250px;
background-repeat: no-repeat;
background-size: 200px auto;
padding: 0px;
box-sizing: border-box;
opacity: 0.06;
}

#titles {
position: absolute;
width: auto;
height: 36px;
top: 0px;
left: 0px;
right: 0px;
overflow: hidden;
height: 32px;
top: 4px;
left: 4px;
right: 4px;
overflow: visible;
box-sizing: border-box;
background-color: #F5F5F5;
padding: 0px;
border-radius: 3px;
}

#letters {
Expand All @@ -48,29 +74,38 @@ body {
padding-left: 4px;
padding-right: 4px;
overflow: hidden;
background: transparent;
}

.section_title {
background-color: transparent;
width: 50%;
height: 100%;
padding: 3px;
color: rgb(10, 132, 255);
border: 0px;
border-radius: 0px;
border: 0px solid transparent;
border-radius: 3px;
font-size: 14px;
border-top: 3px solid rgb(10, 132, 255);
border-bottom: 1px solid rgb(201, 202, 203);
font-family: zilla slab;
margin: 0px;
cursor: pointer;
position: relative;
font-weight: bold;
transition: 0.1s;
font-weight: normal;
transition: 0.2s;
box-sizing: border-box;
cursor: pointer;
outline: inherit;
color: #222222;
z-index: 8;
}

.selection_title_sel {
color: rgb(10, 132, 255);
background-color: #DFDFDF;
font-family: zilla slab bold;
}

.letter {
background-color: rgb(255, 255, 255);
background-color: transparent;
padding: 5px;
width: 40px;
height: 40px;
Expand All @@ -82,21 +117,26 @@ body {
margin: 3px;
cursor: pointer;
position: relative;
transition: 0.1s;
transition: 0.2s;
cursor: pointer;
outline: inherit;
}

.section_title:hover,
.letter:hover {
background-color: rgb(221, 222, 223);
background-color: #E5E5E5;
}

.letter:active,
.letter:focus {
box-shadow: 0px 0px 0px 2px #0a84ff, 0px 0px 0px 5px #b1d6fc;
background-color: #E5E5E5;
}

.section_title:active {
background-color: rgb(201, 202, 203);
.section_title:active, .section_title:focus {
background-color: #E2E2E2;
box-shadow: 0px 0px 0px 3px #0a84ff;
z-index: 9;
}

b.character-copied {
Expand Down
Binary file added font/zillaslabbold.ttf
View file
Binary file not shown.
Binary file removed img/donatePayPal.png
View file
Binary file not shown.
0 img/badge.png → img/firefoxAddons.png
View file
File renamed without changes
Binary file modified img/icon-dark-16.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified img/icon-dark-24.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified img/icon-dark-48.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified img/icon-dark-96.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit c700736

Please sign in to comment.