Rework Oauth login buttons, swap github logo to monocolor (#24740)

Diff without whitespace:
https://github.com/go-gitea/gitea/pull/24740/files?diff=unified&w=1

- Use SVGs for GitHub and GitLab oauth providers
- Replace section wrapping with a divider
- Rework icon rendering, increase size from 32px to 40px

Before:

<img width="853" alt="Screenshot 2023-05-15 at 21 54 23"
src="https://github.com/go-gitea/gitea/assets/115237/6ab5cfb4-46ff-469a-bd1f-06780d4a6a0b">

After (more providers):

<img width="849" alt="Screenshot 2023-05-15 at 21 51 21"
src="https://github.com/go-gitea/gitea/assets/115237/fa84f92f-98e0-4aed-9357-5d62ddd98195">

<img width="856" alt="Screenshot 2023-05-15 at 21 56 45"
src="https://github.com/go-gitea/gitea/assets/115237/d3edd7ed-dadd-4302-aca7-08f20adc220e">


Ref: https://codeberg.org/Codeberg/Community/issues/1023

---------

Co-authored-by: Giteabot <teabot@gitea.io>

web_src/css/base.css

@@ -338,7 +338,11 @@ a {
   text-decoration-skip-ink: all;
 }
 
+/* muted link = only colored when hovered */
+/* silenced link = never colored */
+
 a.muted,
+a.silenced,
 .muted-links a {
   color: inherit;
 }
@@ -350,6 +354,10 @@ a.muted:hover [class*="color-text"],
   color: var(--color-primary);
 }
 
+a.silenced:hover {
+  color: inherit;
+}
+
 .delete-button,
 .delete-button:hover {
   color: var(--color-red);

web_src/css/form.css

@@ -206,32 +206,6 @@ textarea:focus,
   }
 }
 
-.signin .oauth2 div {
-  display: inline-block;
-}
-
-.signin .oauth2 div p {
-  margin: 10px 5px 0 0;
-  float: left;
-}
-
-.signin .oauth2 a {
-  margin-right: 3px;
-}
-
-.signin .oauth2 a:last-child {
-  margin-right: 0;
-}
-
-.signin .oauth2 img {
-  width: 32px;
-  height: 32px;
-}
-
-.signin .oauth2 img.openidConnect {
-  width: auto;
-}
-
 @media (min-width: 768px) {
   .g-recaptcha-style,
   .h-captcha-style {

web_src/css/helpers.css

@@ -73,6 +73,8 @@ Gitea's private styles use `g-` prefix.
 .gt-whitespace-nowrap { white-space: nowrap !important; }
 .gt-whitespace-pre { white-space: pre !important; }
 .gt-whitespace-pre-wrap { white-space: pre-wrap !important; }
+.gt-object-contain { object-fit: contain !important; }
+.gt-self-center { align-self: center !important; }
 
 .gt-overflow-x-auto { overflow-x: auto !important; }
 .gt-overflow-x-scroll { overflow-x: scroll !important; }