Fix source repository SVG sizing in IE/Edge

This commit is contained in:
squidfunk 2016-12-28 17:59:29 +01:00
parent 4ed0b1328f
commit 3f5957bd01
6 changed files with 19 additions and 9 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

@ -36,7 +36,7 @@
{% include "partials/fonts.html" %} {% include "partials/fonts.html" %}
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-fbfbf18e7f.css"> <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-d20f29caab.css">
{% if config.extra.palette %} {% if config.extra.palette %}
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-4bd030561c.palette.css"> <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-4bd030561c.palette.css">
{% endif %} {% endif %}

View File

@ -10,9 +10,11 @@
{% endif %} {% endif %}
<a href="{{ config.repo_url }}" title="Go to repository" class="md-source" data-md-source="{{ repo_type }}"> <a href="{{ config.repo_url }}" title="Go to repository" class="md-source" data-md-source="{{ repo_type }}">
{% if repo_type %} {% if repo_type %}
<svg class="md-source__icon"> <div class="md-source__icon">
<use xlink:href="#{{ repo_type }}" x="12" y="12" width="24" height="24"></use> <svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#{{ repo_type }}" width="24" height="24"></use>
</svg> </svg>
</div>
{% endif %} {% endif %}
<div class="md-source__repository"> <div class="md-source__repository">
{{ config.repo_name }} {{ config.repo_name }}

View File

@ -88,6 +88,13 @@
vertical-align: middle; vertical-align: middle;
fill: $md-color-white; fill: $md-color-white;
// Align SVG, do not scale, as this will incur strange formatting bugs
// in Internet Explorer and Edge
svg {
margin-top: 1.2rem;
margin-left: 1.2rem;
}
// Correct alignment, if icon is present // Correct alignment, if icon is present
+ .md-source__repository { + .md-source__repository {
margin-left: -4.4rem; margin-left: -4.4rem;

View File

@ -39,10 +39,11 @@
<a href="{{ config.repo_url }}" title="Go to repository" class="md-source" <a href="{{ config.repo_url }}" title="Go to repository" class="md-source"
data-md-source="{{ repo_type }}"> data-md-source="{{ repo_type }}">
{% if repo_type %} {% if repo_type %}
<svg class="md-source__icon"> <div class="md-source__icon">
<use xlink:href="#{{ repo_type }}" x="12" y="12" <svg viewBox="0 0 24 24" width="24" height="24">
width="24" height="24"></use> <use xlink:href="#{{ repo_type }}" width="24" height="24"></use>
</svg> </svg>
</div>
{% endif %} {% endif %}
<div class="md-source__repository"> <div class="md-source__repository">
{{ config.repo_name }} {{ config.repo_name }}