OpenSourceArk/mkdocs-material
1
0
Fork 0
mirror of https://github.com/squidfunk/mkdocs-material.git synced 2024-06-14 11:52:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fixed search bar alignment on big screens

Browse Source
This commit is contained in:
squidfunk 2017-10-19 09:23:22 +02:00 committed by Martin Donath
parent 9c3134750e
commit 9005ae2381
4 changed files with 14 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
material/assets/stylesheets/application-0741cbeb94.css
View File

File diff suppressed because one or more lines are too long

1
material/assets/stylesheets/application-6062816a07.css Normal file
View File

File diff suppressed because one or more lines are too long

2
material/base.html
View File

@ -50,7 +50,7 @@
<script src="{{ base_url }}/assets/javascripts/modernizr-e826f8942a.js"></script> <script src="{{ base_url }}/assets/javascripts/modernizr-e826f8942a.js"></script>
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-0741cbeb94.css"> <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-6062816a07.css">
{% if config.extra.palette %} {% if config.extra.palette %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-23f75ab9c7.palette.css"> <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-23f75ab9c7.palette.css">
{% endif %} {% endif %}

26
src/assets/stylesheets/layout/_search.scss
View File

@ -123,13 +123,13 @@ $md-toggle__search--checked:
// Search modal wrapper // Search modal wrapper
&__inner { &__inner {
width: 100%;
// [tablet portrait -]: Put search modal off-canvas by default // [tablet portrait -]: Put search modal off-canvas by default
@include break-to-device(tablet portrait) { @include break-to-device(tablet portrait) {
position: fixed; position: fixed;
top: 0; top: 0;
left: 100%; left: 100%;
width: 100%;
height: 100%; height: 100%;
transform: translateX(5%); transform: translateX(5%);
transition: transition:
@ -151,23 +151,11 @@ $md-toggle__search--checked:
} }
} }
// [tablet landscape +]: Make relative for inner layout
@include break-from-device(tablet landscape) {
position: relative;
}
}
// Search form
&__form {
position: relative;
// [tablet landscape +]: Header-embedded search // [tablet landscape +]: Header-embedded search
@include break-from-device(tablet landscape) { @include break-from-device(tablet landscape) {
position: relative;
width: 23rem; width: 23rem;
// Hack: omit jitter when form is resized
float: right;
transition: width 0.25s cubic-bezier(0.1, 0.7, 0.1, 1); transition: width 0.25s cubic-bezier(0.1, 0.7, 0.1, 1);
border-radius: 0.2rem;
} }
// Set maximum width // Set maximum width
@ -185,6 +173,16 @@ $md-toggle__search--checked:
} }
} }
// Search form
&__form {
position: relative;
// [tablet landscape +]: Header-embedded search
@include break-from-device(tablet landscape) {
border-radius: 0.2rem;
}
}
// Search input // Search input
&__input { &__input {
position: relative; position: relative;