diff --git a/client/src/app/search/search.component.scss b/client/src/app/search/search.component.scss index 67b2094b0..3e074621b 100644 --- a/client/src/app/search/search.component.scss +++ b/client/src/app/search/search.component.scss @@ -132,39 +132,61 @@ } } -@media screen and (max-width: 800px) { +@media screen and (max-width: $small-view) { + .video-channel-names { + flex-direction: column !important; + + .video-channel-name { + margin-left: 0 !important; + } + } +} + +@media screen and (max-width: $mobile-view) { .search-result { padding: 20px 10px; - } - .results-header { - font-size: 15px !important; - } + .results-header { + font-size: 15px !important; + } - .entry { - flex-direction: column; - height: auto; - text-align: center; + .entry { + flex-direction: column; + height: auto; + justify-content: center; + align-items: center; + text-align: center; - &.video { - .video-info-name, - .video-info-account { - margin: auto; - } + &.video { + .video-info-name, + .video-info-account { + margin: auto; + } - my-video-thumbnail { - margin-right: 0 !important; + my-video-thumbnail { + margin-right: 0 !important; - /deep/ .video-thumbnail { - width: 100%; - height: auto; - - img { + /deep/ .video-thumbnail { width: 100%; height: auto; + + img { + width: 100%; + height: auto; + } } } } + + &.video-channel { + .video-channel-info .video-channel-names { + align-items: center; + } + + my-subscribe-button { + margin-top: 5px; + } + } } } }