[ticket/12769] Fix responsive features

This commit is contained in:
Michael Miday 2015-09-15 23:41:27 +02:00
parent ea591562ae
commit 32868a6f87
6 changed files with 45 additions and 96 deletions

View file

@ -362,13 +362,13 @@ function parseDocument($container) {
/**
* Adjust HTML code for IE8 and older versions
*/
if (oldBrowser) {
// Fix .linklist.bulletin lists
$container
.find('ul.linklist.bulletin > li')
.filter(':first-child, .rightside:last-child')
.addClass('no-bulletin');
}
// if (oldBrowser) {
// // Fix .linklist.bulletin lists
// $container
// .find('ul.linklist.bulletin > li')
// .filter(':first-child, .rightside:last-child')
// .addClass('no-bulletin');
// }
/**
* Resize navigation (breadcrumbs) block to keep all links on same line
@ -489,7 +489,7 @@ function parseDocument($container) {
$linksFirst = $linksNotSkip.not(filterLast), // The items that will be hidden first
$linksLast = $linksNotSkip.filter(filterLast), // The items that will be hidden last
persistent = $this.attr('id') === 'nav-main', // Does this list already have a menu (such as quick-links)?
html = '<li class="responsive-menu hidden"><a href="javascript:void(0);" class="responsive-menu-link">&nbsp;</a><div class="dropdown hidden"><div class="pointer"><div class="pointer-inner" /></div><ul class="dropdown-contents" /></div></li>',
html = '<li class="responsive-menu hidden"><a href="javascript:void(0);" class="js-responsive-menu-link responsive-menu-link"><i class="icon fa-bars fa-fw"></i></a><div class="dropdown"><div class="pointer"><div class="pointer-inner" /></div><ul class="dropdown-contents" /></div></li>',
slack = 3; // Vertical slack space (in pixels). Determines how sensitive the script is in determining whether a line-break has occured.
// Add a hidden drop-down menu to each links list (except those that already have one)
@ -578,8 +578,9 @@ function parseDocument($container) {
$menuContents.prepend($clones1.addClass('clone clone-first').removeClass('leftside rightside'));
if ($this.hasClass('post-buttons')) {
$('.button', $menuContents).removeClass('button icon-button');
$('.responsive-menu-link', $menu).addClass('button icon-button').prepend('<span></span>');
$('.button', $menuContents).removeClass('button');
$('.js-responsive-menu-link').addClass('button');
$('.js-responsive-menu-link .icon').removeClass('fa-bars').addClass('fa-ellipsis-h');
}
copied1 = true;
}
@ -633,7 +634,7 @@ function parseDocument($container) {
}
if (!persistent) {
phpbb.registerDropdown($menu.find('a.responsive-menu-link'), $menu.find('.dropdown'), false);
phpbb.registerDropdown($menu.find('a.js-responsive-menu-link'), $menu.find('.dropdown'), false);
}
// If there are any images in the links list, run the check again after they have loaded

View file

@ -81,11 +81,6 @@
padding-right: 0;
}
.rtl ul.linklist li.responsive-menu a.responsive-menu-link:before {
left: auto;
right: 0;
}
/* Dropdown menu
---------------------------------------- */
.rtl .dropdown-container.topic-tools, .rtl .dropdown-container-left {
@ -261,10 +256,23 @@
margin-right: 0;
}
.pagination li.previous a { background-position: -50px 2px; }
.pagination li.next a { background-position: -30px 2px; }
.pagination li.previous a:hover { background-position: -50px -18px; }
.pagination li.next a:hover { background-position: -30px -18px; }
/* Action Bar styles
---------------------------------------- */
.rtl .action-bar .button {
margin-right: 0;
float: right;
}
.rtl .action-bar > .button {
margin-left: 5px;
float: right;
}
.rtl .action-bar .dropdown-button-control .button {
margin-left: 5px;
}
/* Miscellaneous styles
---------------------------------------- */

View file

@ -281,27 +281,6 @@ ul.linklist li.responsive-menu {
margin: 0 5px;
}
ul.linklist .responsive-menu-link {
display: inline-block;
margin: 0 5px;
font-size: 1.455em;
position: relative;
width: 16px;
line-height: 1.2em;
text-decoration: none;
}
ul.linklist .responsive-menu-link:before {
content: '';
position: absolute;
left: 0;
top: 7px;
height: 2px;
width: 14px;
border-bottom: 0.125em solid transparent;
border-top: 0.375em double transparent;
}
.hasjs ul.linklist.leftside, .hasjs ul.linklist.rightside {
max-width: 48%;
}
@ -1240,30 +1219,11 @@ ul.linklist:after,
margin: 0 7px 0 0;
}
.linklist .quick-links .responsive-menu-link {
display: block;
font-size: inherit;
line-height: inherit;
margin: 0;
width: auto;
}
.linklist .quick-links .responsive-menu-link:before {
font-size: 1.455em;
line-height: 16.5px;
}
.compact .quick-links .responsive-menu-link {
width: 0;
overflow: hidden;
white-space: nowrap;
}
.compact .icon-notification > a > span, .compact .icon-pm > a > span {
.linklist.compact .rightside > a > span span {
display: none;
}
.compact .icon-notification > a > strong, .compact .icon-pm > a > strong {
.linklist.compact .rightside > a strong {
padding-left: 2px;
}

View file

@ -381,24 +381,20 @@ input.button1:focus, input.button2:focus, input.button3:focus {
box-sizing: border-box;
}
.search-box button {
.search-box .button {
float: left;
}
.search-box button.search-icon {
border-radius: 0;
font-size: 0;
height: 24px;
margin: 0;
padding: 3px 5px;
padding: 2px 5px;
}
.search-box a.button {
border-left-width: 0;
border-radius: 0 4px 4px 0;
}
.search-box .button span {
font-size: 0;
margin: 0;
padding: 2px 5px 2px 3px;
}
/* Search box (header)
@ -413,16 +409,13 @@ input.button1:focus, input.button2:focus, input.button3:focus {
.search-header .inputbox { border: 0; }
.search-header button {
border-top: 0;
border-bottom: 0;
.search-header .button {
border-top-width: 0;
border-bottom-width: 0;
padding: 3px 5px;
}
.search-header a.button {
border: 0;
border-left: 1px;
padding: 3px 5px 3px 4px;
}
.navbar .linklist > li.responsive-search { display: none; }
input.search {
background-image: none;

View file

@ -6,9 +6,11 @@ a {
direction: ltr;
unicode-bidi: embed;
text-decoration: none;
}
/* we use links inline more often then not so to address several bugs with
IE and some other browsers we render all links as inlineblock by default */
display: inline-block;
a:hover { text-decoration: underline; }
}
/* Coloured usernames */
.username-coloured {

View file

@ -73,16 +73,6 @@ body {
/* Search
----------------------------------------*/
.responsive-search { display: block !important; }
.responsive-search a {
display: block;
width: 16px;
height: 22px;
text-indent: 99px;
overflow: hidden;
background-position: 50% 50%;
background-repeat: no-repeat;
text-decoration: none;
}
/* .topiclist lists
----------------------------------------*/
@ -181,7 +171,6 @@ li.row .responsive-show strong {
}
ul.topiclist li.row dt a.subforum {
display: inline-block;
vertical-align: bottom;
overflow: hidden;
text-overflow: ellipsis;
@ -315,10 +304,6 @@ dl.pmlist dd:first-of-type {
display: none;
}
.colour-palette a {
display: inline-block !important;
}
fieldset.quick-login label {
display: block;
margin-bottom: 5px;