GD-ML/AndroidCode
13.4k
1<html>2<head>3<meta charset="UTF-8">4<title>Class 11 Physics (India)</title>5<style>6 body { margin:0; padding:0; background: transparent; font-family: Arial, Helvetica, sans-serif; }7 #render-target {8 width:1080px; height:2400px;9 position:relative; overflow:hidden;10 background:#ffffff;11 }12 /* Top bars */13 .status-bar{14 position:absolute; left:0; top:0; width:100%; height:90px;15 background:#0d2a55; color:#fff;16 display:flex; align-items:center; padding:0 40px; box-sizing:border-box;17 font-size:34px; letter-spacing:0.5px;18 }19 .status-right{ margin-left:auto; display:flex; align-items:center; gap:26px; }20 .app-bar{21 position:absolute; left:0; top:90px; width:100%; height:160px;22 background:#0d2a55; color:#fff;23 display:flex; align-items:center; gap:24px;24 padding:0 32px; box-sizing:border-box;25 box-shadow: 0 2px 0 rgba(0,0,0,0.1) inset;26 }27 .title{ font-size:46px; font-weight:700; }28 .back-btn{29 width:72px; height:72px; display:flex; align-items:center; justify-content:center;30 }31 /* Content area */32 .content{33 position:absolute; left:0; top:250px; width:100%; height:1950px;34 overflow:auto; -webkit-overflow-scrolling: touch;35 background:#ffffff;36 }37 .section{ padding:36px 40px 18px 40px; }38 .section-header{39 display:flex; align-items:center; gap:26px; margin-bottom:18px;40 }41 .icon-circle{42 width:92px; height:92px; border-radius:50%;43 background:#6abf86; display:flex; align-items:center; justify-content:center;44 position:relative; color:#eaffef; font-size:28px; font-weight:700;45 box-shadow: inset 0 0 0 6px rgba(255,255,255,0.35);46 }47 /* Simple atom-like cross */48 .icon-circle::before, .icon-circle::after{49 content:""; position:absolute; width:64px; height:4px; background:#ffffff;50 }51 .icon-circle::after{ transform:rotate(90deg); }52 .section-title{53 font-size:44px; font-weight:700; color:#1f2b3a;54 }55 .list{ padding-left:118px; }56 .list .item{57 font-size:38px; color:#7a7a7a; padding:18px 0;58 border-bottom:1px solid #f0f0f0;59 }60 .divider{61 height:14px; background:#f4f6f8; margin:8px 0 0 0;62 border-top:1px solid #e9edf1; border-bottom:1px solid #e9edf1;63 }64 /* Bottom navigation */65 .bottom-nav{66 position:absolute; left:0; bottom:0; width:100%; height:200px;67 background:#ffffff; border-top:1px solid #e6e6e6;68 display:flex; align-items:center; justify-content:space-around;69 }70 .tab{ width:33.33%; display:flex; flex-direction:column; align-items:center; gap:10px; }71 .tab span{ font-size:34px; color:#8c8c8c; }72 .tab.active span{ color:#1f78ff; font-weight:600; }73 .icon{74 width:70px; height:70px; color:#8c8c8c;75 }76 .active .icon{ color:#1f78ff; }77 /* Utility */78 .sr{ position:absolute; right:0; }79</style>80</head>81<body>82<div id="render-target">83 <!-- Status bar -->84 <div class="status-bar">85 9:1086 <div class="status-right">87 <!-- Simple Wi-Fi icon -->88 <svg class="icon" viewBox="0 0 24 24" width="48" height="48">89 <path fill="#ffffff" d="M12 20.5l2.1-2.1a3 3 0 0 0-4.2 0L12 20.5zm-5-5l1.6 1.6a6 6 0 0 1 6.8 0L17 15.5a8 8 0 0 0-10 0zM2.5 10l1.7 1.7a12 12 0 0 1 15.6 0L21.5 10a14 14 0 0 0-19 0z"/>90 </svg>91 <!-- Battery icon -->92 <svg viewBox="0 0 28 14" width="60" height="36">93 <rect x="1" y="2" width="22" height="10" fill="none" stroke="#ffffff" stroke-width="2"></rect>94 <rect x="24" y="5" width="3" height="4" fill="#ffffff"></rect>95 <rect x="3" y="4" width="16" height="6" fill="#ffffff"></rect>96 </svg>97 </div>98 </div>99 100 <!-- App bar -->101 <div class="app-bar">102 <div class="back-btn">103 <svg viewBox="0 0 24 24" width="64" height="64">104 <path fill="#ffffff" d="M15.5 4l-8 8 8 8 2.1-2.1L11.7 12l5.9-5.9L15.5 4z"></path>105 </svg>106 </div>107 <div class="title">Class 11 Physics (India)</div>108 </div>109 110 <!-- Content -->111 <div class="content">112 <!-- Section 1 -->113 <div class="section">114 <div class="section-header">115 <div class="icon-circle"></div>116 <div class="section-title">Differentiation for physics (Prerequisite)</div>117 </div>118 <div class="list">119 <div class="item">Basic differentiation rules</div>120 <div class="item">Power rule</div>121 <div class="item">Polynomial functions differentiation</div>122 <div class="item">Sine & cosine derivatives</div>123 <div class="item">Product rule</div>124 <div class="item" style="border-bottom:none;">Chain rule</div>125 </div>126 </div>127 128 <div class="divider"></div>129 130 <!-- Section 2 -->131 <div class="section">132 <div class="section-header">133 <div class="icon-circle"></div>134 <div class="section-title">Integration for physics (Prerequisite)</div>135 </div>136 <div class="list">137 <div class="item">Antiderivatives</div>138 <div class="item">Indefinite integrals of common functions</div>139 <div class="item">Definite integral as area</div>140 <div class="item">Riemann sums</div>141 <div class="item">Definite integral evaluation</div>142 <div class="item">u-substitution</div>143 <div class="item" style="border-bottom:none;">Area & net change</div>144 </div>145 </div>146 147 <div class="divider"></div>148 149 <!-- Section 3 -->150 <div class="section" style="padding-bottom:120px;">151 <div class="section-header">152 <div class="icon-circle"></div>153 <div class="section-title">Motion in a straight line</div>154 </div>155 <div class="list">156 <div class="item">Distance, displacement, and coordinate systems</div>157 <div class="item" style="border-bottom:none;">Average velocity and average speed</div>158 </div>159 </div>160 </div>161 162 <!-- Bottom navigation -->163 <div class="bottom-nav">164 <div class="tab active">165 <!-- Home icon (hex-like) -->166 <svg class="icon" viewBox="0 0 24 24">167 <path fill="currentColor" d="M12 3l7 4v10l-7 4-7-4V7l7-4zm-3 6v6l3 1.7L15 15V9l-3-1.7L9 9z"></path>168 </svg>169 <span>Home</span>170 </div>171 <div class="tab">172 <svg class="icon" viewBox="0 0 24 24">173 <path fill="currentColor" d="M10 18a8 8 0 1 1 5.3-13.9l4.8 4.8-1.9 1.9-4.4-4.4A6 6 0 1 0 10 16v2z"></path>174 </svg>175 <span>Explore</span>176 </div>177 <div class="tab">178 <svg class="icon" viewBox="0 0 24 24">179 <path fill="currentColor" d="M6 3h12a2 2 0 0 1 2 2v14l-8-3-8 3V5a2 2 0 0 1 2-2z"></path>180 </svg>181 <span>Bookmarks</span>182 </div>183 </div>184</div>185</body>186</html>