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>UI Render</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 and bottom black bars similar to a photo viewer */22  .top-bar, .bottom-bar {23    position: absolute;24    left: 0;25    width: 1080px;26    background: #000000;27  }28  .top-bar { top: 0; height: 350px; }29  .bottom-bar { bottom: 0; height: 350px; }30 31  /* Central photo area */32  .photo-area {33    position: absolute;34    top: 350px;35    left: 0;36    width: 1080px;37    height: 1700px;38    background: #E0E0E0;39    border-top: 1px solid #BDBDBD;40    border-bottom: 1px solid #BDBDBD;41    display: flex;42    align-items: center;43    justify-content: center;44    color: #757575;45    font-size: 36px;46    letter-spacing: 0.5px;47    box-sizing: border-box;48  }49</style>50</head>51<body>52<div id="render-target">53  <div class="top-bar"></div>54  <div class="photo-area">[IMG: Potted plant near window]</div>55  <div class="bottom-bar"></div>56</div>57</body>58</html>