Making social logo bigger

[thomas-saigre]

In #2933 an answer is provided to change the size of the logo of the website from and extra.css file.

I'm looking to do the same transformation for the logo included at the bottom line from the social section.
I used this code

.md-social__link img,
.md-social__link svg {
  height: 320px !important;
  width: auto !important;
}

Maybe I am mistaken in the class name (that I found with the Firefox inspector).
How could I achieve it ?

Thanks in advance.

[kamilkrzyskow]

Hello @thomas-saigre,
the limiting factor when it comes to the size of the SVGs is the parent a.md-social__link tag.
Adjust the width/height for it:

.md-social__link {
  height: 2rem;
  width: 2rem;
}
.md-social__link svg {
  max-height: unset;
  max-width: unset;
}

[thomas-saigre]

Thanks! This is (almost) working well.

But why can't I set the height for all logos? I'm using personal svg files that have not the same height and hence with the unset attribute, they appear in different sizes (like the logo of docker in your example). I found a workaround by setting max-height to a handwritten value so the logos appear at the same size (e.g. max-height: 32px in mkdocs-material)