Spaces:

ftx7go
/

bone-fracture-detection-model

Sleeping

App Files Files Community

ftx7go commited on Mar 9

Commit

1142d9c

verified ·

1 Parent(s): bb54d38

Upload re.html

Browse files

Files changed (1) hide show

templates/re.html +313 -0

templates/re.html ADDED Viewed

	@@ -0,0 +1,313 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Bone Fracture Detection Form</title>
+    <style>
+        * {
+            box-sizing: border-box;
+            margin: 0;
+            padding: 0;
+        }
+        body {
+            font-family: Arial, sans-serif;
+            background-color: #AAEEBB;
+            padding: 40px; /* Small padding to avoid touching screen edges completely */
+        }
+        form {
+            width: 100%;
+            background: #C2FC20;
+            padding: 15px;
+            border-radius: 0; /* Remove border radius to fully extend */
+            box-shadow: none; /* Remove shadow for full-width look */
+        }
+        fieldset {
+            border: 1px solid #000;
+            margin-bottom: 10px;
+            padding: 10px;
+        }
+        legend {
+            font-weight: bold;
+            font-size: 25px;
+        }
+        .form-group {
+            display: flex;
+            flex-wrap: wrap;
+            justify-content: space-between;
+            margin-bottom: 8px;
+        }
+        .form-group label {
+            flex: 1;
+            font-size: 14px;
+            margin-right: 5px;
+            min-width: 100px;
+        }
+        .form-group input,
+        .form-group select,
+        .form-group textarea {
+            flex: 2;
+            padding: 5px;
+            border: 1px solid #000;
+            border-radius: 5px;
+            width: 100%;
+        }
+        textarea {
+            resize: none;
+            height: 50px;
+        }
+        input[type="file"] {
+            width: 100%;
+        }
+        input[type="submit"] {
+            width: 100%;
+            background: seagreen;
+            color: white;
+            padding: 10px;
+            font-size: 16px;
+            border: none;
+            cursor: pointer;
+            border-radius: 5px;
+            margin-top: 10px;
+        }
+        input[type="submit"]:hover {
+            background: green;
+        }
+ .cancel-btn {
+            background: red;
+            color: white;
+        }
+        .submit-btn {
+            background: seagreen;
+            color: white;
+        }
+        .download-btn {
+            background: blue;
+            color: white;
+        /* Responsive Design */
+        @media (max-width: 480px) {
+            .form-group {
+                flex-direction: column;
+            }
+            .form-group label,
+            .form-group input,
+            .form-group select,
+            .form-group textarea {
+                width: 100%;
+            }
+        }
+    </style>
+</head>
+<body>
+    <form action="submit_report.html" method="post" enctype="multipart/form-data">
+      <img src="0.png" alt="Hospital Logo" class="logo" style="height: 290px;">
+<p>A <u>radiologist</u> is a doctor who specializes in reading medical images like X-rays, MRIs, and CT scans to diagnose diseases and injuries. They help other doctors understand what’s happening inside the body and suggest treatments.
+</p>
+<h3><p>X-Ray</p></h3>
+<p>X-rays, or plain radiographs, are a way for providers to get pictures of the inside of your body. X-rays use radiation to create black-and-white images that a radiologist reads. X-rays are most commonly used to look at bones and joints, but providers can use them to quickly diagnose other conditions, like lung infections, too.</p>
+<p></p>
+<img src="x.jpg" alt="Hospital Logo" class="logo" style="height: 300px;">
+  <h1>Bone Fractures</h1>
+  <p>A fracture is a break or crack in a bone, caused by excessive force.</p>
+  <h2>Causes</h2>
+  <ul>
+    <li>Traumatic incidents (sports injuries, accidents, falls)</li>
+    <li>Osteoporosis, cancer (weakened bones)</li>
+  </ul>
+  <h2>Symptoms</h2>
+  <ul>
+    <li>Pain, swelling, bruising</li>
+    <li>Deformity, inability to use the limb</li>
+  </ul>
+<img src="j.jpeg" alt="Hospital Logo" class="logo" style="height: 500px;">
+  <h2>Types of Fractures</h2>
+  <ul>
+    <li>Closed (simple): Bone doesn't pierce skin.</li>
+    <li>Open (compound): Bone breaks skin.</li>
+    <li>Greenstick: Partial crack (common in children).</li>
+    <li>Hairline: Stress fracture.</li>
+    <li>Complicated: Damage to surrounding tissues.</li>
+    <li>Comminuted: Bone shattered into pieces.</li>
+    <li>Avulsion: Tendon pulls bone fragment.</li>
+    <li>Compression: Bones forced together.</li>
+  </ul>
+  <h2>Complications</h2>
+  <ul>
+    <li>Blood loss, organ/tissue damage</li>
+    <li>Stunted bone growth (in children)</li>
+    <li>Infection</li>
+  </ul>
+  <h2>First Aid</h2>
+  <ul>
+    <li>Immobilize the injured area.</li>
+    <li>Control bleeding, cover wounds.</li>
+    <li>Don't straighten broken bones.</li>
+    <li>Use splints, slings for support.</li>
+    <li>Apply cold pack.</li>
+    <li>Seek medical help immediately (call emergency).</li>
+  </ul>
+  <h2>Diagnosis</h2>
+  <ul>
+    <li>X-rays, CT scans, MRI scans</li>
+  </ul>
+  <h2>Treatment</h2>
+  <ul>
+    <li>Splints, braces, plaster casts</li>
+    <li>Traction, surgical rods/plates</li>
+    <li>Pain relief</li>
+  </ul>
+  <h2>Post-Operation Care</h2>
+  <ul>
+    <li>Check for feeling, circulation.</li>
+    <li>Pain management.</li>
+    <li>Keep the injured area still.</li>
+  </ul>
+  <h2>Healing Process</h2>
+  <ul>
+    <li>Blood clots form, then callus (fibrous cells and cartilage).</li>
+    <li>Callus replaced by real bone.</li>
+    <li>Follow doctor's instructions for recovery.</li>
+  </ul>
+  <h2>Self-Care</h2>
+  <ul>
+    <li>Avoid direct heat on cast.</li>
+    <li>Rest the limb.</li>
+    <li>Use crutches correctly.</li>
+    <li>Don't lift or drive until healed.</li>
+    <li>Don't insert objects into cast.</li>
+    <li>Keep cast dry.</li>
+    <li>Seek immediate medical attention for complications.</li>
+  </ul>
+  <h2>Long-Term Outlook</h2>
+  <ul>
+    <li>Healing takes weeks to months.</li>
+    <li>Rehabilitation exercises may be needed.</li>
+    <li>Follow-up x-rays to monitor healing.</li>
+  </ul>
+  <h2>Where to Get Help</h2>
+  <ul>
+    <li>Your GP</li>
+    <li>Urgent Care Clinics</li>
+    <li>Nurse-on-Call</li>
+    <li>Emergency services (call emergency).</li>
+  </ul>
+        <h1>Patient Information Form</h1>
+        <fieldset>
+            <legend>Personal Info</legend>
+            <div class="form-group">
+                <label>First Name:</label>
+                <input type="text" name="first_name" required>
+                <label>____Surname:</label>
+                <input type="text" name="surname" required>
+            </div>
+            <div class="form-group">
+                <label>Father's Name:</label>
+                <input type="text" name="father_name" required>
+                <label>____Mother's Name:</label>
+                <input type="text" name="mother_name" required>
+            </div>
+            <div class="form-group">
+                <label>Age:</label>
+                <input type="number" name="age" min="0" required>
+                <label>____Weight (kg):</label>
+                <input type="number" name="weight" min="0" required>
+            </div>
+            <div class="form-group">
+                <label>Height (cm):</label>
+                <input type="number" name="height" min="0" required>
+                <label>_____Gender:</label>
+                <select name="gender" required>
+                    <option value="male">Male</option>
+                    <option value="female">Female</option>
+                    <option value="other">Other</option>
+                </select>
+            </div>
+            <div class="form-group">
+                <label>Passport Photo:</label>
+                <input type="file" name="photo" accept="image/*" required>
+            </div>
+        </fieldset>
+        <fieldset>
+            <legend>Contact Details</legend>
+            <div class="form-group">
+                <label>Phone:</label>
+                <input type="tel" name="phone" required>
+                <label>_________Email:</label>
+                <input type="email" name="email" required>
+            </div>
+            <div class="form-group">
+                <label>Address:_______________________________________</label>
+                <textarea name="address" required></textarea>
+            </div>
+            <div class="form-group">
+                <label>Marital Status:</label>
+                <select name="marital_status" required>
+                    <option value="single">Single</option>
+                    <option value="married">Married</option>
+                    <option value="divorced">Divorced</option>
+                    <option value="widowed">Widowed</option>
+                </select>
+            </div>
+        </fieldset>
+        <fieldset>
+            <legend>Medical Info</legend>
+            <div class="form-group">
+                <label>Cause of Injury:</label>
+                <textarea name="injury_cause" required></textarea>
+            </div>
+            <div class="form-group">
+                <label>Do you have Insurance?</label>
+                <select name="insurance" required>
+                    <option value="yes">Yes</option>
+                    <option value="no">No</option>
+                </select>
+            </div>
+            <div class="form-group">
+                <label>Allergies?</label>
+                <select name="allergies" required>
+                    <option value="yes">Yes</option>
+                    <option value="no">No</option>
+                </select>
+            </div>
+        </fieldset>
+        <fieldset>
+            <legend>X-ray Upload</legend>
+            <div class="form-group">
+                <label>Side View:</label>
+                <input type="file" name="xray_side" accept="image/*" required>
+            </div>
+            <div class="form-group">
+                <label>Top View:</label>
+                <input type="file" name="xray_top" accept="image/*" required>
+            </div>
+        </fieldset>
+        <div class="button-group">
+    <button type="button" class="cancel-btn" onclick="document.querySelector('form').reset();" style="font-size: 26px; padding: 10px 20px;">Cancel</button>
+    <button type="submit" class="submit-btn" style="font-size: 26px; padding: 10px 20px;">Submit</button>
+    <button type="button" class="download-btn" onclick="window.location.href='report.pdf';" style="font-size: 26px; padding: 10px 20px;">Download Report (PDF)</button>
+</div>
+    </form>
+</body>
+</html>