Files
jellyplist/static/css/styles.css

103 lines
1.7 KiB
CSS

body {
/* background-color: #141A32; */
}
.sidebar {
background-color: #1a1d21;
height: 100vh;
padding-top: 20px;
padding-left: 10px;
color: white;
}
.top-bar {
background-color: #1a1d21;
}
.sidebar h3 {
color: white;
padding-left: 15px;
}
.nav-link {
color: #c2c7d0;
display: flex;
align-items: center;
padding: 10px 15px;
}
.nav-link:hover {
background-color: #343a40;
border-radius: 5px;
}
.nav-link.active {
background-color: #6f42c1;
border-radius: 5px;
color: white;
}
.nav-link i {
margin-right: 10px;
}
.sidebar-logo {
display: flex;
align-items: center;
justify-content: center;
}
.sidebar-logo img {
width: 140px;
margin-right: 10px;
}
.logo img{
width: 100%;
}
@media screen and (min-width: 1600px) {
.modal-dialog {
max-width: 90%; /* New width for default modal */
}
}
.searchbar{
margin-bottom: auto;
margin-top: auto;
height: 60px;
background-color: #353b48;
border-radius: 30px;
padding: 10px;
}
.search_input{
color: white;
border: 0;
outline: 0;
background: none;
width: 450px;
caret-color:transparent;
line-height: 40px;
transition: width 0.4s linear;
}
.searchbar:hover > .search_input{
/* padding: 0 10px; */
width: 450px;
caret-color:red;
/* transition: width 0.4s linear; */
}
.searchbar:hover > .search_icon{
background: white;
color: #e74c3c;
}
.search_icon{
height: 40px;
width: 40px;
float: right;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
color:white;
text-decoration:none;
}