feat(popup): improve colors, refactor css, support rtl lang
This commit is contained in:
parent
cd0b5805eb
commit
6c622b4ef0
|
@ -28,6 +28,10 @@ All notable changes to this project will be documented in this file.
|
|||
|
||||
- Improve codestyle
|
||||
|
||||
### ⚙️ Miscellaneous Tasks
|
||||
|
||||
- Update @commitlint/{cli,config-conventional}
|
||||
|
||||
## \[[0.9.2](https://gitea.usrspace.at/XimeX/usrspace-browser-addon/releases/tag/v0.9.2)] - 2023-05-24
|
||||
|
||||
### ⛰️ Features
|
||||
|
|
|
@ -4,12 +4,14 @@
|
|||
font-weight: normal;
|
||||
src: url('font/Nunito-Regular.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Nunito Sans';
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
src: url('font/Nunito-Bold.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Nunito Sans';
|
||||
font-style: italic;
|
||||
|
@ -20,45 +22,57 @@
|
|||
:root {
|
||||
--light-blue: #2aa1bf;
|
||||
--dark-blue: #095c81;
|
||||
--light-color: #0c0c0c;
|
||||
--dark-color: #ffffff;
|
||||
--light-background: #f9f9f9;
|
||||
--dark-background: #4a4a4a;
|
||||
--light-code-background: #ebebeb;
|
||||
--dark-code-background: #383838;
|
||||
|
||||
--light-color: #15141a;
|
||||
--dark-color: #fbfbfe;
|
||||
--light-background: #ffffff;
|
||||
--dark-background: #42414d;
|
||||
--light-code-background: #f0f0f4;
|
||||
--dark-code-background: #2b2a33;
|
||||
|
||||
--color: var(--light-color);
|
||||
--background: var(--light-background);
|
||||
--code-background: var(--light-code-background);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--color: var(--dark-color);
|
||||
--background: var(--dark-background);
|
||||
--code-background: var(--dark-code-background);
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
width: 360px;
|
||||
inline-size: 360px;
|
||||
padding: 6px 12px;
|
||||
color: var(--light-color);
|
||||
background-color: var(--light-background);
|
||||
color: var(--color);
|
||||
background-color: var(--background);
|
||||
font-family: 'Nunito Sans';
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
color: var(--dark-color);
|
||||
background-color: var(--dark-background);
|
||||
}
|
||||
}
|
||||
|
||||
section.no-padding {
|
||||
margin: 0 -12px -6px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 6px 0 4px;
|
||||
}
|
||||
|
||||
summary {
|
||||
margin: 6px 12px 6px;
|
||||
margin: 6px 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
summary > h2 {
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
time {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
svg {
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
@ -66,11 +80,13 @@ svg {
|
|||
.panel-section-list {
|
||||
margin: 0 -12px;
|
||||
}
|
||||
|
||||
.panel-list-item > .icon {
|
||||
text-align: center;
|
||||
width: 23px;
|
||||
margin-right: 4px;
|
||||
inline-size: 23px;
|
||||
margin-inline-end: 4px;
|
||||
}
|
||||
|
||||
.link {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
@ -78,29 +94,28 @@ svg {
|
|||
#state > svg,
|
||||
#calendar > .calendar-entry > svg,
|
||||
#calendar > .calendar-entry strong {
|
||||
margin-right: 8px;
|
||||
margin-inline-end: 8px;
|
||||
}
|
||||
#calendar > .calendar-entry {
|
||||
|
||||
#calendar > .calendar-entry,
|
||||
#calendar > .calendar-entry > div > div {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#calendar address {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
#space-api {
|
||||
margin: 0;
|
||||
padding: 0 8px;
|
||||
height: 122px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: scroll;
|
||||
background-color: var(--light-code-background);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
#space-api {
|
||||
background-color: var(--dark-code-background);
|
||||
}
|
||||
padding: 4px 8px 8px;
|
||||
block-size: 159px;
|
||||
overflow-block: scroll;
|
||||
background-color: var(--code-background);
|
||||
}
|
||||
|
||||
#space-api code {
|
||||
font-family: monospace;
|
||||
font-size: 10px;
|
||||
white-space: break-spaces;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue