forked from Github-Mirrors/canaille
Merge branch 'ux' into 'main'
Dark theme improvement See merge request yaal/canaille!121
This commit is contained in:
commit
3b1497c972
3 changed files with 47 additions and 11 deletions
|
@ -66,6 +66,14 @@ footer a {
|
||||||
margin-top:1em;
|
margin-top:1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.pagination {
|
||||||
|
border-radius: .28571429rem;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.disabled.ui.button {
|
||||||
|
color: rgba(0,0,0,1);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/* Fix button appearance for semantic-ui on webkit */
|
/* Fix button appearance for semantic-ui on webkit */
|
||||||
[type=button] {
|
[type=button] {
|
||||||
|
@ -92,15 +100,37 @@ i.massive.massive.massive.portrait.icon, i.massive.massive.massive.portrait.icon
|
||||||
background: rgba(0,0,0,.05) !important;
|
background: rgba(0,0,0,.05) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ui .menu a, .ui a:hover, .ui a i {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui a {
|
||||||
|
text-decoration: underline;
|
||||||
|
color: rgba(0,0,0,.70);
|
||||||
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
|
.logo img {
|
||||||
|
filter: invert(.8) !important;
|
||||||
|
}
|
||||||
body, .ui.card .bottom, .ui.toggle.checkbox label:hover::before {
|
body, .ui.card .bottom, .ui.toggle.checkbox label:hover::before {
|
||||||
background-color: #222222;
|
background-color: #222222;
|
||||||
}
|
}
|
||||||
.ui.segment, .ui.menu, .ui.table {
|
.ui.segment, .ui.menu, .ui.table {
|
||||||
background-color: #353535 !important;
|
background-color: #353535 !important;
|
||||||
}
|
}
|
||||||
body, .ui.info.message .header, .ui.input, .ui.toggle.checkbox label, .ui.header, .ui.form .field > label, .ui.list .list > .item > .content, .ui.list > .item > .content, .ui.card, .ui.cards > .card, .ui.card .bottom.button:hover, .ui.card .bottom.button:focus {
|
.ui a:visited, .ui a:visited .icon {
|
||||||
|
color: rgba(255,255,255,.87) !important;
|
||||||
|
}
|
||||||
|
.ui a, .ui a .icon {
|
||||||
|
color: rgba(255,255,255,.87) !important;
|
||||||
|
}
|
||||||
|
#ellipsis-next .disabled.ui.button {
|
||||||
|
background-color: #c0c1c2;
|
||||||
|
opacity: 1 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
body, .ui.menu .active.item, .ui.form:not(.inverted) .field > label:not(.button), .ui.info.message .header, .ui.input, .ui.toggle.checkbox label, .ui.header, .ui.form .field > label, .ui.list .list > .item > .content, .ui.list > .item > .content, .ui.card, .ui.cards > .card, .ui.card .bottom.button:hover, .ui.card .bottom.button:focus {
|
||||||
color: rgba(255,255,255,.87);
|
color: rgba(255,255,255,.87);
|
||||||
}
|
}
|
||||||
.ui.card .bottom, .ui.link.menu .item, .ui.menu .dropdown.item, .ui.menu .link.item, .ui.menu a.item, .ui.icon.menu .item, .ui.header .sub.header, .ui.label, table tbody tr td, .ui.card .bottom.button:hover, .ui.card .bottom.button:focus {
|
.ui.card .bottom, .ui.link.menu .item, .ui.menu .dropdown.item, .ui.menu .link.item, .ui.menu a.item, .ui.icon.menu .item, .ui.header .sub.header, .ui.label, table tbody tr td, .ui.card .bottom.button:hover, .ui.card .bottom.button:focus {
|
||||||
|
@ -110,6 +140,12 @@ i.massive.massive.massive.portrait.icon, i.massive.massive.massive.portrait.icon
|
||||||
background: #222222 !important;
|
background: #222222 !important;
|
||||||
color: rgba(255,255,255,.87) !important;
|
color: rgba(255,255,255,.87) !important;
|
||||||
}
|
}
|
||||||
|
.ui.menu .active.item {
|
||||||
|
background: rgba(0,0,0,.20);
|
||||||
|
}
|
||||||
|
.ui.menu .active.item:hover {
|
||||||
|
background: rgba(0,0,0,.30);
|
||||||
|
}
|
||||||
table tbody tr td .ui.label:hover {
|
table tbody tr td .ui.label:hover {
|
||||||
color: #353535 !important;
|
color: #353535 !important;
|
||||||
}
|
}
|
||||||
|
@ -150,7 +186,7 @@ i.massive.massive.massive.portrait.icon, i.massive.massive.massive.portrait.icon
|
||||||
.ui.card .meta {
|
.ui.card .meta {
|
||||||
color: rgba(255,255,255,.7) !important;
|
color: rgba(255,255,255,.7) !important;
|
||||||
}
|
}
|
||||||
.ui.attached.header, .ui.attached.segment {
|
.ui.attached.header, .ui.attached.segment, .ui.attached.menu:not(.tabular):not(.text), .ui.attached.segment:not(.basic), .ui.attached.table {
|
||||||
border: 1px solid #222222;
|
border: 1px solid #222222;
|
||||||
}
|
}
|
||||||
.ui.info.message {
|
.ui.info.message {
|
||||||
|
|
|
@ -60,7 +60,7 @@
|
||||||
{% endmacro %}
|
{% endmacro %}
|
||||||
|
|
||||||
{% macro pagination(form) %}
|
{% macro pagination(form) %}
|
||||||
<div class="ui right floated buttons">
|
<div class="ui right floated buttons pagination">
|
||||||
<span class="icon disabled ui button" style="border-radius: 0">
|
<span class="icon disabled ui button" style="border-radius: 0">
|
||||||
{% trans %}Page{% endtrans %}
|
{% trans %}Page{% endtrans %}
|
||||||
</span>
|
</span>
|
||||||
|
|
|
@ -65,8 +65,8 @@
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<div class="right floated content">
|
<div class="right floated content">
|
||||||
<div class="ui buttons">
|
<div class="ui buttons">
|
||||||
<a class="ui button" href="{{ url_for("admin.test_txt") }}">TXT</a>
|
<a class="ui button primary" href="{{ url_for("admin.test_txt") }}">TXT</a>
|
||||||
<a class="ui button" href="{{ url_for("admin.test_html") }}">HTML</a>
|
<a class="ui button primary" href="{{ url_for("admin.test_html") }}">HTML</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="middle aligned content">
|
<div class="middle aligned content">
|
||||||
|
@ -77,8 +77,8 @@
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<div class="right floated content">
|
<div class="right floated content">
|
||||||
<div class="ui buttons">
|
<div class="ui buttons">
|
||||||
<a class="ui button" href="{{ url_for("admin.password_init_txt") }}">TXT</a>
|
<a class="ui button primary" href="{{ url_for("admin.password_init_txt") }}">TXT</a>
|
||||||
<a class="ui button" href="{{ url_for("admin.password_init_html") }}">HTML</a>
|
<a class="ui button primary" href="{{ url_for("admin.password_init_html") }}">HTML</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="middle aligned content">
|
<div class="middle aligned content">
|
||||||
|
@ -89,8 +89,8 @@
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<div class="right floated content">
|
<div class="right floated content">
|
||||||
<div class="ui buttons">
|
<div class="ui buttons">
|
||||||
<a class="ui button" href="{{ url_for("admin.password_reset_txt") }}">TXT</a>
|
<a class="ui button primary" href="{{ url_for("admin.password_reset_txt") }}">TXT</a>
|
||||||
<a class="ui button" href="{{ url_for("admin.password_reset_html") }}">HTML</a>
|
<a class="ui button primary" href="{{ url_for("admin.password_reset_html") }}">HTML</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="middle aligned content">
|
<div class="middle aligned content">
|
||||||
|
@ -101,8 +101,8 @@
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<div class="right floated content">
|
<div class="right floated content">
|
||||||
<div class="ui buttons">
|
<div class="ui buttons">
|
||||||
<a class="ui button" href="{{ url_for("admin.invitation_txt", uid=user.uid, email=user.mail[0]) }}">TXT</a>
|
<a class="ui button primary" href="{{ url_for("admin.invitation_txt", uid=user.uid, email=user.mail[0]) }}">TXT</a>
|
||||||
<a class="ui button" href="{{ url_for("admin.invitation_html", uid=user.uid, email=user.mail[0]) }}">HTML</a>
|
<a class="ui button primary" href="{{ url_for("admin.invitation_html", uid=user.uid, email=user.mail[0]) }}">HTML</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="middle aligned content">
|
<div class="middle aligned content">
|
||||||
|
|
Loading…
Reference in a new issue