style: Adjust component styles for improved layout and spacing

equinor · Dec 17, 2024 · 4081fec · 4081fec
1 parent 31b946f
commit 4081fec
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 7 deletions.
diff --git a/client/apps/portal-administration/src/components/AgStyle.tsx b/client/apps/portal-administration/src/components/AgStyle.tsx
@@ -24,7 +24,7 @@ export const AgStyles = {
 	TableContent: styled.div`
 		padding-top: 1rem;
 		position: relative;
-		height: calc(100% - 3rem);
+		height: calc(100% - 1rem);
 		width: 100%;
 	`,
 

diff --git a/client/apps/portal-administration/src/components/PortalApps/ActionBar.tsx b/client/apps/portal-administration/src/components/PortalApps/ActionBar.tsx
@@ -83,7 +83,10 @@ export const ActionBar = ({ selection }: { selection: PortalApplication[] }) =>
 				<Styles.Actions>
 					<Typography variant="overline">Portal Application Actions</Typography>
 					{hadNoVersion ? (
-						<Message title="One ore more selected applications have no build version" type="Warning" />
+						<Styles.Row>
+							<RemoveAppsButton selection={selection} removeApps={removeSelected} />
+							<Message title="One ore more selected applications have no build version" type="Warning" />
+						</Styles.Row>
 					) : (
 						<Styles.Row>
 							<ActivateSelectedButton selection={selection} activateSelected={activateSelected} />

diff --git a/client/apps/portal-administration/src/components/Router/RouterTree.tsx b/client/apps/portal-administration/src/components/Router/RouterTree.tsx
@@ -9,7 +9,7 @@ import { TreeRoot } from '../Tree/TreeRoot';
 
 const Style = {
 	Router: styled.span`
-		margin: 1rem 0 2rem 0;
+		margin-top: 1rem;
 		padding: 1rem;
 
 		background-color: ${tokens.colors.ui.background__medium.hex};

diff --git a/client/apps/portal-administration/src/pages/Portal.tsx b/client/apps/portal-administration/src/pages/Portal.tsx
@@ -16,12 +16,11 @@ const Styles = {
 		flex-direction: column;
 		padding: 1rem;
 		display: flex;
-		height: 100%;
+		height: calc(100% - 2rem);
 	`,
 	Wrapper: styled.div`
 		display: block;
 		height: 100%;
-		overflow: hidden;
 	`,
 };
 

diff --git a/client/apps/portal-administration/src/utils/syntaxHighlightJson.tsx b/client/apps/portal-administration/src/utils/syntaxHighlightJson.tsx
@@ -5,11 +5,12 @@ export const CodeStyle = styled.pre`
 	background-color: #242a2d;
 	border: 2px solid #3a3d3e;
 	color: #ffffff;
-	padding: 1.5rem;
+	padding: 2rem;
 	font-family: monospace;
 	max-height: -webkit-fill-available;
-	margin-bottom: 4rem;
+	margin-bottom: 0.5rem;
 	overflow: auto;
+	max-height: calc(100vh - 350px);
 	.key {
 		color: rgb(156, 220, 254);
 	}