GD-ML/AndroidCode

1<!DOCTYPE html>2<html>3<head>4<meta charset="UTF-8">5<meta name="viewport" content="width=1080, initial-scale=1.0">6<title>UI Render</title>7<style>8  body {9    margin: 0;10    padding: 0;11    background: transparent;12    font-family: Roboto, Arial, sans-serif;13  }14  #render-target {15    position: relative;16    width: 1080px;17    height: 2400px;18    overflow: hidden;19    background: #FFFFFF;20  }21 22  /* Status bar */23  .status-bar {24    position: absolute;25    top: 0;26    left: 0;27    width: 1080px;28    height: 120px;29  }30  .time {31    position: absolute;32    top: 30px;33    left: 36px;34    font-size: 46px;35    color: #616161;36    letter-spacing: 1px;37  }38  .status-icons {39    position: absolute;40    top: 26px;41    right: 36px;42    display: flex;43    align-items: center;44    gap: 28px;45  }46  .icon {47    width: 48px;48    height: 48px;49  }50 51  /* Bottom gesture bar */52  .gesture-bar {53    position: absolute;54    bottom: 60px;55    left: 50%;56    transform: translateX(-50%);57    width: 360px;58    height: 16px;59    background: #757575;60    border-radius: 12px;61    opacity: 0.7;62  }63</style>64</head>65<body>66<div id="render-target">67  <div class="status-bar">68    <div class="time">3:26</div>69    <div class="status-icons">70      <!-- Wi-Fi Icon -->71      <svg class="icon" viewBox="0 0 24 24">72        <path d="M3 9c4.8-4.2 13.2-4.2 18 0" stroke="#616161" stroke-width="2.2" fill="none" stroke-linecap="round"/>73        <path d="M6 12c3.6-3 8.4-3 12 0" stroke="#616161" stroke-width="2.2" fill="none" stroke-linecap="round"/>74        <path d="M9 15c2.4-2 3.6-2 6 0" stroke="#616161" stroke-width="2.2" fill="none" stroke-linecap="round"/>75        <circle cx="12" cy="18" r="1.8" fill="#616161"/>76      </svg>77      <!-- Battery Icon with bolt -->78      <svg class="icon" viewBox="0 0 24 24">79        <rect x="3" y="6" width="17" height="12" rx="2" ry="2" fill="none" stroke="#616161" stroke-width="2"/>80        <rect x="21" y="10" width="2" height="4" fill="#616161"/>81        <polygon points="11,8 14,8 12,12 15,12 11,16 12,13" fill="#616161"/>82      </svg>83    </div>84  </div>85 86  <!-- Main content area intentionally blank to match screenshot -->87 88  <div class="gesture-bar"></div>89</div>90</body>91</html>