fix for circular logo background

src/views/base/index.vue

@@ -227,17 +227,20 @@ function setRoute(val: string) {
 
     .main_in {
       width: 70px;
-      aspect-ratio: 1 / 1;
+      height: 70px;
+      flex-shrink: 0;
+      align-self: center;
 
       .circle_in {
         margin-top: -10px;
-        border-radius: 100%;
-        height: 100%;
-        width: 100%;
+        border-radius: 50%;
+        width: 70px;
+        height: 70px;
+        flex-shrink: 0;
         z-index: 20;
         display: flex;
-        //border: 1px dashed primary;
         justify-content: center;
+        align-items: center;
         align-content: center;
         flex-wrap: wrap;
         background-color: @App-primary-color;
@@ -245,10 +248,10 @@ function setRoute(val: string) {
         .circle_into {
           overflow: hidden;
         @apply bg-primary;
-          border-radius: 100%;
+          border-radius: 50%;
           width: 56px;
           height: 56px;
-          aspect-ratio: 1 / 1;
+          flex-shrink: 0;
           display: flex;
           justify-content: center;
           align-content: center;
@@ -280,9 +283,9 @@ function setRoute(val: string) {
     position: relative;
 
     .circle {
-      border-radius: 100%;
-      height: 100%;
-      width: 100%;
+      border-radius: 50%;
+      height: 70px;
+      width: 70px;
       z-index: 20;
       //border: 1px dashed primary;
       box-shadow: 0px -5px 4px -2px #0000001A;