wikimedia/mediawiki-extensions-MobileFrontend

View on GitHub
resources/mobile.languages.structured/LanguageSearcher.less

Summary

Maintainability
Test Coverage
@import 'mediawiki.skin.variables.less';
@import '../../mobile.less/mobile.variables.less';

.language-searcher {
    .panel {
        background-color: @background-color-base;
        padding: 0.5em;
    }

    .search-box {
        // Always show the language search input
        display: block;
        // Make sure the absolutely positioned search icon overlaps the search input
        position: relative;
    }

    .search {
        box-shadow: none;
    }

    .list-header {
        font-family: sans-serif;
        font-weight: normal;
        letter-spacing: 1px;
        padding: 2em 1em 0.5em;
        text-transform: uppercase;
    }

    ol.site-link-list {
        list-style: none;
    }

    .site-link-list {
        li {
            background-color: @background-color-base;
            padding: 0;
        }

        [ dir='ltr' ] {
            /* @noflip */
            text-align: left;
        }

        [ dir='rtl' ] {
            /* @noflip */
            text-align: right;
        }

        a {
            border-top: @border-width-base @border-style-base @border-color-muted;
            cursor: pointer;
            display: block;
            padding: 0.75em 1em;

            span {
                font-size: 0.9em;
            }

            .autonym,
            .title {
                display: block;
            }

            .autonym {
                // FIXME: Does this really need to be emphasized?
                color: @color-emphasized; // TODO
                font-weight: bold;
            }

            .title {
                color: @color-subtle;
                padding-top: 0.5em;
            }
        }
    }

    .empty-results {
        margin: 1em 2.5em;

        .empty-results-body {
            margin: 1em 0;
        }
    }
}

@media all and ( min-width: @min-width-breakpoint-tablet ) {
    .language-searcher {
        .site-link-list {
            padding-left: 0;
            padding-right: 0;
        }
    }
}