edit css

2026-03-25 12:42:54 +03:30
parent 75779ff28e
commit 44323d9a0e
5 changed files with 132 additions and 98 deletions
--- a/index.html
+++ b/index.html
@@ -3,7 +3,10 @@
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+    />
    <title>بیمارستان شمال</title>
  </head>
  <body>
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -19,7 +19,7 @@ function App() {
    setError(null);
    try {
      const data = await axios
-        .get("http://10.1.20.234:5000/api/v1/get")
+        .get("http://10.1.1.127:8001/api/v1/get")
        .then((res) => res.data);
      setData(data?.data);
      setError(null);
--- a/src/index.css
+++ b/src/index.css
@@ -1,35 +1,34 @@
-
@font-face {
-  font-family: 'vazir';
-  src: url('/vazir/Vazirmatn-Regular.woff2');
+  font-family: "vazir";
+  src: url("/vazir/Vazirmatn-Regular.woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
 }
@font-face {
-  font-family: 'vazir';
-  src: url('/vazir/Vazirmatn-Medium.woff2');
+  font-family: "vazir";
+  src: url("/vazir/Vazirmatn-Medium.woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
 }
@font-face {
-  font-family: 'vazir';
-  src: url('/vazir/Vazirmatn-Bold.woff2');
+  font-family: "vazir";
+  src: url("/vazir/Vazirmatn-Bold.woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
 }
@font-face {
-  font-family: 'vazir';
-  src: url('/vazir/Vazirmatn-SemiBold.woff2');
+  font-family: "vazir";
+  src: url("/vazir/Vazirmatn-SemiBold.woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
 }
@font-face {
-  font-family: 'vazir';
-  src: url('/vazir/Vazirmatn-Light.woff2');
+  font-family: "vazir";
+  src: url("/vazir/Vazirmatn-Light.woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
@@ -48,21 +47,14 @@
  -moz-osx-font-smoothing: grayscale;
 }

-
-
-
 body {
  background-color: #fff;
+  min-height: 92vh;
+  overflow: hidden; /* جلوگیری از اسکرول کل صفحه */
  margin: 0;
-    min-height: 100vh;
+  padding: 0;
 }

-
-
-
-
-
-
 .mainBox {
  background-color: #373fd6;
  color: #fff;
@@ -74,54 +66,75 @@ body {
  font-size: 2rem;
  padding: 0 24px;
 }
+/* تنظیم ارتفاع کلی صفحه با کسر نوارهای تلویزیون */
 .contentBox {
-  height: calc(100vh - 50px);
  width: 100%;
-  display: grid;
-  grid-template-rows: repeat(4,minmax(0,1fr)) !important;
+  height: calc(100vh - 60px);
+  display: flex;
+  flex-direction: column;
  gap: 5px;
-  
-  
+  box-sizing: border-box; /* حتما اضافه شود */
+  padding: 10px;
 }
+
 .contentBoxRow {
  background-color: #d9dbfc;
-  display: grid;
  width: 100%;
-  grid-template-columns: repeat(12,1fr);
  height: 100%;
-  overflow: hidden;
-  min-height: 0;

+  /* مهم: این خط اضافه شد تا فرزندان کنار هم قرار بگیرند */
+  display: flex;
+  align-items: center; /* عمودی وسط چین */
+  gap: 20px; /* فاصله بین دایره وضعیت و اسلایدر */
+
+  overflow: hidden;
+  min-height: 0; /* بسیار مهم برای فیکس شدن ارتفاع در فلکس */
+  flex: 1;
 }

+/* استایل باکس وضعیت (دایره سمت راست) */
 .statusBox {
-  
+  /* ارتفاع را خودکار بگذارید تا توسط فلکس کنترل شود یا 100% */
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
-  grid-column: span 2;
+
+  /* اگر می‌خواهید عرض ثابت داشته باشد */
+  flex-shrink: 0;
+  width: 180px;
 }
+
+/* استایل دایره وضعیت */
 .status {
  border-radius: 50%;
  background-color: #a2a6f7;
- width: 200px;
-  aspect-ratio: 1/1;
+
+  /* جایگزین aspect-ratio برای تلویزیون */
+  width: 160px;
+  height: 160px;
+
  text-align: center;
  color: #373fd6;
  font-size: 2rem;
  font-weight: bold;
-  display: grid;
-  place-items: center;
+
+  /* جایگزین place-items برای تلویزیون */
+  display: flex;
+  justify-content: center;
+  align-items: center;

  padding: 0 8px;
+  box-sizing: border-box;
+  word-wrap: break-word; /* برای شکستن کلمات طولانی */
 }
+
+/* استایل ردیف اطلاعات (اسلایدر) */
 .infoRow {
-    grid-column: span 10;
-  display: flex;
-  align-items: center;
+  flex: 1; /* باقی فضای خالی را پر کند */
+  height: 100%;
+  overflow: hidden;
  position: relative;
-  padding:4px 0;
 }
 .infoBox {
  background-color: white;
@@ -132,7 +145,6 @@ body {
  align-items: center;
  justify-content: center;
  flex-direction: column;
-  
 }
 .info-row-1 {
  display: flex;
@@ -164,32 +176,56 @@ body {
  gap: 1rem;
 }

-.col-1{grid-column: span 1;}
-.col-2{grid-column: span 2;}
-.col-3{grid-column: span 3;}
-.col-4{grid-column: span 4;}
-.col-5{grid-column: span 5;}
-.col-6{grid-column: span 6;}
-.col-7{grid-column: span 7;}
-.col-8{grid-column: span 8;}
-.col-9{grid-column: span 9;}
-.col-10{grid-column: span 10;}
-.col-11{grid-column: span 11;}
-.col-12{grid-column: span 12;}
-
+.col-1 {
+  grid-column: span 1;
+}
+.col-2 {
+  grid-column: span 2;
+}
+.col-3 {
+  grid-column: span 3;
+}
+.col-4 {
+  grid-column: span 4;
+}
+.col-5 {
+  grid-column: span 5;
+}
+.col-6 {
+  grid-column: span 6;
+}
+.col-7 {
+  grid-column: span 7;
+}
+.col-8 {
+  grid-column: span 8;
+}
+.col-9 {
+  grid-column: span 9;
+}
+.col-10 {
+  grid-column: span 10;
+}
+.col-11 {
+  grid-column: span 11;
+}
+.col-12 {
+  grid-column: span 12;
+}

@media screen and (max-width: 1024px) {
-  .mainBox{font-size: 20px;}
+  /* .mainBox {
+    font-size: 20px;
+  } */

-  .contentBox{
+  /* .contentBox {
    grid-template-rows: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
-
-  }
-  .status{
+  } */
+  /* .status {
    font-size: 1.2rem;
    width: 90px;
-  }
+  } */

  .info-row-1 span:first-child {
    font-size: 13px;
@@ -200,7 +236,6 @@ body {
    direction: ltr !important;
    color: #000;
  }
-
 }

 .infoRow .swiper {
@@ -240,5 +275,4 @@ body {
 }
 #infoSliderNavigationPrev svg {
  transform: rotate(-180deg) !important;
-
 }
--- a/src/service/callApi.js
+++ b/src/service/callApi.js
@@ -1,7 +1,7 @@
 import axios from "axios";

 const CallApi = axios.create({
-    baseURL:'http://10.1.20.234:5000/api/v1'
+    baseURL:'http://10.1.1.127:8001/api/v1'
 })


--- a/vite.config.js
+++ b/vite.config.js
@@ -4,8 +4,5 @@ import react from '@vitejs/plugin-react'
 // https://vite.dev/config/
 export default defineConfig({
  plugins: [react()],
-  // server:{
-  //   host:'10.1.21.12',
-  //   port:5173
-  // }
+
 })