Compare commits

...

2 Commits

Author SHA1 Message Date
9d5da85e8f Adjusted image styling in Template component to include top margin for better visual alignment.
Some checks failed
ci / Check if version upgrade (push) Has been cancelled
ci / create_github_release (push) Has been cancelled
ci / test (push) Has been cancelled
2025-08-14 01:32:38 +01:00
72a51361da Small UI Changes 2025-08-14 01:30:51 +01:00

View File

@ -181,7 +181,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
)} )}
</> </>
)} )}
<Flex vertical gap={"middle"}> <Flex vertical gap={"22px"}>
<Card <Card
style={{ style={{
background: darkMode ? "#00000025" : "#fffffff2", background: darkMode ? "#00000025" : "#fffffff2",
@ -206,7 +206,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
<img <img
src="https://cdn.tombutcher.work/logos/logo-auth.png" src="https://cdn.tombutcher.work/logos/logo-auth.png"
alt="Logo" alt="Logo"
style={{ width: "60%", margin: "0", marginBottom: "4px" }} style={{ width: "60%", marginBottom: "4px", marginTop: "4px" }}
/>{" "} />{" "}
<Divider style={{ margin: "4px 0" }} /> <Divider style={{ margin: "4px 0" }} />
</Flex> </Flex>
@ -269,7 +269,6 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
{children} {children}
{isMobile && ( {isMobile && (
<Flex gap={"large"} justify="center"> <Flex gap={"large"} justify="center">
{client.name && <FooterCard darkMode={darkMode}>{clientInfo}</FooterCard>}
{auth !== undefined && auth.showTryAnotherWayLink && ( {auth !== undefined && auth.showTryAnotherWayLink && (
<FooterCard darkMode={darkMode}>{showTryAnotherWayLink}</FooterCard> <FooterCard darkMode={darkMode}>{showTryAnotherWayLink}</FooterCard>
)} )}
@ -277,6 +276,12 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
</Flex> </Flex>
)} )}
</Flex> </Flex>
{client.name && isMobile && (
<Flex justify="center" style={{ marginTop: "18px" }}>
{clientInfo}
</Flex>
)}
</Flex> </Flex>
</Card> </Card>
{!isMobile && ( {!isMobile && (
@ -323,7 +328,7 @@ function FooterCard({ children, darkMode = false }: { children?: ReactNode; dark
background: isMobile ? "unset" : darkMode ? "#00000025" : "#fffffff2", background: isMobile ? "unset" : darkMode ? "#00000025" : "#fffffff2",
borderRadius: "20px", borderRadius: "20px",
zIndex: 1, zIndex: 1,
padding: isMobile ? "4px 0px" : "10px 18px", padding: isMobile ? "4px 0px" : "8px 18px",
boxShadow: isMobile ? "unset" : darkMode ? "0px 5px 20px 5px rgb(255 255 255 / 5%)" : "0px 5px 15px 5px rgb(0 0 0 / 10%)" boxShadow: isMobile ? "unset" : darkMode ? "0px 5px 20px 5px rgb(255 255 255 / 5%)" : "0px 5px 15px 5px rgb(0 0 0 / 10%)"
}} }}
variant="borderless" variant="borderless"