GD-ML/AndroidCode

1<html lang="en">2<head>3<meta charset="UTF-8">4<title>RailYatri Splash</title>5<meta name="viewport" content="width=1080, initial-scale=1.0">6<style>7  body { margin: 0; padding: 0; background: transparent; font-family: Arial, Helvetica, sans-serif; }8  #render-target {9    width: 1080px;10    height: 2400px;11    position: relative;12    overflow: hidden;13    background: linear-gradient(to bottom, #e1f2f9 0%, #f6fbfd 45%, #ffffff 100%);14  }15 16  /* Status bar */17  .status-bar {18    position: absolute;19    top: 0;20    left: 0;21    width: 1080px;22    height: 120px;23    background: #1f5096;24    color: #ffffff;25    display: flex;26    align-items: center;27    justify-content: space-between;28    padding: 0 42px;29    box-sizing: border-box;30    letter-spacing: 1px;31  }32  .status-left {33    font-size: 46px;34    font-weight: 600;35  }36  .status-center {37    display: flex;38    gap: 28px;39    align-items: center;40    color: #c7dbff;41    font-size: 34px;42  }43  .status-right {44    display: flex;45    gap: 26px;46    align-items: center;47  }48  /* simple icons */49  .icon-wifi, .icon-battery, .icon-signal {50    display: inline-block;51  }52  .icon-signal svg { width: 52px; height: 52px; }53  .icon-wifi svg { width: 56px; height: 56px; }54  .icon-battery svg { width: 70px; height: 40px; }55 56  /* Main content */57  .content {58    position: absolute;59    top: 920px;60    left: 50%;61    transform: translateX(-50%);62    width: 920px;63    text-align: center;64    color: #2b2b2b;65  }66  .brand {67    font-size: 138px;68    font-weight: 800;69    letter-spacing: 2px;70  }71  .brand .rail { color: #db4748; }72  .brand .yatri { color: #413e99; }73  .tagline {74    margin-top: 34px;75    font-size: 56px;76    color: #2a2a2a;77    font-weight: 600;78  }79  .spacer {80    height: 40px;81  }82  .launches-row {83    margin-top: 52px;84    display: flex;85    align-items: center;86    justify-content: center;87    gap: 28px;88  }89  .line {90    height: 2px;91    width: 120px;92    background: #b7c4d6;93  }94  .launches {95    font-style: italic;96    font-size: 50px;97    color: #3a3a3a;98    letter-spacing: 1px;99  }100 101  /* Intercity SmartBus pseudo-logo */102  .smartbus-wrap {103    margin: 56px auto 0;104    display: flex;105    align-items: center;106    justify-content: center;107    gap: 22px;108  }109  .pin {110    width: 84px;111    height: 84px;112  }113  .smartbus-text {114    display: flex;115    align-items: baseline;116    gap: 22px;117    flex-wrap: wrap;118  }119  .smartbus-text .intrcity {120    font-size: 86px;121    font-weight: 800;122    color: #70bf44;123    letter-spacing: 1px;124  }125  .smartbus-text .smartbus {126    font-size: 86px;127    font-weight: 800;128    color: #2e5fb1;129    letter-spacing: 1px;130  }131 132  /* Bottom fade overlay to mimic lighter bottom */133  .bottom-fade {134    position: absolute;135    left: 0;136    bottom: 0;137    width: 1080px;138    height: 900px;139    background: linear-gradient(to bottom, rgba(230,246,250,0) 0%, rgba(226,245,249,0.5) 40%, #e6f6fa 100%);140    opacity: 0.65;141    pointer-events: none;142  }143</style>144</head>145<body>146<div id="render-target">147 148  <!-- Top status bar -->149  <div class="status-bar">150    <div class="status-left">11:21</div>151    <div class="status-center">152      <span>⌀</span>153      <span>$</span>154      <span>S</span>155    </div>156    <div class="status-right">157      <span class="icon-signal">158        <svg viewBox="0 0 24 24" fill="#ffffff">159          <rect x="1" y="15" width="3" height="8"></rect>160          <rect x="7" y="11" width="3" height="12"></rect>161          <rect x="13" y="7" width="3" height="16"></rect>162          <rect x="19" y="3" width="3" height="20"></rect>163        </svg>164      </span>165      <span class="icon-wifi">166        <svg viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2">167          <path d="M2 8c5.5-5.5 14.5-5.5 20 0"></path>168          <path d="M5 11c4-4 10-4 14 0"></path>169          <path d="M8 14c2.5-2.5 6.5-2.5 9 0"></path>170          <circle cx="12" cy="18" r="2" fill="#ffffff" stroke="none"></circle>171        </svg>172      </span>173      <span class="icon-battery">174        <svg viewBox="0 0 28 14" fill="none" stroke="#ffffff" stroke-width="2">175          <rect x="1" y="1" width="22" height="12" rx="2"></rect>176          <rect x="3" y="3" width="18" height="8" fill="#ffffff" stroke="none"></rect>177          <rect x="24" y="4" width="3" height="6" fill="#ffffff" stroke="none"></rect>178        </svg>179      </span>180    </div>181  </div>182 183  <!-- Center content -->184  <div class="content">185    <div class="brand">186      <span class="rail">RAIL</span><span class="yatri">YATRI</span>187    </div>188    <div class="tagline">Fastest Train Ticket Booking App</div>189 190    <div class="launches-row">191      <div class="line"></div>192      <div class="launches">launches</div>193      <div class="line"></div>194    </div>195 196    <div class="smartbus-wrap">197      <svg class="pin" viewBox="0 0 24 24">198        <path d="M12 23c-5-7-8-10-8-14a8 8 0 1 1 16 0c0 4-3 7-8 14z" fill="#79c54d"></path>199        <circle cx="12" cy="9" r="3.2" fill="#e5f5e9"></circle>200      </svg>201      <div class="smartbus-text">202        <span class="intrcity">intrcity</span>203        <span class="smartbus">smartbus</span>204      </div>205    </div>206  </div>207 208  <div class="bottom-fade"></div>209</div>210</body>211</html>