diff --git a/themes/vue/layout/index.ejs b/themes/vue/layout/index.ejs
index 2302ac7e66..efb5587336 100644
--- a/themes/vue/layout/index.ejs
+++ b/themes/vue/layout/index.ejs
@@ -35,8 +35,8 @@
Special Sponsor
<% var specialSponsor = theme.special[0]; %>
-
-
+
diff --git a/themes/vue/layout/partials/sponsors.ejs b/themes/vue/layout/partials/sponsors.ejs
index 50770ef006..7ef4e9cf7e 100644
--- a/themes/vue/layout/partials/sponsors.ejs
+++ b/themes/vue/layout/partials/sponsors.ejs
@@ -3,15 +3,15 @@
Patreon Sponsors
<%_ for (const sponsor of theme.platinum) {_%>
-
-
+
<%_ } _%>
<%_ for (const sponsor of theme.gold) {_%>
-
-
+
<%_ } _%>
diff --git a/themes/vue/source/css/_sponsors-index.styl b/themes/vue/source/css/_sponsors-index.styl
index 3290e2bcda..cff8226199 100644
--- a/themes/vue/source/css/_sponsors-index.styl
+++ b/themes/vue/source/css/_sponsors-index.styl
@@ -11,11 +11,15 @@
a
margin: 20px 15px 0
position: relative
- a, img
- width: 100px
display: inline-block
- vertical-align: middle
+ &.sponsor
+ width: 100px
+ height: 60px
+ line-height: 60px
img
+ max-width: 100%
+ max-height: 100%
+ vertical-align: middle
transition: all .3s ease
filter: grayscale(100%)
opacity: 0.66
@@ -26,8 +30,7 @@
display: block
margin: 30px auto 15px
width: 200px
- img
- width: 200px
+ height: auto
.become-sponsor
margin-top: 40px
font-size: .9em
diff --git a/themes/vue/source/css/_sponsors-sidebar.styl b/themes/vue/source/css/_sponsors-sidebar.styl
index 5489a77d30..ef823be91f 100644
--- a/themes/vue/source/css/_sponsors-sidebar.styl
+++ b/themes/vue/source/css/_sponsors-sidebar.styl
@@ -3,16 +3,19 @@
font-size: .85em
.logo
color: $light
- margin-top: 10px
- text-align: center
+ width: 125px
+ height: 50px
font-weight: bold
- display block
+ display flex
+ align-items center
+ justify-content center
&:first-child
margin-top: 18px
&:last-child
margin-bottom: 20px
- img, a
- width: 125px
+ img
+ max-width: 125px
+ max-height: 50px
.become-backer
border: 1px solid $green
diff --git a/themes/vue/source/css/index.styl b/themes/vue/source/css/index.styl
index bec2ecd6f2..2f74a7a6ad 100644
--- a/themes/vue/source/css/index.styl
+++ b/themes/vue/source/css/index.styl
@@ -120,11 +120,16 @@ body
margin 0
a
color $light
+ width: 160px
+ height: 80px
+ line-height: 80px
a, span, img
display: inline-block
vertical-align: middle
img
margin: 15px 0 0
+ max-width: 100%
+ max-height: 100%
#highlights
background-color: #fff