GD-ML/AndroidCode

1<!DOCTYPE html>2<html>3<head>4<meta charset="utf-8">5<title>APKs - Empty</title>6<style>7  body { margin: 0; padding: 0; background: transparent; }8  #render-target {9    width: 1080px;10    height: 2400px;11    position: relative;12    overflow: hidden;13    background: #FFFFFF;14    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;15    color: #424242;16  }17 18  /* Status bar */19  .status-bar {20    position: absolute;21    top: 0;22    left: 0;23    width: 100%;24    height: 96px;25    box-sizing: border-box;26    padding: 24px 36px;27    color: #777;28    font-size: 32px;29    line-height: 48px;30  }31  .status-right {32    position: absolute;33    top: 24px;34    right: 36px;35    height: 48px;36    display: flex;37    align-items: center;38    gap: 26px;39  }40  .icon {41    display: inline-block;42  }43  .icon svg { display: block; }44 45  /* Toolbar */46  .toolbar {47    position: absolute;48    top: 96px;49    left: 0;50    width: 100%;51    height: 140px;52    display: flex;53    align-items: center;54    justify-content: center;55  }56  .toolbar-title {57    font-size: 46px;58    font-weight: 500;59    color: #5A5A5A;60    letter-spacing: 0.3px;61  }62  .toolbar .back {63    position: absolute;64    left: 24px;65    top: 50%;66    transform: translateY(-50%);67  }68  .toolbar .more {69    position: absolute;70    right: 24px;71    top: 50%;72    transform: translateY(-50%);73  }74  .divider {75    position: absolute;76    top: 236px;77    left: 0;78    width: 100%;79    height: 2px;80    background: #E9E9E9;81  }82 83  /* Empty state */84  .empty-state {85    position: absolute;86    top: 1180px;87    left: 0;88    width: 100%;89    text-align: center;90  }91  .empty-label {92    margin-top: 28px;93    font-size: 40px;94    color: #616161;95  }96 97  /* Bottom gesture pill */98  .gesture-pill {99    position: absolute;100    bottom: 48px;101    left: 50%;102    transform: translateX(-50%);103    width: 300px;104    height: 16px;105    background: #6F6F6F;106    border-radius: 16px;107    opacity: 0.85;108  }109</style>110</head>111<body>112<div id="render-target">113  <!-- Status bar -->114  <div class="status-bar">115    8:45116    <div class="status-right">117      <!-- Wi-Fi icon -->118      <span class="icon">119        <svg width="48" height="48" viewBox="0 0 48 48">120          <g fill="none" stroke="#777" stroke-width="3" stroke-linecap="round">121            <path d="M3 16 Q24 2 45 16" />122            <path d="M10 26 Q24 16 38 26" />123            <path d="M18 36 Q24 30 30 36" />124            <circle cx="24" cy="40" r="2" fill="#777" stroke="none"></circle>125          </g>126        </svg>127      </span>128      <!-- Battery icon -->129      <span class="icon">130        <svg width="56" height="48" viewBox="0 0 56 48">131          <g fill="none" stroke="#777" stroke-width="3">132            <rect x="6" y="12" width="40" height="24" rx="3"></rect>133            <rect x="48" y="17" width="6" height="14" rx="2"></rect>134            <rect x="9" y="15" width="28" height="18" fill="#BDBDBD" stroke="none"></rect>135          </g>136        </svg>137      </span>138    </div>139  </div>140 141  <!-- Toolbar -->142  <div class="toolbar">143    <div class="back icon">144      <svg width="64" height="64" viewBox="0 0 64 64">145        <polyline points="40,14 24,32 40,50" fill="none" stroke="#777" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"></polyline>146      </svg>147    </div>148    <div class="toolbar-title">APKs</div>149    <div class="more icon">150      <svg width="56" height="56" viewBox="0 0 56 56">151        <g fill="#777">152          <circle cx="28" cy="12" r="4"></circle>153          <circle cx="28" cy="28" r="4"></circle>154          <circle cx="28" cy="44" r="4"></circle>155        </g>156      </svg>157    </div>158  </div>159  <div class="divider"></div>160 161  <!-- Empty state -->162  <div class="empty-state">163    <svg width="140" height="120" viewBox="0 0 140 120">164      <path d="M20 34 h30 l10 12 h60 a8 8 0 0 1 8 8 v46 a8 8 0 0 1 -8 8 H28 a8 8 0 0 1 -8 -8 V42 a8 8 0 0 1 8 -8 z"165            fill="none" stroke="#CFCFCF" stroke-width="6" stroke-linejoin="round"></path>166    </svg>167    <div class="empty-label">Empty</div>168  </div>169 170  <!-- Bottom gesture pill -->171  <div class="gesture-pill"></div>172</div>173</body>174</html>