GD-ML/AndroidCode

1<html>2<head>3<meta charset="UTF-8">4<title>Fitbit Consent Screen</title>5<style>6  body { margin:0; padding:0; background:transparent; font-family: Roboto, Arial, Helvetica, sans-serif; }7  #render-target {8    width:1080px; height:2400px; position:relative; overflow:hidden;9    background:#FFFFFF; color:#2f2f2f;10  }11 12  /* Status bar */13  .status-bar {14    position:absolute; top:0; left:0; right:0;15    height:110px; padding:0 36px;16    display:flex; align-items:center; justify-content:space-between;17    color:#111;18    font-weight:600; font-size:44px;19  }20  .sb-left { display:flex; align-items:center; gap:20px; }21  .sb-right { display:flex; align-items:center; gap:24px; }22  .sb-icon { width:44px; height:44px; opacity:.75; }23 24  /* Content */25  .content {26    position:absolute; left:0; right:0; top:120px; bottom:280px;27    padding:0 60px 320px 60px;28    overflow:hidden; /* visual only; not scrollable in static mock */29  }30  h1 {31    font-size:56px; line-height:1.2; font-weight:700; margin:36px 0 18px;32    color:#111;33  }34  p, li {35    font-size:36px; line-height:1.55; color:#404040;36  }37  ul { margin:0 0 28px 40px; padding:0; }38  li { margin:16px 0; }39  a { color:#157f71; text-decoration:none; }40  .divider {41    height:2px; background:#E5E5E5; margin:42px 0;42  }43 44  /* Consent rows with checkboxes */45  .consent-row {46    display:flex; align-items:flex-start; gap:24px;47    margin:32px 0 28px;48  }49  .consent-text { flex:1; }50  .check {51    width:72px; height:72px; border-radius:12px;52    border:2px solid #1a7a6b; background:#1a7a6b;53    display:flex; align-items:center; justify-content:center;54    box-shadow: inset 0 0 0 2px rgba(0,0,0,0.02);55  }56  .check svg { width:42px; height:42px; }57  .small-note { margin-top:6px; }58 59  /* Bottom actions */60  .actions {61    position:absolute; left:0; right:0; bottom:140px;62    padding:0 60px;63    display:flex; align-items:center; justify-content:space-between;64  }65  .exit-btn {66    background:none; border:none; color:#1a7a6b; font-size:42px; padding:26px 12px;67  }68  .primary-btn {69    background:#2a7c6f; color:#fff; border:none;70    padding:0 52px; height:150px; border-radius:80px; font-size:44px;71    font-weight:600; letter-spacing:.2px;72    min-width:640px;73    box-shadow:0 2px 0 rgba(0,0,0,0.05);74  }75 76  /* Home indicator */77  .home-indicator {78    position:absolute; left:50%; transform:translateX(-50%);79    bottom:40px; width:340px; height:12px; border-radius:8px; background:#cfcfcf;80  }81</style>82</head>83<body>84<div id="render-target">85 86  <!-- Status Bar -->87  <div class="status-bar">88    <div class="sb-left">10:14</div>89    <div class="sb-right">90      <!-- simple placeholder icons -->91      <svg class="sb-icon" viewBox="0 0 24 24">92        <path fill="#6b6b6b" d="M3 18h18v2H3zM7 14h10v2H7zM11 10h2v2h-2z"/>93      </svg>94      <svg class="sb-icon" viewBox="0 0 24 24">95        <path fill="#6b6b6b" d="M2 22h2c9-9 14-14 20-20V0C16 6 7 15 2 22z"/>96      </svg>97      <svg class="sb-icon" viewBox="0 0 24 24">98        <path fill="#6b6b6b" d="M12 4c4.4 0 8 3.6 8 8h2c0-5.5-4.5-10-10-10S2 6.5 2 12h2c0-4.4 3.6-8 8-8z"/>99      </svg>100      <svg class="sb-icon" viewBox="0 0 24 24">101        <path fill="#6b6b6b" d="M16 4H8c-1.1 0-2 .9-2 2v12l6 2 6-2V6c0-1.1-.9-2-2-2z"/>102      </svg>103    </div>104  </div>105 106  <div class="content">107    <h1>Managing your privacy</h1>108    <ul>109      <li>You can manage your privacy preferences from the Fitbit app, or in your Google Account</li>110      <li>These include whether to pair devices, enable features, download or delete data, or share it with others</li>111    </ul>112 113    <h1>Google's commitment to your privacy</h1>114    <ul>115      <li>Your Fitbit health and wellness data won't be used for Google Ads, and will continue to be kept separate from Google Ads data.</li>116      <li>To better understand how Google uses Fitbit data, you can read the <a href="#">Google Privacy Policy</a> and <a href="#">these Fitbit FAQs on privacy</a>. These include additional information on Google's lawful bases for processing personal data.</li>117    </ul>118 119    <div class="divider"></div>120 121    <h1>To set up Fitbit, give your consent</h1>122 123    <div class="consent-row">124      <div class="consent-text">125        <p>I consent to Google using my health and wellness data to provide Fitbit products and services, based on my Fitbit setup and in the ways described above. I understand that I can stop using Fitbit at any time, and delete data in my Google Account.</p>126      </div>127      <div class="check" aria-checked="true">128        <svg viewBox="0 0 24 24">129          <path fill="#fff" d="M9.2 16.6l-3.8-3.8 1.6-1.6 2.2 2.2 5.8-5.8 1.6 1.6z"/>130        </svg>131      </div>132    </div>133 134    <div class="consent-row">135      <div class="consent-text">136        <p>I agree to the <a href="#">Google Terms of Service</a> and <a href="#">Fitbit Additional Terms of Service</a>, and acknowledge that I have read the <a href="#">Google Privacy Policy</a> and <a href="#">these FAQs on privacy</a>.</p>137      </div>138      <div class="check" aria-checked="true">139        <svg viewBox="0 0 24 24">140          <path fill="#fff" d="M9.2 16.6l-3.8-3.8 1.6-1.6 2.2 2.2 5.8-5.8 1.6 1.6z"/>141        </svg>142      </div>143    </div>144  </div>145 146  <div class="actions">147    <button class="exit-btn">Exit</button>148    <button class="primary-btn">Agree &amp; continue</button>149  </div>150 151  <div class="home-indicator"></div>152</div>153</body>154</html>