diff --git a/src/App/App.css b/src/App/App.css index e5e6a63..841ff5b 100644 --- a/src/App/App.css +++ b/src/App/App.css @@ -5,35 +5,43 @@ body { sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; + background-color: #242424; } .App { + display: flex; + justify-content: center; + align-items: center; + height: 100vh; +} + +.App-payload { + text-align: center; + margin-bottom: 4rem; + color: white; + /* link color */ + a { + color: #61dafb; + } + +} + +.App-logo-wrapper { text-align: center; } .App-logo { - height: 40vmin; + height: 15vmin; pointer-events: none; } @media (prefers-reduced-motion: no-preference) { - .App-logo { + .App-logo.rotate { animation: App-logo-spin infinite 20s linear; } } -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; -} - .App-link { color: #61dafb; } diff --git a/src/App/App.tsx b/src/App/App.tsx index c146dbf..521960d 100644 --- a/src/App/App.tsx +++ b/src/App/App.tsx @@ -1,6 +1,6 @@ import "./App.css"; -import logo from "./logo.svg"; -import myimg from "./myimg.png"; +import reactSvgUrl from "./assets/react.svg"; +import viteSvgUrl from "./assets/vite.svg"; import { OidcProvider, useOidc, getKeycloakAccountUrl } from "./oidc"; export default function App() { @@ -24,49 +24,52 @@ function ContextualizedApp() { return (
-
- {isUserLoggedIn ? - ( - <> +
+
+ {isUserLoggedIn ? + ( + <> -

Hello {oidcTokens.decodedIdToken.name} !

- - Link to your Keycloak account - - - - - ) - : - ( - - ) - } - logo - test_image -

Hello world

-

Check out all keycloak pages in the Storybook!

-

Once you've identified the ones you want to customize run npx eject-keycloak-page

-
+ + + ) + : + ( + + ) + } +
+
+ logo +     + logo +
+ ); } -function Jwt(){ +function Jwt() { const { oidcTokens } = useOidc({ assertUserLoggedIn: true diff --git a/src/App/assets/react.svg b/src/App/assets/react.svg new file mode 100644 index 0000000..6c87de9 --- /dev/null +++ b/src/App/assets/react.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/App/assets/vite.svg b/src/App/assets/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/src/App/assets/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/App/logo.svg b/src/App/logo.svg deleted file mode 100644 index 9dfc1c0..0000000 --- a/src/App/logo.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/App/myimg.png b/src/App/myimg.png deleted file mode 100644 index 6756d2c..0000000 Binary files a/src/App/myimg.png and /dev/null differ