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 @media only screen
and (max-device-width : 414px) { and (max-width : 414px) {
border: 0; border: 0;
background: transparent; 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; position: fixed;
height: calc(100vh - #{$headerHeight + $footerHeight}); height: calc(100vh - #{$headerHeight + $footerHeight});
padding-bottom: $footerHeight; // make sure the footer can never overlap the content 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%; width: 100%;
} }
} }

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

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

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

@ -114,7 +114,7 @@
position: relative; position: relative;
padding-left: 84px; padding-left: 84px;
@media only screen and (max-device-width : 768px) { @media only screen and (max-width : 768px) {
padding-left: 0; padding-left: 0;
} }
} }
@ -124,7 +124,7 @@
left: 0; left: 0;
top: -7px; top: -7px;
@media only screen and (max-device-width : 768px) { @media only screen and (max-width : 768px) {
display: none; 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 { .top-sections {
display: block; display: block;

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

@ -154,7 +154,7 @@
@media only screen @media only screen
and (max-device-width : 768px) { and (max-width : 768px) {
h1.heading { h1.heading {
font-size: 18px; font-size: 18px;
min-height: 0; 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 { input {
&[type="text"], &[type="email"], &[type="password"] { &[type="text"], &[type="email"], &[type="password"] {
width: 100%; 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> </style>

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

@ -68,7 +68,7 @@
margin-top: 12px; margin-top: 12px;
} }
@media only screen and (max-device-width : 667px) { @media only screen and (max-width : 667px) {
input[type="text"] { input[type="text"] {
width: 100%; 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 { form.user-create, form.user-edit {
flex-direction: column; flex-direction: column;
align-items: stretch; align-items: stretch;
@ -363,8 +363,8 @@
} }
@media only screen @media only screen
and (min-device-width : 668px) and (min-width : 668px)
and (max-device-width : 768px) { and (max-width : 768px) {
.users { .users {
flex-direction: column; 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; position: fixed;
height: calc(100vh - #{$headerHeight + $footerHeight}); height: calc(100vh - #{$headerHeight + $footerHeight});
padding-bottom: $footerHeight; // make sure the footer can never overlap the content 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 { table, tbody, tr {
display: block; 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; position: fixed;
max-width: 414px; max-width: 414px;
left: auto; 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; position: absolute !important;
right: 0; right: 0;
height: $footerHeight; height: $footerHeight;
@ -423,7 +423,7 @@
} }
@media only screen and (max-device-width: 768px) { @media only screen and (max-width: 768px) {
flex: 1; flex: 1;
&::before { &::before {
@ -446,7 +446,7 @@
@include hasSoftGradientOnTop($colorMainBgr); @include hasSoftGradientOnTop($colorMainBgr);
@media only screen and (max-device-width: 768px) { @media only screen and (max-width: 768px) {
width: 100%; width: 100%;
position: absolute; position: absolute;
top: 0; top: 0;
@ -509,7 +509,7 @@
} }
@media only screen and (max-device-width: 768px) { @media only screen and (max-width: 768px) {
.meta, .title { .meta, .title {
display: none; display: none;
} }
@ -531,7 +531,7 @@
width: 16px; width: 16px;
} }
@media only screen and (max-device-width: 768px) { @media only screen and (max-width: 768px) {
display: none !important; display: none !important;
} }
} }

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

@ -74,7 +74,7 @@
display: none; display: none;
} }
@media only screen and (max-device-width: 667px) { @media only screen and (max-width: 667px) {
display: flex; display: flex;
align-content: stretch; align-content: stretch;
justify-content: flext-start; 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; z-index: -1;
position: absolute; position: absolute;
left: 0; left: 0;

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

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