%PDF- %PDF-
| Direktori : /data/www_bck/varak.net_bck/wiki.varak.net/extensions.old/MobileFrontend/less/ |
| Current File : //data/www_bck/varak.net_bck/wiki.varak.net/extensions.old/MobileFrontend/less/ui.less |
@import "minerva.variables";
@import "minerva.mixins";
@import "mediawiki.mixins";
// FIXME: Separate imported folders into a components directory
@import 'mainmenu';
@topBarBackgroundColor: #F3F3F3;
html,
body {
// Ensure overlays take up full screen
height: 100%;
}
#content_wrapper {
.top-bar {
background-color: @colorGray15;
padding: 5px @contentMargin;
display: block;
color: @colorGray6;
a {
color: @colorGray6;
// If browser supports
&:nth-child(2) {
font-weight: bold;
}
}
&.active {
background-color: #00AF8B;
color: #fff;
a {
color: #fff;
}
}
}
}
// FIXME: Id's for styling are bad m'kay?
#mw-mf-main-menu-button {
background-position: 50% 50%;
.background-image-svg( 'images/menu/hamburger.svg', 'images/menu/hamburger.png' );
}
.header {
display: table;
width: 100%;
height: @headerHeight;
white-space: nowrap;
border-bottom: 1px solid @grayLight;
> a {
width: @headerHeight;
}
// Left and right menu links
> a,
// Search field
> form {
display: table-cell;
vertical-align: middle;
}
// Search
> form {
padding: .15em @headerTitlePaddingH 0;
width: auto;
}
// FIXME: Overrides rules in common.less for input area that are present in reset.less - should be unnecessary
.search {
border: none;
padding: 0;
}
.fulltext-search {
margin: 0 .2em 0 .5em;
float: right;
}
}
// Make search input more visible for users on small screens.
// Opera Mini doesn't support placeholders.
@media all and (max-width: @wgMFDeviceWidthMobileSmall) {
.header {
.search {
border: 1px solid @grayLight;
padding: .3em .1em;
}
}
}
// Used for messages on login screen, page lists and uploads and when showing old revisions
.alert {
padding: 1em @contentMargin;
margin: 0 0 1em;
&.warning {
color: #850;
background: #feb
}
h2 {
font: bold 100% @fontFamily;
padding: 0;
margin: 0 0 .5em 0;
}
}
/* Search */
.client-nojs {
.search-box input.search {
// FIXME: This should not be necessary
width: 75%;
}
}
input.search {
outline: 0;
width: 100%;
// FIXME: unable to check but the important may not be needed for Nokia S60;
background-color: #fff !important; /* remove fennec default background also see bug 36490 */
// get rid of rounded corners in Safari
-webkit-appearance: none;
// get rid of X in Chrome
&::-webkit-search-cancel-button {
-webkit-appearance: none;
}
}
// FIXME: remove when micro.tap in stable and rule from common-js.less too
.search-box {
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}
.content {
.edit-page {
display: none;
position: absolute;
background-position: 100% @headingMargin;
width: @sectionIconWidth + 5px;
top: 0;
bottom: 0;
right: 0;
}
.open-block {
// Restrict to child so that child section edit links do not get revealed.
> .edit-page {
display: block;
}
}
}
.stub .edit-page {
margin: 0;
display: block;
}
.stable {
// Remove when/if page-secondary-actions are promoted to stable
.languageSelector {
margin-top: 1em;
}
}
.truncated-text {
white-space: nowrap;
overflow: hidden;
-webkit-text-overflow: ellipsis;
text-overflow: ellipsis;
// FIXME: this works only in WebKit
&.multi-line {
white-space: normal;
display: -webkit-box;
-webkit-box-orient: vertical;
}
&.two-line {
-webkit-line-clamp: 2;
// fallback for non-WebKit
max-height: 2.6em;
}
}
// FIXME: Create generic class to represent both of these headers
.overlay,
.header {
.user-button {
height: @headerHeight;
background-position: 50% 50%;
}
// need to specify id or else other rules are more important
// FIXME: simplify when .icon class from Overlay used instead
#secondary-button.user-button,
.user-button {
width: @headerHeight;
text-align: right;
// Make sure count is positioned correctly in relation to bell icon
position: relative;
.background-image-svg-quick( 'images/bell' );
// Fixes positioning in Firefox
display: inline-block;
float: right;
&.loading span {
display: none;
}
span {
text-indent: 0;
display: inline-block;
font-weight: bold;
color: #fff;
background: #c91f2c;
border-radius: 2px;
height: 1.2em;
line-height: 1.2em;
min-width: 1em;
margin: .6em .6em 0 0;
padding: 0 0.1em;
text-align: center;
&.zero {
display: none;
}
// FIXME: There must be a better way of doing this
&.max {
right: .2em;
width: 2em;
height: 2em;
line-height: 2em;
font-size: 0.7em;
}
}
}
}
// FIXME [mediawiki ui] These rules should not be needed in the mobile context
.mw-ui-button-group {
text-align: center;
* {
float: none !important;
}
// For talk and CTA drawer
.mw-ui-block {
width: auto;
}
}