Adjust idp theme (#71)

opencloud-eu · Jan 20, 2025 · b084943 · b084943
1 parent 0a9a484
commit b084943
Show file tree

Hide file tree

Showing 10 changed files with 36 additions and 47 deletions.
diff --git a/services/idp/Makefile b/services/idp/Makefile
@@ -32,17 +32,30 @@ ci-node-generate: assets
 .PHONY: assets
 assets: pnpm-build \
 		assets/identifier/static \
-		assets/identifier/static/favicon.ico
+		assets/identifier/static/favicon.ico \
+		assets/identifier/static/opentalk-500.woff2 \
+		assets/identifier/static/opentalk-750.woff2
 
 assets/identifier/static:
 	mkdir -p assets/identifier/static
 
-FAVICON_URL = https://raw.githubusercontent.com/owncloud/assets/main/favicon.ico
+# check if urls are stable, if not replace with stable location
+FAVICON_URL = https://opencloud.eu/themes/cloudy/src/assets/favicon/favicon.ico
+FONT_VARIATION_500_URL = https://gitlab.opencode.de/opentalk/web-frontend/-/raw/main/app/public/assets/fonts/opentalk/regular/opentalk-regular.woff2
+FONT_VARIATION_750_URL = https://gitlab.opencode.de/opentalk/web-frontend/-/raw/main/app/public/assets/fonts/opentalk/bold/opentalk-bold.woff2
 
 .PHONY: assets/identifier/static/favicon.ico # force overwrite
 assets/identifier/static/favicon.ico:
 	curl --fail -o assets/identifier/static/favicon.ico ${FAVICON_URL}
 
+.PHONY: assets/identifier/static/opentalk-500.woff2
+assets/identifier/static/opentalk-500.woff2:
+	curl --fail -o assets/identifier/static/opentalk-500.woff2 ${FONT_VARIATION_500_URL}
+
+.PHONY: assets/identifier/static/opentalk-750.woff2
+assets/identifier/static/opentalk-750.woff2:
+	curl --fail -o assets/identifier/static/opentalk-750.woff2 ${FONT_VARIATION_750_URL}
+
 .PHONY: pnpm-build
 pnpm-build: node_modules
 	#pnpm lint #TODO: activate

diff --git a/services/idp/public/index.html b/services/idp/public/index.html
@@ -1,6 +1,21 @@
 <!doctype html>
 <html lang="en">
   <head data-kopano-build="%REACT_APP_KOPANO_BUILD%">
+    <style>
+    @font-face {
+    font-family: OpenTalk;
+    src: url('%PUBLIC_URL%/static/opentalk-500.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+
+    }
+    @font-face {
+    font-family: OpenTalk;
+    src: url('%PUBLIC_URL%/static/opentalk-750.woff2') format('woff2');
+    font-weight: bold;
+    font-style: normal;
+    }
+    </style>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta name="theme-color" content="#1b223d">

diff --git a/services/idp/src/app.css b/services/idp/src/app.css
@@ -1,25 +1,18 @@
 /* additional css on top of kpop */
-@font-face {
-  font-family: Inter;
-  src: url(./fonts/inter.woff2) format('woff2'), url(./fonts/inter.ttf) format('truetype');
-  font-weight: 100 900;
-  font-style: oblique 0deg 12deg;
-}
-
 html {
   font-feature-settings: "cv11";
 }
 
 body {
-  font-family: Inter, sans-serif;
+  font-family: OpenTalk, sans-serif;
 }
 
 strong {
   font-weight: 600;
 }
 
 .oc-login-bg {
-  background-image: url(./images/background.jpg);
+  background-image: url(./images/background.png);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
@@ -101,9 +94,9 @@ strong {
 .oc-button-primary {
   /* Needs to be important to overwrite material-ui */
   width: 100%;
-  background: linear-gradient(to right, #2c588e, #4e85c8) -1px;
-  background-size: 103% !important;
+  background: #e2baff !important;
   border: 1px solid transparent !important;
+  color: #19353f !important;
 }
 
 .oc-checkbox-dark svg {

diff --git a/services/idp/src/components/ResponsiveScreen.jsx b/services/idp/src/components/ResponsiveScreen.jsx
@@ -63,7 +63,7 @@ const ResponsiveScreen = (props) => {
             </div>
         </div>
         <footer className="oc-footer-message">
-              <Trans i18nKey="konnect.footer.slogan"><strong>OpenCloud</strong> - a safe home for all your data</Trans>
+              <Trans i18nKey="konnect.footer.slogan"><strong>OpenCloud</strong> - excellent file sharing</Trans>
         </footer>
     </Grid>
   );

diff --git a/services/idp/src/fancy-background.css b/services/idp/src/fancy-background.css
@@ -12,6 +12,6 @@
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
-  background-image: url(./images/background.jpg);
+  background-image: url(./images/background.png);
   z-index: 0;
 }
diff --git a/services/idp/src/fonts/inter.ttf b/services/idp/src/fonts/inter.ttf
diff --git a/services/idp/src/fonts/inter.woff2 b/services/idp/src/fonts/inter.woff2
diff --git a/services/idp/src/images/background.jpg b/services/idp/src/images/background.jpg
diff --git a/services/idp/src/images/background.png b/services/idp/src/images/background.png
diff --git a/services/idp/src/images/loginscreen-bg.svg b/services/idp/src/images/loginscreen-bg.svg