Skip to content

Instantly share code, notes, and snippets.

@adarsh-gupta101

adarsh-gupta101/Twitter.html

Created February 5, 2022 04:22
Show Gist options
  • Save adarsh-gupta101/57468fb1c7d2341b7da4871278ac7f00 to your computer and use it in GitHub Desktop.
Save adarsh-gupta101/57468fb1c7d2341b7da4871278ac7f00 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Twitter.html
<html>
<body>
<div class="flex h-screen">
<div class="" style="flex:0.2">
<img class="w-24 h-24" src="https://help.twitter.com/content/dam/help-twitter/brand/logo.png" />
<span class="flex items-center p-4"><img class=" mr-3 w-8 h-8" src="https://cdn-icons.flaticon.com/png/512/2549/premium/2549900.png?token=exp=1643983665~hmac=712b8e718a70d5122baee91e998dd291"/><p class="text-2xl font-bold">Home</p></span>
<span class="flex items-center p-4"
><img class="w-8 h-8 mr-3" src="https://cdn-icons.flaticon.com/png/128/3423/premium/3423288.png?token=exp=1643983620~hmac=a35e438a21a5b7bf33ac17bb138bc958" />
<p class="text-2xl font-bold">Explore</p></span
>
<span class="flex items-center p-4"> <img class="w-8 h-8 mr-3" src="https://cdn-icons.flaticon.com/png/128/1769/premium/1769041.png?token=exp=1643983708~hmac=593c139b06a7e5d830058c31c692c90a"/><p class="text-2xl font-bold">Communities</p></span>
<span class="flex items-center p-4"><img class="mr-3 w-8 h-8" src="https://cdn-icons.flaticon.com/png/128/2529/premium/2529521.png?token=exp=1643983738~hmac=dea0403676334fcdfbdb08a7e09a7040"/><p class="text-2xl font-bold">Notification</p></span>
<span class="flex items-center p-4"><img class="mr-3 w-8 h-8" src="https://cdn-icons-png.flaticon.com/512/953/953810.png"/><p class="text-2xl font-bold">Messages</p></span>
<span class="flex items-center p-4"><img class="mr-3 w-8 h-8" src="https://cdn-icons-png.flaticon.com/512/747/747376.png"/><p class="text-2xl font-bold">Profile</p></span>
<span class="flex items-center p-4"><img class=" mr-3 w-8 h-8" src="https://cdn-icons-png.flaticon.com/512/2089/2089792.png"/><p class="text-2xl font-bold">more</p></span>
<span class="flex items-center p-4"><p class="text-2xl font-bold bg-blue-400 text-white w-fit p-4 px-24 rounded-full">Tweet</p></span>
</div>
<div class="border-2 border-red-50 h-92 " style="flex:0.6">
<p class="text-2xl font-bold ml-4">Adarsh gupta⚡</p>
<p class="ml-4">3223 Tweets</p>
<img src="https://pbs.twimg.com/profile_banners/1304242835768643589/1643966330/1500x500"/>
<div class="flex justify-between"><img src="https://pbs.twimg.com/profile_images/1489453739157049345/8elimMgr_400x400.png" class="mx-2 rounded-full w-36 -mt-16 border-2 border-white"/>
<p class="bg-black text-white h-fit p-2 mt-2 rounded-full px-8 text-xl"> follow</p>
</div>
<p class="text-2xl font-bold">Adarsh gupta ⚡</p>
<p class="text-xl text-gray-800">@adarsh____gupta </p>
<p class="ml-2 text-lg">• Making web development easier day by day by 3%.
</p>
<p class="ml-2 text-lg">• Cracking business mind as a developer.
</p><p class="ml-2 text-lg">• Trying to build a $100k Business
</p><p class="ml-2 text-lg">• JavaScript
</p><p class="ml-2 text-lg">• Web2+ Web3
</p>
<div class="flex flex-row">
<span class="mr-4 ml-3 mt-2"><span class="font-bold text-xl">138</span class="font-bold text-xl"> Following</span>
<span class="mt-2"><span class="font-bold text-xl">10.2k</span> Followers</p>
</div></div>
<div style=" flex:0.3" class="px-4">
<p type="text" class="bg-gray-100 text-center text-gray-500 p-3 m-1 rounded-full">Search Twitter</p>
<p class="text-2xl font-bold p-4">Whats happening</p>
<p class="text-zinc-400">Trending in India</p>
<p class="mt-2 text-xl font-bold">Schools</p>
<p class="text-gray-400">196k Tweets</p>
<p class="mt-2 text-xl font-bold">Bitcoin</p>
<p class="text-gray-400">206k Tweets</p> <p class="mt-2 text-xl font-bold">#noraFatehi</p>
<p class="text-gray-400">17.6k Tweets</p>
<p class="mt-2 text-xl font-bold">US deploys troops to Europe amid rising tensions over Russia and Ukraine</p>
<p class="text-gray-400">show more</p>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment