Fixed right padding on some browser for overflowing content tabs

This commit is contained in:
squidfunk 2021-10-11 16:03:23 +02:00
parent 49f4677a43
commit b65586359b
5 changed files with 27 additions and 6 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -39,7 +39,7 @@
{% endif %}
{% endblock %}
{% block styles %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.c46c0193.min.css' | url }}">
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.6f3be620.min.css' | url }}">
{% if config.theme.palette %}
{% set palette = config.theme.palette %}
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.3f5d1f46.min.css' | url }}">

View File

@ -217,8 +217,29 @@
> .tabbed-alternate .tabbed-labels {
max-width: 100vw;
margin: 0 px2rem(-16px);
padding: 0 px2rem(16px);
scroll-padding: 0 px2rem(16px);
padding-left: px2rem(16px);
scroll-padding-left: px2rem(16px);
// Adjust for right-to-left languages
[dir="rtl"] & {
padding-right: px2rem(16px);
padding-left: initial;
scroll-padding-right: px2rem(16px);
scroll-padding-left: initial;
}
// Hack: some browsers ignore the right padding on flex containers,
// see https://bit.ly/3lsPS3S
&::after {
padding-right: px2rem(16px);
content: "";
// Adjust for right-to-left languages
[dir="rtl"] & {
padding-right: initial;
padding-left: px2rem(16px);
}
}
}
}