IntenseWebs/WordPress
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Twenty Fourteen: Apply max-width values to avoid site title breaking the layout in small screens. Props sixhours, rclations. See #28237.

Browse Source 
Built from https://develop.svn.wordpress.org/trunk@28691


git-svn-id: http://core.svn.wordpress.org/trunk@28509 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Lance Willett 2014-06-06 17:31:15 +00:00
parent f83806b4ba
commit 581c043c22
1 changed files with 29 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
wp-content/themes/twentyfourteen/style.css
View File

@ -863,8 +863,12 @@ span + .edit-link:before,
font-weight: 700; font-weight: 700;
line-height: 48px; line-height: 48px;
margin: 0; margin: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
.site-title,
.site-title a, .site-title a,
.site-title a:hover { .site-title a:hover {
color: #fff; color: #fff;
@ -3005,6 +3009,10 @@ a.post-thumbnail:hover {
} }
@media screen and (max-width: 400px) { @media screen and (max-width: 400px) {
.site-title {
max-width: 71%;
}
.list-view .site-content .post-thumbnail { .list-view .site-content .post-thumbnail {
background: none; background: none;
width: auto; width: auto;
@ -3079,6 +3087,10 @@ a.post-thumbnail:hover {
} }
@media screen and (min-width: 401px) { @media screen and (min-width: 401px) {
.site-title {
max-width: 77%;
}
a.post-thumbnail:hover img { a.post-thumbnail:hover img {
opacity: 0.85; opacity: 0.85;
} }
@ -3207,6 +3219,10 @@ a.post-thumbnail:hover {
} }
@media screen and (min-width: 594px) { @media screen and (min-width: 594px) {
.site-title {
max-width: 85%;
}
.site-content .entry-header { .site-content .entry-header {
padding-right: 30px; padding-right: 30px;
padding-left: 30px; padding-left: 30px;
@ -3222,6 +3238,10 @@ a.post-thumbnail:hover {
padding: 0 30px; padding: 0 30px;
} }
.site-title {
max-width: 89%;
}
.search-toggle { .search-toggle {
margin-right: 18px; margin-right: 18px;
} }
@ -3357,6 +3377,10 @@ a.post-thumbnail:hover {
padding-right: 0; padding-right: 0;
} }
.site-title {
max-width: 93%;
}
.search-toggle { .search-toggle {
margin-right: 0; margin-right: 0;
} }
@ -3604,6 +3628,10 @@ a.post-thumbnail:hover {
} }
@media screen and (min-width: 1008px) { @media screen and (min-width: 1008px) {
.site-title {
max-width: 95%;
}
.search-box-wrapper { .search-box-wrapper {
padding-left: 182px; padding-left: 182px;
} }
@ -4125,6 +4153,7 @@ a.post-thumbnail:hover {
display: none; display: none;
} }
.site-title,
.site-title a, .site-title a,
.entry-meta, .entry-meta,
.entry-meta a, .entry-meta a,