change fonts to be same in diff and in definition tabs (#133)

change diff tab layout to use flex style

CHANGELOG.md

@@ -8,7 +8,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [Unreleased]
 
 ## [3.2.1] - 2022-05-14
+
 ### Updated
+
 - Added react-refresh-webpack-plugin. It only executes in development mode: its setup is conditionally imported in server side, so its inclusion is omitted in production mode.
 - For the setup of the previous one, I've had to wrap all the server setup in a async function to make the conditional import works. It doesn't affect to any functionality.
 - Added source map loading for node_modules libraries.

README.md

@@ -168,7 +168,7 @@ docker-compose -f docker-compose.dev.yml up
 To have fast iteration of working on UI changes, you can avoid running node service in docker, and run only mysql & redis
 
 ```
-docker-compose -f docker-compose.light.yml up
+docker-compose -f docker-compose.light.yml up -d
 npm run develop
 ```
 
@@ -210,7 +210,9 @@ npm run test-functional
 ```
 
 ### Testing Dockerimage build
+
 If you change build process in Dockerfile or Dockerfile.CI, consider checking also testing it
+
 ```
 # run db
 docker-compose -f docker-compose.light.yml up

client/prism-material-light.css

@@ -1,7 +1,7 @@
 pre[class*="language-"],
 code[class*="language-"] {
 	color: #d4d4d4;
-	font-size: 13px;
+	font-size: 14px;
 	text-shadow: none;
 	font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
 	direction: ltr;

client/schema/service-details/CodeDiff.jsx

@@ -30,30 +30,25 @@ const newStyles = {
 		},
 	},
 	emptyGutter: {
-		'min-width': '1px',
-		padding: '0',
-	},
-	gutter: {
-		'min-width': '1px',
+		width: 'auto',
 	},
 	line: {
+		display: 'flex',
 		'line-height': '1',
-		'font-size': '13px',
+		'font-size': '14px',
 		'font-family': 'Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace',
 		'&:hover': {
 			background: '#000e95',
 		},
 	},
-	content: {
-		height: '18px',
-		width: 'auto',
-		pre: {
-			'line-height': '18px',
-		},
+	gutter: {
+		minWidth: '20px',
 	},
-	diffContainer: {
+	content: {
+		flexGrow: 1,
+		overflow: 'none',
 		pre: {
-			'line-height': '18px',
+			'font-family': 'Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace',
 		},
 	},
 	marker: {

client/style.css

@@ -3,6 +3,6 @@ body a {
 	color: inherit;
 }
 
-body * {
+body {
 	font-family: Source Sans Pro;
 }