Service UI rework to support branded sign-in

* OSF branded services use full banner without name
* Custom branded services use square logo with name, which is
  similar to the banner design for the instn SSO page. The only
  difference is: custom branded service names wraps on narrow
  screens while the instn SSO one hides optional prefix.
* In addition, redesigned the default banner for OSF preprints
  and OSF registries so they look better after rework.
* Finally, added all logos for both stagings and the production
  custom branded preprints.

Author: cslzchen

etc/cas/services/local/casarxiv-203948234207241.json

@@ -0,0 +1,36 @@
+{
+  "@class": "org.apereo.cas.services.RegexRegisteredService",
+  "serviceId" : "^https?://(localhost|127\\.0\\.0\\.1):5000/(login|logout)/?\\?next=https?(%3A|:)(%2F|/)(%2F|/)((local\\.casarxiv\\.org(%3A|:)4200)|((localhost|127\\.0\\.0\\.1)(%3A|:)5000(%2F|/)preprints(%2F|/)casarxiv))($|%2F|/).*",
+  "name" : "CasArxiv Preprints",
+  "description" : "",
+  "id" : 203948234207241,
+  "evaluationOrder": 10,
+  "logo" : "/images/branded/preprints-casarxiv-logo.png",
+  "attributeReleasePolicy": {
+    "@class": "org.apereo.cas.services.ReturnAllowedAttributeReleasePolicy",
+    "allowedAttributes": [
+      "java.util.ArrayList",
+      [
+        "givenName",
+        "familyName",
+        "username"
+      ]
+    ]
+  },
+  "accessStrategy": {
+    "@class": "org.apereo.cas.services.DefaultRegisteredServiceAccessStrategy",
+    "delegatedAuthenticationPolicy": {
+      "@class": "org.apereo.cas.services.DefaultRegisteredServiceDelegatedAuthenticationPolicy",
+      "allowedProviders": [
+        "java.util.ArrayList",
+        [
+          "cord",
+          "fakecas",
+          "okstate",
+          "orcid"
+        ]
+      ],
+      "permitUndefined": false
+    }
+  }
+}

src/main/resources/static/css/cas.css

@@ -798,24 +798,39 @@ body {
     max-width: 360px;
 }
 
-.service-ui .service-ui-info {
-    display: none;
+.service-ui .service-ui-logo-branded {
+    max-height: 48px;
+    max-width: 360px;
 }
 
 .service-ui .osf-shield-with-name {
     margin: 0 auto;
     padding-bottom: 1rem;
 }
 
+.osf-shield-with-name-branded {
+    width: 1px;
+}
+
 .osf-shield-with-name .service-ui-logo {
     padding-right: 0.5rem;
 }
 
+.osf-shield-with-name .service-ui-logo-branded {
+    padding-right: 1rem;
+}
+
 .osf-shield-with-name .service-ui-name {
     font-size: 2.25rem;
     font-weight: bold;
 }
 
+.osf-shield-with-name .service-ui-name-branded {
+    font-size: 2rem;
+    font-weight: normal;
+    white-space: nowrap;
+}
+
 .text-with-mdi,
 .text-without-mdi {
     font-size: 1rem;
@@ -1119,6 +1134,10 @@ body {
     .osf-shield-with-name .service-ui-name {
         font-size: 2rem;
     }
+
+    .osf-shield-with-name .service-ui-name-branded {
+        font-size: 1.75rem;
+    }
 }
 
 @media all and (max-width: 511.99px) {
@@ -1147,6 +1166,10 @@ body {
     .form-button-inline .delegation-button-label {
         font-size: 1rem;
     }
+
+    .osf-shield-with-name .service-ui-name-branded {
+        white-space: normal;
+    }
 }
 
 @media all and (max-width: 399.99px) {
@@ -1163,6 +1186,10 @@ body {
         font-size: 1.75rem;
     }
 
+    .osf-shield-with-name .service-ui-name-branded {
+        font-size: 1.5rem;
+    }
+
     .login-section .mdi-before-text,
     .login-error-card .mdi-before-text {
         display: none;