styled search tab and created tabs folder in css directory
This commit is contained in:
@@ -1,9 +1,9 @@
|
||||
@import './normalize.css';
|
||||
@import './typography.css';
|
||||
|
||||
* {
|
||||
/* * {
|
||||
transition: background-color 500ms ease-in-out;
|
||||
}
|
||||
} */
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
|
||||
@@ -138,11 +138,6 @@ p,
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.secondary-text .material-icons {
|
||||
font-size: 17px !important;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
button {
|
||||
font-family: inherit;
|
||||
font-weight: 600;
|
||||
|
||||
@@ -1,18 +0,0 @@
|
||||
.search_tabcontent,
|
||||
.main_tabcontent,
|
||||
.favorites_tabcontent {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.main_tabcontent h1 {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.tab button {
|
||||
background-color: var(--primary-background);
|
||||
color: var(--main-text);
|
||||
}
|
||||
|
||||
.tab button.active {
|
||||
background-color: var(--accent-color);
|
||||
}
|
||||
@@ -1,6 +1,19 @@
|
||||
#main_search > .search_section {
|
||||
#main_search .search_section {
|
||||
float: none;
|
||||
cursor: pointer;
|
||||
border-top: 1px solid var(--separator);
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
/* Top Result */
|
||||
.top_result_header {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.search_header {
|
||||
font-size: 1.75rem;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.top_result {
|
||||
@@ -25,11 +38,17 @@
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.secondary-text {
|
||||
/* Releases */
|
||||
.release .secondary-text {
|
||||
opacity: 0.75;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.release .secondary-text .material-icons {
|
||||
font-size: 17px !important;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.release_grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(156px, 1fr));
|
||||
@@ -43,17 +62,6 @@
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.release {
|
||||
display: inline-block;
|
||||
width: 156px;
|
||||
}
|
||||
|
||||
.release .cover_container {
|
||||
width: 156px;
|
||||
height: 156px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.track_row > td > img {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
35
public/css/modules/tabs/tabs.css
Normal file
35
public/css/modules/tabs/tabs.css
Normal file
@@ -0,0 +1,35 @@
|
||||
@import './download-tab.css';
|
||||
@import './home-tab.css';
|
||||
@import './search-tab.css';
|
||||
@import './settings-tab.css';
|
||||
@import './tracklist-tab.css';
|
||||
|
||||
.search_tabcontent,
|
||||
.main_tabcontent,
|
||||
.favorites_tabcontent {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.main_tabcontent h1 {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.tab button {
|
||||
background-color: var(--primary-background);
|
||||
color: var(--main-text);
|
||||
}
|
||||
|
||||
.tab button.active {
|
||||
background-color: var(--accent-color);
|
||||
}
|
||||
|
||||
.release {
|
||||
display: inline-block;
|
||||
width: 156px;
|
||||
}
|
||||
|
||||
.release .cover_container {
|
||||
width: 156px;
|
||||
height: 156px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
Reference in New Issue
Block a user