fix styles for single-card (Angular, Vue)

Author: GoodDayForSurf

packages/devextreme-cli/src/templates/vue-v3/application/src/layouts/single-card.vue

@@ -46,10 +46,11 @@ export default {
   height: 100%;
 
   .dx-card {
-    width: 330px;
+    width: 360px;
     margin: auto auto;
-    padding: 40px;
+    padding: 24px;
     flex-grow: 0;
+    border-radius: 8px;
 
     .screen-x-small & {
       width: 100%;
@@ -62,11 +63,12 @@ export default {
     }
 
     .header {
-      margin-bottom: 30px;
+      margin: 24px 0;
 
       .title {
         color: var(--base-text-color);
-        line-height: 28px;
+        text-align: center;
+        line-height: 24px;
         font-weight: 500;
         font-size: 24px;
       }

packages/devextreme-schematics/src/add-layout/files/src/app/layouts/single-card/single-card.component.scss

@@ -5,10 +5,11 @@
 
 .single-card {
   .dx-card {
-    width: 330px;
+    width: 360px;
     margin: auto auto;
-    padding: 40px;
+    padding: 24px;
     flex-grow: 0;
+    border-radius: 8px;
 
     :host-context(.screen-x-small) & {
       width: 100%;
@@ -21,13 +22,14 @@
     }
 
     .header {
-      margin-bottom: 30px;
+      margin: 24px 0;
 
       .title {
         color: var(--base-text-color);
-        line-height: 28px;
         font-weight: 500;
         font-size: 24px;
+        text-align: center;
+        line-height: 24px;
       }
 
       .description {