yetangitu/Peertube
1
0
Fork 0
mirror of https://github.com/Chocobozzz/PeerTube.git synced 2025-10-05 10:49:28 +02:00
Code Issues Releases Wiki Activity

Global client redesign

Browse source 
* Split "my library" into "video space (channels, videos...)" and "my library (playlists, history...)"
 * Split "admin" into "overview (users, videos...)", "moderation (abuses, blocks, registrations...)" and "settings (configuration, runners...)"
 * Reorganize the header and the left menu: account settings/notifications are now in the header
 * Add instance information context in the left menu
 * Merge dedicated videos pages for "recently added", "trending", "local videos" into a "browse videos" page that includes quick filters
 * Clean up entire CSS
 * Clean CSS variables so it's easier to theme PeerTube (some new variables fallback to old variables to limit currnet themes breakages)
 * Replace the current light theme into a new one (beige)
 * Add a dark (brown) theme (included in PeerTube core)
 * Fix accessibility issues with old light theme colors (white on orange button for example)
 * Redesign the left menu, the horizontal menu, form controls and buttons, "Discover videos" page and common video filters panel
 * Replace/remove/add some global icon
This commit is contained in:
Chocobozzz 2024-11-05 10:03:40 +01:00
parent 064a44ec4d
commit f83674c143
No known key found for this signature in database
GPG key ID: 583A612D890159BE
525 changed files with 6861 additions and 6725 deletions
Download patch file Download diff file Expand all files Collapse all files

40
client/src/app/shared/shared-main/menu/list-overflow.component.scss
View file

@ -5,22 +5,35 @@
width: 100%;
}
.list-overflow-parent {
li {
// Fix child outline on focus-visible
padding-top: 2px;
}
.root {
overflow: hidden;
display: flex;
// For the menu icon
max-width: calc(100vw - 30px);
padding-bottom: 3px;
}
.list-overflow-parent {
display: flex;
align-items: center;
// For the menu icon
position: relative;
&.has-border {
border-bottom: 1px solid pvar(--fg-200);
}
}
.list-overflow-menu {
position: absolute;
right: 25px;
right: 0;
}
button {
width: 30px;
border: 0;
&::after {
display: none;
}
@ -28,7 +41,7 @@ button {
&.route-active {
&::after {
display: inherit;
border: 2px solid pvar(--mainColor);
border: 2px solid pvar(--primary);
position: relative;
right: 95%;
top: 50%;
@ -36,13 +49,6 @@ button {
}
}
::ng-deep .dropdown-menu {
margin-top: 0 !important;
position: static;
right: auto;
bottom: auto;
}
.modal-body {
a {
color: currentColor;
@ -57,8 +63,8 @@ button {
@include disable-default-a-behaviour;
&.active {
color: pvar(--mainBackgroundColor) !important;
background-color: pvar(--mainHoverColor);
color: pvar(--on-primary) !important;
background-color: pvar(--primary-450);
opacity: .9;
}
}