Feature/nym connect experimental software text (#2692)

* use experimental text

nym-connect/src-tauri/tauri.conf.json

@@ -65,7 +65,7 @@
       {
         "title": "NymConnect",
         "width": 240,
-        "height": 540,
+        "height": 575,
         "resizable": false,
         "decorations": false,
         "transparent": true

nym-connect/src/components/AppVersion.tsx

@@ -6,7 +6,11 @@ export const AppVersion = () => {
   const { appVersion } = useClientContext();
 
   return (
-    <Typography fontSize="small" textAlign="center" sx={{ color: 'grey.600' }}>
+    <Typography
+      fontSize="small"
+      textAlign="center"
+      sx={{ color: 'grey.600', position: 'absolute', bottom: 10, width: '100%' }}
+    >
       Version {appVersion}
     </Typography>
   );

nym-connect/src/components/AppWindowFrame.tsx

@@ -9,10 +9,9 @@ export const AppWindowFrame: React.FC = ({ children }) => (
       display: 'grid',
       borderRadius: '12px',
       // screen height is 540px - These should add up to that
-      gridTemplateRows: '40px 470px 30px',
+      gridTemplateRows: '40px 1fr 30px',
       bgcolor: 'nym.background.dark',
       height: '100vh',
-      gridtemplateAreas: '"." "." "."',
     }}
   >
     <CustomTitleBar />

nym-connect/src/components/ConnectionButton.tsx

@@ -76,9 +76,9 @@ export const ConnectionButton: React.FC<{
   return (
     <svg
       opacity={disabled ? 0.75 : 1}
-      width="208"
-      height="208"
-      viewBox="0 0 208 208"
+      width="200"
+      height="200"
+      viewBox="0 0 200 200"
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
     >

nym-connect/src/layouts/DefaultLayout.tsx

@@ -31,9 +31,14 @@ export const DefaultLayout: React.FC<{
     <Box pt={1}>
       {error && <InfoModal show title={error.title} description={error.message} onClose={clearError} />}
       <ConnectionStatus status={ConnectionStatusKind.disconnected} />
-      <Typography fontWeight="400" fontSize="16px" textAlign="center" pt={2}>
-        Connect to the Nym <br /> mixnet for privacy.
-      </Typography>
+      <Box px={2}>
+        <Typography fontWeight="400" fontSize="16px" textAlign="center" mb={1}>
+          Connect to the Nym mixnet
+        </Typography>
+        <Typography textAlign="center" fontSize="small" sx={{ color: 'grey.500' }}>
+          This is experimental software. Do not rely on it for strong anonymity (yet).
+        </Typography>
+      </Box>
       <ServiceProviderSelector services={services} onChange={handleServiceProviderChange} currentSp={currentSp} />
       <ConnectionTimer />
       <ConnectionButton