File size: 9,221 Bytes
3339ed0
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<html>
  <head>
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="" />
    <link
      rel="stylesheet"
      as="style"
      onload="this.rel='stylesheet'"
      href="https://fonts.googleapis.com/css2?display=swap&amp;family=Noto+Sans%3Awght%40400%3B500%3B700%3B900&amp;family=Plus+Jakarta+Sans%3Awght%40400%3B500%3B700%3B800"
    />

    <title>Galileo Design</title>
    <link rel="icon" type="image/x-icon" href="data:image/x-icon;base64," />

    <script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
  </head>
  <body>
    <div
      class="relative flex size-full min-h-screen bg-[#FFFFFF] group/design-root overflow-x-hidden"
      style='--checkbox-tick-svg: url(&apos;data:image/svg+xml,%3csvg viewBox=%270 0 16 16%27 fill=%27rgb(255,255,255)%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z%27/%3e%3c/svg%3e&apos;); font-family: "Plus Jakarta Sans", "Noto Sans", sans-serif;'
    >
      <div class="layout-container flex h-full grow flex-col">
        <header class="flex items-center justify-between whitespace-nowrap border-b border-solid border-b-[#F4EFE6] px-10 py-3">
          <div class="flex items-center gap-4 text-[#1C160C]">
            <div class="size-4" style='background-image: url("./logo.png"); background-size: cover;'></div>
            <h2 class="text-[#1C160C] text-lg font-bold leading-tight tracking-[-0.015em]">Pikachu Therapy</h2>
          </div>
          <div class="flex flex-1 justify-end gap-8">
            <div class="flex items-center gap-9">
              <!-- <a class="text-[#1C160C] text-sm font-medium leading-normal hover:text-[#A18249]" href="#">Dashboard</a>
              <a class="text-[#1C160C] text-sm font-medium leading-normal hover:text-[#A18249]" href="#">Patient Records</a> -->
              <a class="text-[#1C160C] text-sm font-medium leading-normal hover:text-[#A18249]" href="page1.html">Dashboard</a>
              <a class="text-[#1C160C] text-sm font-medium leading-normal hover:text-[#A18249]" href="page2.html">Patient Records</a>            
            </div>
            <div
              class="bg-center bg-no-repeat aspect-square bg-cover rounded-full size-10"
              style='background-image: url("https://cdn.usegalileo.ai/stability/0d34b163-8777-46b0-a8e7-c1907d4f7f95.png");'
            ></div>
          </div>
        </header>
        <div class="flex flex-1">
          <div class="layout-content-container flex flex-col w-[240px] flex-none px-6 py-5">
            <div class="flex h-full min-h-[500px] flex-col justify-between bg-[#FFFFFF] p-4">
              <div class="flex flex-col gap-4">
                <div class="flex gap-3">
                  <div
                    class="bg-center bg-no-repeat aspect-square bg-cover rounded-full size-10"
                    style='background-image: url("https://cdn.usegalileo.ai/stability/b1ac6a7f-e08f-4831-93e4-20e61e202c08.png");'
                  ></div>
                  <div class="flex flex-col">
                    <h1 class="text-[#1C160C] text-base font-medium leading-normal">Patient</h1>
                    <p class="text-[#A18249] text-sm font-normal leading-normal">Hyeri Cho</p>
                  </div>
                </div>
                <div class="flex flex-col gap-2">
                  <div class="flex items-center gap-3 px-3 py-2">
                    <div class="text-[#1C160C]" data-icon="Gauge" data-size="24px" data-weight="fill">
                      <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
                        <path
                          d="M240,160v24a16,16,0,0,1-16,16H115.93a4,4,0,0,1-3.24-6.35L174.27,109a8.21,8.21,0,0,0-1.37-11.3,8,8,0,0,0-11.37,1.61l-72,99.06A4,4,0,0,1,86.25,200H32a16,16,0,0,1-16-16V161.13c0-1.79,0-3.57.13-5.33a4,4,0,0,1,4-3.8H48a8,8,0,0,0,8-8.53A8.17,8.17,0,0,0,47.73,136H23.92a4,4,0,0,1-3.87-5c12-43.84,49.66-77.13,95.52-82.28a4,4,0,0,1,4.43,4V80a8,8,0,0,0,8.53,8A8.17,8.17,0,0,0,136,79.73V52.67a4,4,0,0,1,4.43-4A112.18,112.18,0,0,1,236.23,131a4,4,0,0,1-3.88,5H208.27a8.17,8.17,0,0,0-8.25,7.47,8,8,0,0,0,8,8.53h27.92a4,4,0,0,1,4,3.86C240,157.23,240,158.61,240,160Z"
                        ></path>
                      </svg>
                    </div>
                    <p class="text-[#1C160C] text-sm font-medium leading-normal">Dashboard</p>
                  </div>
                  <div class="flex items-center gap-3 px-3 py-2 rounded-full bg-[#F4EFE6]">
                    <div class="text-[#1C160C]" data-icon="File" data-size="24px" data-weight="regular">
                      <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
                        <path
                          d="M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Z"
                        ></path>
                      </svg>
                    </div>
                    <p class="text-[#1C160C] text-sm font-medium leading-normal">Patient Records</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="layout-content-container flex flex-col flex-1 px-10 py-5">
            <div class="grid grid-cols-1 gap-6">
              <div class="flex min-w-72 flex-1 flex-col gap-4">
                <h3 class="text-[#1C160C] text-lg font-bold leading-tight border-b border-solid border-[#A18249] pb-2">Patient Information</h3>
                <div class="bg-[#FFFFFF] border border-[#A18249] p-4 rounded-md">
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Name: Hyeri Cho</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Age: 29</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Gender: Female</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Blood Type: O-</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">BMI: 30+</p>
                </div>
              </div>
              <div class="flex min-w-72 flex-1 flex-col gap-4">
                <h3 class="text-[#1C160C] text-lg font-bold leading-tight border-b border-solid border-[#A18249] pb-2">Prescription</h3>
                <div class="bg-[#FFFFFF] border border-[#A18249] p-4 rounded-md">
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">1. Metformin (500mg)</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">2. Orlistat (120mg)</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">3. Atorvastatin (10mg)</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">4. Saxenda</p>
                  
                </div>
              </div>
            </div>            
          </div>
          <div class="layout-content-container flex flex-col flex-1 px-10 py-5">
            <div class="grid grid-cols-1 gap-6">
              <div class="flex min-w-72 flex-1 flex-col gap-4">
                <h3 class="text-[#1C160C] text-lg font-bold leading-tight border-b border-solid border-[#A18249] pb-2">Medical History</h3>
                <div class="bg-[#FFFFFF] border border-[#A18249] p-4 rounded-md">
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Diabetes Mellitus</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Hypertension</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Asthma</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">Hyperlipidemia</p>
                  <!-- <p class="text-[#1C160C] text-sm font-medium leading-normal">Medical History: Hypertension, Diabetes</p> -->
                </div>
              </div>
              <div class="flex min-w-72 flex-1 flex-col gap-4">
                <h3 class="text-[#1C160C] text-lg font-bold leading-tight border-b border-solid border-[#A18249] pb-2">etc</h3>
                <div class="bg-[#FFFFFF] border border-[#A18249] p-4 rounded-md">
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">1</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">2</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">3</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal">4</p>
                  <p class="text-[#1C160C] text-sm font-medium leading-normal"> add...</p>
                </div>
              </div>
            </div>            
          </div>

        </div>
        <footer class="flex flex-col gap-6 px-5 py-10 text-center justify-center items-center">
          <p class="text-[#A18249] text-base font-normal leading-normal">Copyright 2024 Pikachu Therapy</p>
        </footer>
      </div>
    </div>
  </body>
</html>