Skip to content

Commit

Permalink
Merge pull request #1903 from Ronak-Proghammer/master
Browse files Browse the repository at this point in the history 
Created HTML page for 10K subscribers as per #1874
  • Loading branch information
@vibrantachintya
vibrantachintya committed Oct 12, 2021
2 parents ea4d566 + e4f03e9 commit 622f4d6
Showing 1 changed file with 154 additions and 0 deletions.
154 changes: 154 additions & 0 deletions HTML CSS/2021/10k_subscriber_Ronak-Proghammer.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,154 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>10k Subscriber</title>

<!-- <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"> -->

<style>
*{
font-size: 18px;
font-family: 'Roboto', Arial, sans-serif;
}

header{
margin: 10px;
}
.hashtag,a{
text-decoration: none;
}

.views,.date,.fade{
color: #AAAAAA;
font-size: 14px;
}

.dot {
height: 5px;
width: 5px;
background-color: #bbb;
border-radius: 50%;
display: inline-block;
margin: 2px 3px;
user-select: none;
}

.subhead{
margin: 20px 10px;
display: flex;
width: 99%;
justify-content: space-between;
margin-bottom: 0px;
}

.contents{
margin: 3px 10px;
display: flex;
flex-direction: row;
}

.leftele{
margin-left: 10px;
}
.rightele{
display: flex;
flex-direction: row;
border-bottom: 2px solid black;
margin-right: 10px;
}

.like-icon,.dislike-icon{
height: 24px!important;
width: 24px!important;
}
.num{
margin: 2px;
}
hr{
border-top: 1px solid rgba(0, 0, 0, 0.185);
margin: 0px;
margin-left: 10px;
}

.channelname{
margin: 20px;
display: flex;
flex-direction: row;
align-items: center;
}

.channel-name{
font-size: 14px;
font-weight: 600;
margin: 7px;
display: flex;
flex-direction: column;
}

.subs{
font-size: 12px;
}

.text{
font-size: 14px;
color: #030303;
}
.text a{
font-size: 14px;
}
.showless{
font-size: 14px;
font-weight: 600;
}
</style>
</head>
<body>
<header>
<span>Why I started Twowaits?</span>
<a href="#" class="hashtag">#MyJourney</a>
<span> | Achintya Gaumat</span>
</header>
<div class="subhead">
<div class="leftele">
<span class="views fade">5,584 views </span>
<span class="dot"></span>
<span class="date fade">Apr 18,2021</span>
</div>
<div class="rightele">
<span class="contents">
<svg viewBox="0 0 24 24" preserveAspectRatio="xMidYMid meet" focusable="false" class="like-icon" style="pointer-events: none; display: block; width: 100%; height: 100%;"><g class="style-scope yt-icon"><path d="M18.77,11h-4.23l1.52-4.94C16.38,5.03,15.54,4,14.38,4c-0.58,0-1.14,0.24-1.52,0.65L7,11H3v10h4h1h9.43 c1.06,0,1.98-0.67,2.19-1.61l1.34-6C21.23,12.15,20.18,11,18.77,11z M7,20H4v-8h3V20z M19.98,13.17l-1.34,6 C18.54,19.65,18.03,20,17.43,20H8v-8.61l5.6-6.06C13.79,5.12,14.08,5,14.38,5c0.26,0,0.5,0.11,0.63,0.3 c0.07,0.1,0.15,0.26,0.09,0.47l-1.52,4.94L13.18,12h1.35h4.23c0.41,0,0.8,0.17,1.03,0.46C19.92,12.61,20.05,12.86,19.98,13.17z" class="style-scope yt-icon"></path></g></svg>
<span class="num">756</span>
</span>
<span class="contents">
<svg viewBox="0 0 24 24" preserveAspectRatio="xMidYMid meet" focusable="false" class="dislike-icon" style="pointer-events: none; display: block; width: 100%; height: 100%;"><g class="style-scope yt-icon"><path d="M17,4h-1H6.57C5.5,4,4.59,4.67,4.38,5.61l-1.34,6C2.77,12.85,3.82,14,5.23,14h4.23l-1.52,4.94C7.62,19.97,8.46,21,9.62,21 c0.58,0,1.14-0.24,1.52-0.65L17,14h4V4H17z M10.4,19.67C10.21,19.88,9.92,20,9.62,20c-0.26,0-0.5-0.11-0.63-0.3 c-0.07-0.1-0.15-0.26-0.09-0.47l1.52-4.94l0.4-1.29H9.46H5.23c-0.41,0-0.8-0.17-1.03-0.46c-0.12-0.15-0.25-0.4-0.18-0.72l1.34-6 C5.46,5.35,5.97,5,6.57,5H16v8.61L10.4,19.67z M20,13h-3V5h3V13z" class="style-scope yt-icon"></path></g></svg>
<span class="num">13</span>
</span>
</div>
</div>
<hr>
<div class="section">
<div class="channelname">
<img id="img" class="channel-icon" alt="" width="48" src="https://yt3.ggpht.com/ytc/AKedOLQEM83_To3WF2M59jnR28_zKnwp3UdsaRN858z7=s88-c-k-c0x00ffffff-no-rj">
<span class="channel-name">Twowaits
<span class="fade subs">10k subscribers</span>
</span>
</div>
<div class="description">
<pre class="text">
In this I talk about what led me to start Twowaits and what all we do.

Connect on Linkedin : <a href="https://www.linkedin.com/authwall?trk=bf&trkInfo=AQGRFocMxAapywAAAXxke96gmrosY3H0bjKup9ICpgnSIhseId00Ht2Uk3dQOODMhxAWbsjhCaVd1RwYVsHWbG-z8qLJOkg38zDjLZ4sng_ZmhDnXmBNnwAwFpeww73IQb9wZ-I=&originalReferer=&sessionRedirect=https%3A%2F%2Fwww.linkedin.com%2Fin%2Fachintya-gaumat-b6569365%2F">https://www.linkedin.com/in/achintya-...</a>

Do read more about my work : <a href="https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqa29HcEFLQmFXMDFIU2c1WGJlTXJiY1o4VmM3QXxBQ3Jtc0ttQVg5a3l4clhqU2x6LWREQUoxSFJudkxEaGNrT1c5dlpHam9sWnAwMGxlTVc2TmZCWlZxMnplUGd3aVJVYzY5ZmRxSHZWTzhWcHVfeXdwcFY2enIzNDJ2T2ZVUE4yTEpyV3dsZnlsczIyajF6TlZFRQ&q=https%3A%2F%2Fmedium.com%2Ftwowaits%2Four-dream-and-dream-of-billion-indians-the-why-of-twowaits-e45301383d6">https://medium.com/twowaits/our-dream...</a>

<span class="fade showless">SHOW LESS</span>
</pre>

</div>
</div>
</body>
</html>

0 comments on commit 622f4d6

Please sign in to comment.