Parcourir la source

Improve funding styling slightly

Jordi Boggiano il y a 5 ans
Parent
commit
fe0ca0afa7

+ 4 - 0
src/Packagist/WebBundle/Resources/public/css/main.css

@@ -1114,6 +1114,10 @@ input:focus:invalid:focus, textarea:focus:invalid:focus, select:focus:invalid:fo
 .package .package-aside i:hover {
   color: #a5aab0;
 }
+.package .package-aside .facts i, .package .package-aside .facts i:hover {
+  color: #2d2d32;
+  margin-right: 4px;
+}
 .package .package-aside a.advisory-alert {
     margin-left: -20px;
 }

+ 14 - 5
src/Packagist/WebBundle/Resources/views/package/view_package.html.twig

@@ -171,15 +171,24 @@
                             {% endif %}
                         </div>
 
-                        <div class="facts col-xs-12 col-sm-6 col-md-12">
-                            {% if version and version.funding is defined and version.funding|length > 0 %}
+                        {% if version and version.funding and version.funding|length > 0 %}
+                            <div class="facts funding col-xs-12 col-sm-6 col-md-12">
                                 <p>
                                     Fund package maintenance!
                                     {% for fundingOption in version.funding %}
-                                        <br>&raquo; <a rel="nofollow noopener external noindex" href="{{ fundingOption.url }}">{{ fundingOption.type == 'custom' ? fundingOption.url : fundingOption.type }}</a>
+                                        <br><a rel="nofollow noopener external noindex" href="{{ fundingOption.url }}">
+                                            {% set fundingType = fundingOption.type|default('custom') %}
+                                            {% if fundingType == 'custom' %}
+                                                <i class="glyphicon glyphicon-link"></i>{{ fundingOption.url|replace({'http://': '', 'https://': ''})|trim('/') }}
+                                            {% elseif fundingType == 'github' %}
+                                                <i class="glyphicon glyphicon-user"></i>{{ fundingOption.url|replace({'https://github.com/sponsors/': '', 'https://github.com/': ''}) }}
+                                            {% else %}
+                                                <i class="glyphicon glyphicon-link"></i>{{ fundingType|replace({'_': ' '})|title }}
+                                            {% endif %}
+                                        </a>
                                     {% endfor %}
-                            {% endif %}
-                        </div>
+                            </div>
+                        {% endif %}
 
                         <div class="facts col-xs-12 col-sm-6 col-md-12">
                             <p>