mirror of
https://github.com/phpbb/phpbb.git
synced 2025-08-15 05:04:09 +02:00
[ticket/12769] Fix dropdown styling
This commit is contained in:
@@ -1,61 +1,61 @@
|
||||
/* --------------------------------------------------------------
|
||||
$Base
|
||||
$Base
|
||||
-------------------------------------------------------------- */
|
||||
|
||||
/** {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
*:before,
|
||||
*:after {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}*/
|
||||
|
||||
/* Define your base font-size here; most elements will inherit this. _NO__DOTCOMMA__AFTER__*/
|
||||
html {
|
||||
font-size: 1em; /* Assuming 16px... */
|
||||
line-height: 1.5; /* 24px (This is now our magic number; all subsequent margin-bottoms and line-heights want to be a multiple of this number in order to maintain vertical rhythm.) _NO__DOTCOMMA__AFTER__*/
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
font-size: 1em; /* Assuming 16px... */
|
||||
line-height: 1.5; /* 24px (This is now our magic number; all subsequent margin-bottoms and line-heights want to be a multiple of this number in order to maintain vertical rhythm.) _NO__DOTCOMMA__AFTER__*/
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color: #333333;
|
||||
background-color: #ffffff;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color: #333333;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
input,
|
||||
button,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
figure { margin: 0 }
|
||||
img { vertical-align: middle }
|
||||
|
||||
hr {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
border: 0;
|
||||
border-top: 1px solid #e5e5e5;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
border: 0;
|
||||
border-top: 1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #428bca;
|
||||
text-decoration: none;
|
||||
color: #428bca;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
color: #2a6496;
|
||||
text-decoration: underline;
|
||||
color: #2a6496;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
@@ -71,9 +71,9 @@ figure,
|
||||
p,
|
||||
pre { margin: 0 }
|
||||
button {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -81,22 +81,22 @@ button {
|
||||
* results in a loss of the default `button` focus styles.
|
||||
*/
|
||||
button:focus {
|
||||
outline: 1px dotted;
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
outline: 1px dotted;
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
iframe { border: 0 }
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -110,6 +110,6 @@ ul {
|
||||
* Remove double underline from recent version of firefox
|
||||
*/
|
||||
abbr[title] {
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
@@ -17,9 +17,6 @@
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.dropdown-select {
|
||||
padding-right: 24px;
|
||||
}
|
||||
|
||||
.icon-button:before {
|
||||
background: transparent 0 0 no-repeat;
|
||||
@@ -30,99 +27,19 @@
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.dropdown-select.icon-button:before {
|
||||
margin-right: 4px;
|
||||
.button:focus,
|
||||
.button:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.dropdown-select:after {
|
||||
background-position: -103px 10px;
|
||||
.caret {
|
||||
border-left: 1px solid;
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
height: 22px;
|
||||
width: 16px;
|
||||
position: relative;
|
||||
right: -6px;
|
||||
}
|
||||
|
||||
.dropdown-visible .dropdown-select:after, .nojs .dropdown-container:hover .dropdown-select:after {
|
||||
background-position: -103px -10px;
|
||||
}
|
||||
|
||||
.buttons, .buttons .button {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.buttons .button:before {
|
||||
margin: 3px 0 0 2px;
|
||||
}
|
||||
|
||||
.buttons .button, .dropdown-select {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.jumpbox .dropdown-select {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Big button images */
|
||||
.reply-icon:before, .pmreply-icon:before { background-position: -20px 0; }
|
||||
.reply-icon:hover:before, .pmreply-icon:hover:before { background-position: -20px -20px; }
|
||||
|
||||
.post-icon:before, .newpm-icon:before, .reply-all:before { background-position: 0 0; }
|
||||
.post-icon:hover:before,
|
||||
.newpm-icon:hover:before,
|
||||
.reply-all:hover:before { background-position: 0 -20px; }
|
||||
|
||||
.locked-icon:before { background-position: -60px 0; }
|
||||
.locked-icon:hover:before { background-position: -60px -20px; }
|
||||
|
||||
.forwardpm-icon:before { background-position: -40px 0; }
|
||||
.forwardpm-icon:hover:before { background-position: -40px -20px; }
|
||||
|
||||
.modtools-icon {
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.tools-icon:before, .modtools-icon:before, .search-icon:before, .search-adv-icon:before {
|
||||
background-position: -80px 0;
|
||||
height: 16px;
|
||||
margin-top: 2px;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.dropdown-visible .tools-icon:before,
|
||||
.nojs .dropdown-container:hover .tools-icon:before { background-position: -80px -20px; }
|
||||
|
||||
.search-icon:before { background-position: -245px 0; }
|
||||
.search-icon:hover:before { background-position: -245px -20px; }
|
||||
|
||||
.search-adv-icon:before { background-position: -265px 0; }
|
||||
.search-adv-icon:hover:before { background-position: -265px -20px; }
|
||||
|
||||
.modtools-icon:before { background-position: -225px 0; }
|
||||
.dropdown-visible .modtools-icon:before,
|
||||
.nojs .dropdown-container:hover .modtools-icon:before { background-position: -225px -20px; }
|
||||
|
||||
/* Icon images
|
||||
---------------------------------------- */
|
||||
.small-icon {
|
||||
background-position: 0 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.small-icon > a {
|
||||
display: inline-block;
|
||||
padding: 0 0 0 18px;
|
||||
}
|
||||
|
||||
ul.linklist.bulletin > li.small-icon:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dropdown .small-icon > a {
|
||||
display: block;
|
||||
.caret i {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* Poster contact icons
|
||||
|
@@ -38,6 +38,10 @@ hr {
|
||||
|
||||
.search-header {
|
||||
box-shadow: 0 0 10px #0075B0;
|
||||
/* Notification mark read link */
|
||||
.dropdown-extended a.mark_read {
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
/* Round cornered boxes and backgrounds
|
||||
@@ -300,10 +304,6 @@ a:hover { color: #D31141; }
|
||||
color: #A8D8FF;
|
||||
}
|
||||
|
||||
/* Notification mark read link */
|
||||
.dropdown-extended a.mark_read {
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
/* Post body links */
|
||||
.postlink {
|
||||
@@ -653,10 +653,6 @@ Colours and backgrounds for buttons.css
|
||||
color: #D31141;
|
||||
}
|
||||
|
||||
.dropdown-select {
|
||||
color: #536482;
|
||||
}
|
||||
|
||||
.button:hover, .dropdown-visible .dropdown-select, .nojs .dropdown-container:hover .dropdown-select {
|
||||
border-color: #0A8ED0;
|
||||
background-color: #FFFFFF; /* Old browsers */ /* FF3.6+ */
|
||||
@@ -666,8 +662,8 @@ Colours and backgrounds for buttons.css
|
||||
text-shadow: 1px 1px 0 #FFFFFF, -1px -1px 0 #FFFFFF, -1px -1px 0 rgba(188, 42, 77, 0.2);
|
||||
}
|
||||
|
||||
.dropdown-select:after { border-color: #DADADA; }
|
||||
.dropdown-select:hover { border-color: #C7C3BF; }
|
||||
.caret { border-color: #DADADA; }
|
||||
.caret { border-color: #C7C3BF; }
|
||||
|
||||
.dropdown-visible .dropdown-select, .dropdown-visible .dropdown-select:hover, .nojs .dropdown-container:hover .dropdown-select {
|
||||
border-color: #A6B2BA;
|
||||
|
@@ -1047,10 +1047,6 @@ ul.linklist:after,
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.smilies {
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
@@ -45,8 +45,6 @@ li.breadcrumbs span:first-child > a {
|
||||
z-index: 2;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
width: 30px;
|
||||
height: 40px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
@@ -57,7 +55,7 @@ li.breadcrumbs span:first-child > a {
|
||||
}
|
||||
|
||||
.dropdown-extended a.mark_read:hover {
|
||||
width: 40px;
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.jumpbox-cat-link,
|
||||
|
@@ -1,16 +1,26 @@
|
||||
/* --------------------------------------------------------------
|
||||
$Utilities
|
||||
$Utilities
|
||||
-------------------------------------------------------------- */
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.sr-only-focusable:active,
|
||||
.sr-only-focusable:focus {
|
||||
position: static;
|
||||
width: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
clip: auto;
|
||||
}
|
||||
|
||||
.clearfix:before,
|
||||
@@ -21,8 +31,8 @@
|
||||
.container-fluid:after,
|
||||
.row:before,
|
||||
.row:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
content: " ";
|
||||
display: table;
|
||||
}
|
||||
.clearfix:after,
|
||||
.container:after,
|
||||
@@ -30,9 +40,9 @@
|
||||
.row:after { clear: both }
|
||||
|
||||
.center-block {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.pull-right { float: right !important }
|
||||
@@ -42,16 +52,16 @@
|
||||
.invisible { visibility: hidden }
|
||||
|
||||
.text-hide {
|
||||
font: 0/0 a;
|
||||
color: transparent;
|
||||
text-shadow: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
font: 0/0 a;
|
||||
color: transparent;
|
||||
text-shadow: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/*.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
}*/
|
||||
.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
.affix { position: fixed }
|
||||
|
Reference in New Issue
Block a user