diff options
| author | real-zephex <[email protected]> | 2024-04-10 01:19:20 +0530 |
|---|---|---|
| committer | real-zephex <[email protected]> | 2024-04-10 01:19:20 +0530 |
| commit | e5935c15af0375240fa7c711dc99101fa48048be (patch) | |
| tree | e1807c8552c25b0f2f10d55dce59725606bb4b66 /src/app/anime/search/search.module.css | |
| parent | prolly the last update to dramalama. (diff) | |
| download | dramalama-e5935c15af0375240fa7c711dc99101fa48048be.tar.xz dramalama-e5935c15af0375240fa7c711dc99101fa48048be.zip | |
UI changes
Diffstat (limited to 'src/app/anime/search/search.module.css')
| -rw-r--r-- | src/app/anime/search/search.module.css | 93 |
1 files changed, 93 insertions, 0 deletions
diff --git a/src/app/anime/search/search.module.css b/src/app/anime/search/search.module.css new file mode 100644 index 0000000..28fae6e --- /dev/null +++ b/src/app/anime/search/search.module.css @@ -0,0 +1,93 @@ +.waitWhileLoading { + font-size: 18px; + font-family: "Kanit"; + text-align: center; + color: white; +} + +.searchContainer input { + border: none; + border-radius: 5px; + color: white; + outline: none; + background: none; + width: 100%; + font-family: "Lato"; + font-size: 16px; +} + +.searchContainer { + display: flex; + align-items: center; + margin: 20px 0px 20px 0px; + background-color: #2c2c2c; + padding: 8px; + border-radius: 5px; + width: 30%; +} + +.searchIcon { + color: white; + margin-right: 5px; +} + +.animeEntry { + display: flex; + overflow-x: auto; +} + +.animeEntry:hover .anime { + opacity: 0.5; +} + +.animeEntry:hover .anime:hover { + opacity: 1; +} + +.animeEntry::-webkit-scrollbar { + height: 5px; +} + +.animeEntry::-webkit-scrollbar-track { + background-color: #636363; + border-radius: 5px; +} + +.animeEntry::-webkit-scrollbar-thumb { + background-color: rgba(196, 196, 196, 0.692); + border-radius: 5px; + +} + +.anime { + display: flex; + justify-content: space-between; + align-items: center; + padding: 10px; + border-style: dotted; + border-color: #636363; + margin: 10px 10px 0px 0px; + border-radius: 10px; + border-width: 4px; + transition: opacity 400ms ease-in; + background-color: #353535a6; + +} + +.anime p { + color: white; + width: 20dvw; + font-family: "Atkinson"; + font-size: 18px; +} + +.animeImage { + border-radius: 10px; + margin-left: 20px; +} + +@media screen and (max-width: 768px) { + .searchContainer { + width: 70%; + } +}
\ No newline at end of file |