mirror of
https://github.com/Dvorinka/swingmusic-extended.git
synced 2026-06-05 04:53:01 +00:00
Redesign page search input area
+ redefine global search input colors + redesign settings page + move settings text to a strings module + add title and description to now playing settings
This commit is contained in:
committed by
Mungai Njoroge
parent
460695fd87
commit
62b9aa7a3e
@@ -9,18 +9,24 @@
|
||||
|
||||
gap: 0 1.5rem;
|
||||
height: 100%;
|
||||
border: solid 1px $gray3;
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
margin: 0 auto;
|
||||
max-width: 1720px;
|
||||
}
|
||||
|
||||
#acontent {
|
||||
grid-area: content;
|
||||
margin-right: calc(0rem - ($medium + 2px));
|
||||
padding-right: calc($medium);
|
||||
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.r-sidebar {
|
||||
grid-area: r-sidebar;
|
||||
border-left: solid 1px $gray3;
|
||||
}
|
||||
|
||||
.topnav {
|
||||
@@ -33,8 +39,9 @@
|
||||
grid-area: l-sidebar;
|
||||
display: grid;
|
||||
grid-template-rows: 1fr max-content;
|
||||
border-top: none !important;
|
||||
border-bottom: none !important;
|
||||
// border-top: none !important;
|
||||
// border-bottom: none !important;
|
||||
border-right: solid 1px $gray3;
|
||||
}
|
||||
|
||||
.b-bar {
|
||||
@@ -44,9 +51,10 @@
|
||||
// ====== MODIFIERS =======
|
||||
|
||||
#app-grid.extendWidth {
|
||||
padding-right: 0;
|
||||
border-right: none;
|
||||
max-width: 100%;
|
||||
padding-right: 0;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
#app-grid.noSidebar {
|
||||
@@ -58,7 +66,7 @@
|
||||
|
||||
#acontent {
|
||||
margin-right: 0 !important;
|
||||
padding-right: 1rem !important;
|
||||
padding-right: $medium !important;
|
||||
}
|
||||
|
||||
.topnav {
|
||||
|
||||
@@ -33,7 +33,7 @@
|
||||
}
|
||||
|
||||
.circular {
|
||||
border-radius: 50%;
|
||||
border-radius: 10rem;
|
||||
}
|
||||
|
||||
.flex {
|
||||
@@ -82,12 +82,13 @@ button {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-image: linear-gradient(70deg, $darkestblue, $darkblue);
|
||||
background-image: linear-gradient($darkestblue, $darkblue);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.btn-active {
|
||||
background-image: linear-gradient(70deg, $darkestblue, $darkblue);
|
||||
background-image: linear-gradient($darkestblue, $darkblue);
|
||||
}
|
||||
|
||||
.btn-more {
|
||||
|
||||
@@ -36,8 +36,7 @@ body {
|
||||
#app {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
max-width: 1720px;
|
||||
|
||||
}
|
||||
|
||||
a {
|
||||
|
||||
@@ -25,7 +25,7 @@ $gray2: rgb(99, 99, 102);
|
||||
$gray3: rgb(72, 72, 74);
|
||||
$gray4: rgb(58, 58, 60);
|
||||
$gray5: rgb(44, 44, 46);
|
||||
$body: $gray;
|
||||
$body: rgba(0, 0, 0, 0.95);
|
||||
|
||||
$red: #ff453a;
|
||||
$blue: #0a84ff;
|
||||
|
||||
+16
-16
@@ -14,23 +14,23 @@
|
||||
}
|
||||
}
|
||||
|
||||
#app-grid.isSmall,
|
||||
#app-grid.disableSidebar {
|
||||
#acontent {
|
||||
margin-right: -$small;
|
||||
padding-right: $medium;
|
||||
// #app-grid.isSmall,
|
||||
// #app-grid.disableSidebar {
|
||||
// #acontent {
|
||||
// margin-right: -$small;
|
||||
// padding-right: $medium;
|
||||
|
||||
.search-view {
|
||||
margin-right: -0.8rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
// .search-view {
|
||||
// margin-right: -0.8rem;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
#app-grid.isSmall #page-search {
|
||||
margin-right: $smaller;
|
||||
}
|
||||
// #app-grid.isSmall #page-search {
|
||||
// margin-right: $smaller;
|
||||
// }
|
||||
|
||||
#app-grid.disableSidebar #page-search {
|
||||
margin-right: $smaller;
|
||||
}
|
||||
// #app-grid.disableSidebar #page-search {
|
||||
// margin-right: $smaller;
|
||||
// }
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user