GD-ML/AndroidCode

1<!DOCTYPE html>2<html lang="en">3<head>4<meta charset="UTF-8">5<meta name="viewport" content="width=1080, initial-scale=1.0">6<title>Gallery Icon Screen</title>7<style>8  body {9    margin: 0;10    padding: 0;11    background: transparent;12    font-family: Arial, Helvetica, sans-serif;13  }14  #render-target {15    width: 1080px;16    height: 2400px;17    position: relative;18    overflow: hidden;19    background: #000000;20  }21  /* Top status bar */22  .status-bar {23    position: absolute;24    top: 0;25    left: 0;26    width: 1080px;27    height: 120px;28    background: #111111;29  }30 31  /* App icon */32  .app-icon {33    position: absolute;34    top: 1500px; /* places the icon in lower half similar to screenshot */35    left: 50%;36    transform: translateX(-50%);37    width: 360px;38    height: 360px;39    background: #2E60E6;40    border-radius: 88px;41    box-shadow: 0 24px 40px rgba(0,0,0,0.5);42    overflow: hidden;43  }44  .label {45    position: absolute;46    top: 1886px; /* 1500 + 360 + spacing */47    left: 0;48    width: 100%;49    text-align: center;50    color: #FFFFFF;51    font-size: 54px;52    font-weight: 500;53    letter-spacing: 0.5px;54  }55</style>56</head>57<body>58<div id="render-target">59  <div class="status-bar"></div>60 61  <div class="app-icon">62    <!-- Simplified flower icon using SVG to resemble Gallery app -->63    <svg width="360" height="360" viewBox="0 0 360 360" xmlns="http://www.w3.org/2000/svg">64      <!-- Subtle corner overlay to mimic design variation -->65      <path d="M0,0 L120,0 C90,40 60,70 40,110 L0,120 Z" fill="#234CCB" opacity="0.85"/>66      <!-- Petals -->67      <g transform="translate(210,180)">68        <ellipse cx="0" cy="0" rx="120" ry="42" fill="#FFD64D" transform="rotate(0)"/>69        <ellipse cx="0" cy="0" rx="120" ry="42" fill="#F6C13A" transform="rotate(30)"/>70        <ellipse cx="0" cy="0" rx="120" ry="42" fill="#FFD64D" transform="rotate(60)"/>71        <ellipse cx="0" cy="0" rx="120" ry="42" fill="#F6C13A" transform="rotate(90)"/>72        <ellipse cx="0" cy="0" rx="120" ry="42" fill="#FFD64D" transform="rotate(120)"/>73        <ellipse cx="0" cy="0" rx="120" ry="42" fill="#F6C13A" transform="rotate(150)"/>74      </g>75      <!-- Center ring -->76      <circle cx="210" cy="180" r="28" fill="#FFE999" stroke="#FFFFFF" stroke-width="8"/>77    </svg>78  </div>79 80  <div class="label">Gallery</div>81</div>82</body>83</html>