Mirrors/koel
2
0
Fork 0
mirror of https://github.com/koel/koel synced 2024-11-10 06:34:14 +00:00
Code Issues Projects Releases Packages Wiki Activity

Set media queries to viewport, not device

Browse source
This commit is contained in:
An Phan 2016-03-17 17:46:24 +08:00
parent 86ea370cf4
commit 3500ee7b33
17 changed files with 26 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
resources/assets/js/components/auth/login-form.vue
View file

@ -87,7 +87,7 @@
}
@media only screen
and (max-device-width : 414px) {
and (max-width : 414px) {
border: 0;
background: transparent;
}

4
resources/assets/js/components/main-wrapper/extra/index.vue
View file

@ -173,7 +173,7 @@
}
@media only screen and (max-device-width : 1024px) {
@media only screen and (max-width : 1024px) {
position: fixed;
height: calc(100vh - #{$headerHeight + $footerHeight});
padding-bottom: $footerHeight; // make sure the footer can never overlap the content
@ -188,7 +188,7 @@
}
}
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
width: 100%;
}
}

4
resources/assets/js/components/main-wrapper/main-content/album.vue
View file

@ -120,7 +120,7 @@
position: relative;
padding-left: 84px;
@media only screen and (max-device-width : 768px) {
@media only screen and (max-width : 768px) {
padding-left: 0;
}
}
@ -130,7 +130,7 @@
left: 0;
top: -7px;
@media only screen and (max-device-width : 768px) {
@media only screen and (max-width : 768px) {
display: none;
}
}

4
resources/assets/js/components/main-wrapper/main-content/artist.vue
View file

@ -114,7 +114,7 @@
position: relative;
padding-left: 84px;
@media only screen and (max-device-width : 768px) {
@media only screen and (max-width : 768px) {
padding-left: 0;
}
}
@ -124,7 +124,7 @@
left: 0;
top: -7px;
@media only screen and (max-device-width : 768px) {
@media only screen and (max-width : 768px) {
display: none;
}
}

2
resources/assets/js/components/main-wrapper/main-content/home.vue
View file

@ -305,7 +305,7 @@
}
}
@media only screen and (max-device-width: 768px) {
@media only screen and (max-width: 768px) {
.top-sections {
display: block;

2
resources/assets/js/components/main-wrapper/main-content/index.vue
View file

@ -154,7 +154,7 @@
@media only screen
and (max-device-width : 768px) {
and (max-width : 768px) {
h1.heading {
font-size: 18px;
min-height: 0;

2
resources/assets/js/components/main-wrapper/main-content/profile.vue
View file

@ -250,7 +250,7 @@
}
}
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
input {
&[type="text"], &[type="email"], &[type="password"] {
width: 100%;

2
resources/assets/js/components/main-wrapper/main-content/queue.vue
View file

@ -146,7 +146,7 @@
}
}
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
}
}
</style>

2
resources/assets/js/components/main-wrapper/main-content/settings.vue
View file

@ -68,7 +68,7 @@
margin-top: 12px;
}
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
input[type="text"] {
width: 100%;
}

6
resources/assets/js/components/main-wrapper/main-content/users.vue
View file

@ -330,7 +330,7 @@
}
}
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
form.user-create, form.user-edit {
flex-direction: column;
align-items: stretch;
@ -363,8 +363,8 @@
}
@media only screen
and (min-device-width : 668px)
and (max-device-width : 768px) {
and (min-width : 668px)
and (max-width : 768px) {
.users {
flex-direction: column;

2
resources/assets/js/components/main-wrapper/sidebar/index.vue
View file

@ -261,7 +261,7 @@
}
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
position: fixed;
height: calc(100vh - #{$headerHeight + $footerHeight});
padding-bottom: $footerHeight; // make sure the footer can never overlap the content

2
resources/assets/js/components/shared/song-list.vue
View file

@ -534,7 +534,7 @@
}
@media only screen and (max-device-width: 768px) {
@media only screen and (max-width: 768px) {
table, tbody, tr {
display: block;
}

2
resources/assets/js/components/site-footer/equalizer.vue
View file

@ -369,7 +369,7 @@
}
}
@media only screen and (max-device-width : 768px) {
@media only screen and (max-width : 768px) {
position: fixed;
max-width: 414px;
left: auto;

10
resources/assets/js/components/site-footer/index.vue
View file

@ -361,7 +361,7 @@
}
@media only screen and (max-device-width: 768px) {
@media only screen and (max-width: 768px) {
position: absolute !important;
right: 0;
height: $footerHeight;
@ -423,7 +423,7 @@
}
@media only screen and (max-device-width: 768px) {
@media only screen and (max-width: 768px) {
flex: 1;
&::before {
@ -446,7 +446,7 @@
@include hasSoftGradientOnTop($colorMainBgr);
@media only screen and (max-device-width: 768px) {
@media only screen and (max-width: 768px) {
width: 100%;
position: absolute;
top: 0;
@ -509,7 +509,7 @@
}
@media only screen and (max-device-width: 768px) {
@media only screen and (max-width: 768px) {
.meta, .title {
display: none;
}
@ -531,7 +531,7 @@
width: 16px;
}
@media only screen and (max-device-width: 768px) {
@media only screen and (max-width: 768px) {
display: none !important;
}
}

2
resources/assets/js/components/site-header/index.vue
View file

@ -74,7 +74,7 @@
display: none;
}
@media only screen and (max-device-width: 667px) {
@media only screen and (max-width: 667px) {
display: flex;
align-content: stretch;
justify-content: flext-start;

2
resources/assets/js/components/site-header/search-form.vue
View file

@ -63,7 +63,7 @@
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
z-index: -1;
position: absolute;
left: 0;

2
resources/assets/js/components/site-header/user-badge.vue
View file

@ -57,7 +57,7 @@
@include vertical-center();
}
@media only screen and (max-device-width : 667px) {
@media only screen and (max-width : 667px) {
flex: 0 0 96px;
margin-right: 0;
padding-right: 0;