├── CARDS ├── Animated Product Card (22-09-23) │ ├── index.html │ └── readme └── readme ├── CURSORS ├── Particles Cursor(15-09-23) │ ├── index1.html │ └── readme └── readme ├── FORMS ├── Transparent Login Form (17-09-23) │ ├── index.css │ ├── index.html │ └── readme ├── Transparent Login Form (21-09-23) │ ├── bg.jpg │ ├── index.html │ └── readme └── readme └── README.md /CARDS/Animated Product Card (22-09-23)/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | @codewith_muhilan 7 | 205 | 206 | 207 | 208 | 211 | 212 | 213 |

214 |

215 |

216 |

217 |

218 |

219 |

220 |

221 |

Boat 135G Ultra Sound

222 |

RS 40,999

223 |

224 |

225 |

226 | 227 | 228 |

229 |

230 |

231 |

232 |

233 |

234 |

235 |

Boat 135G Ultra Sound

236 |

RS 40,999

237 |

238 |

239 |

240 |

241 | 242 | 243 | 244 | 245 | 246 | Join my Telegram 247 | 248 | 249 | 250 | 251 | Subscribe my channel..❤ 252 | 253 | 254 | 255 | 256 | -------------------------------------------------------------------------------- /CARDS/Animated Product Card (22-09-23)/readme: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /CARDS/readme: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /CURSORS/Particles Cursor(15-09-23)/index1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | @codewith_muhilan 7 | 8 | 9 | 10 | 86 | 87 | 88 |

89 | 90 |

91 |

92 | 93 | 94 | 95 | 96 | 97 | 98 | Join my Telegram 99 | 100 | 101 | 102 | 103 | Subscribe my channel..❤ 104 | 105 | 106 | 107 | 127 | 128 | -------------------------------------------------------------------------------- /CURSORS/Particles Cursor(15-09-23)/readme: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /CURSORS/readme: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /FORMS/Transparent Login Form (17-09-23)/index.css: -------------------------------------------------------------------------------- 1 | *, *::after,*::before{ 2 | padding: 0; 3 | margin: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | body{ 8 | background-color: #000000; 9 | } 10 | 11 | form *{ 12 | font-family: "Poppins" sans-serif; 13 | color: #ffffff; 14 | letter-spacing: 0.6px; 15 | outline: none; 16 | border: none; 17 | } 18 | 19 | form{ 20 | background-color: rgba(255,255,255,0.13); 21 | height: 500px; 22 | width: 400px; 23 | backdrop-filter: blur(10px); 24 | position: absolute; 25 | top: 50%; 26 | left: 50%; 27 | transform: translate(-50%,-50%); 28 | border: 2px solid rgba(255,255,255,0.1); 29 | box-shadow: 0 0 35px rgba(8, 7, 16, 0.6); 30 | padding: 50px 35px; 31 | border-radius: 10px; 32 | } 33 | 34 | form h3{ 35 | font-size: 32px; 36 | font-weight: 600; 37 | line-height: 42px; 38 | text-align: center; 39 | } 40 | 41 | label{ 42 | display: block; 43 | margin-top: 30px; 44 | font-size: 18px; 45 | font-weight: 500; 46 | } 47 | 48 | input{ 49 | display: block; 50 | height: 50px; 51 | width: 100%; 52 | background-color: rgba(255,255,255,0.07); 53 | border-radius: 3px; 54 | padding: 0 10px; 55 | margin-top: 8px; 56 | font-size: 15px; 57 | font-weight: 300; 58 | } 59 | 60 | ::placeholder{ 61 | color: rgb(216, 219, 221); 62 | } 63 | 64 | button { 65 | margin-top: 50px; 66 | width: 100%; 67 | color: #000000; 68 | background-color: #ffffff; 69 | padding: 15px 0; 70 | font-size: 18px; 71 | font-weight: 600; 72 | border-radius: 5px; 73 | cursor: pointer; 74 | 75 | } 76 | 77 | button:hover{ 78 | background: linear-gradient(to right , #2f649c , #c7911e); 79 | } 80 | 81 | .social{ 82 | margin-top: 30px; 83 | display: flex; 84 | } 85 | 86 | .social div{ 87 | background: red; 88 | width: 150px; 89 | border-radius: 5px; 90 | background-color: rgba(255,255,255, 0.27); 91 | color: #ffffff; 92 | text-align: center; 93 | padding: 5px 10px 10px 5px; 94 | } 95 | 96 | .social div:hover{ 97 | background-color: rgba(255,255,255, 0.47); 98 | } 99 | 100 | .social .facebook{ 101 | margin-left: 25px; 102 | } 103 | 104 | 105 | .social i { 106 | margin-right: 10px; 107 | } 108 | 109 | .social .google:hover{ 110 | background: linear-gradient(to left, #204bb8, #6f9fc0); 111 | cursor: pointer; 112 | 113 | } 114 | 115 | .social .facebook:hover{ 116 | background: linear-gradient( to right, #c7911e, #c7541e); 117 | cursor: pointer; 118 | } 119 | 120 | .bg{ 121 | width: 430px; 122 | height: 480px; 123 | position: absolute; 124 | top: 50%; 125 | left: 50%; 126 | transform: translate( -50%, -50%); 127 | } 128 | 129 | .bg .shape{ 130 | height: 200px; 131 | width: 200px; 132 | position: absolute; 133 | border-radius: 50%; 134 | } 135 | 136 | .shape:first-child{ 137 | background: linear-gradient( #204bb8, #7eb0e5); 138 | left: -80px; top: -80px; 139 | filter: blur(10px); 140 | } 141 | .shape:last-child{ 142 | background: linear-gradient( #d08b31, #af7113); 143 | right: -30px; bottom: -80px; 144 | filter: blur(10px); 145 | } 146 | 147 | 148 | 149 | /* -- YouTube Link Styles -- */ 150 | 151 | #source-link { 152 | top: 60px; 153 | } 154 | 155 | #source-link > i { 156 | color: rgb(94, 106, 210); 157 | } 158 | 159 | #yt-link { 160 | top: 10px; 161 | } 162 | 163 | #yt-link > i { 164 | color: rgb(219, 31, 106); 165 | 166 | } 167 | 168 | .meta-link { 169 | align-items: center; 170 | backdrop-filter: blur(3px); 171 | background-color: rgba(255, 255, 255, 0.05); 172 | border: 1px solid rgba(255, 255, 255, 0.1); 173 | border-radius: 6px; 174 | box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); 175 | cursor: pointer; 176 | display: inline-flex; 177 | gap: 5px; 178 | left: 10px; 179 | padding: 10px 20px; 180 | position: fixed; 181 | text-decoration: none; 182 | transition: background-color 600ms, border-color 600ms; 183 | z-index: 10000; 184 | } 185 | 186 | .meta-link:hover { 187 | background-color: rgba(255, 255, 255, 0.1); 188 | border: 1px solid rgba(255, 255, 255, 0.2); 189 | } 190 | 191 | .meta-link > i, .meta-link > span { 192 | height: 20px; 193 | line-height: 20px; 194 | } 195 | 196 | .meta-link > span { 197 | color: white; 198 | font-family: "Rubik", sans-serif; 199 | transition: color 600ms; 200 | } 201 | -------------------------------------------------------------------------------- /FORMS/Transparent Login Form (17-09-23)/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |

17 |

18 |

19 |

20 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | Join my Telegram 45 | 46 | 47 | 48 | 49 | Subscribe my channel..❤ 50 | 51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /FORMS/Transparent Login Form (17-09-23)/readme: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /FORMS/Transparent Login Form (21-09-23)/bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codewithMUHILAN/Youtube/6c7bc9ba9bd7c34c4ddbc1bb81c8869cf4c218b3/FORMS/Transparent Login Form (21-09-23)/bg.jpg -------------------------------------------------------------------------------- /FORMS/Transparent Login Form (21-09-23)/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 207 | 208 | 209 | 210 | 211 | 212 | 213 |

214 | 215 | 246 |

247 | 248 | 249 | 250 | 251 | 252 | 253 | Join my Telegram 254 | 255 | 256 | 257 | 258 | Subscribe my channel..❤ 259 | 260 | 261 | 262 | 263 | 264 | 265 | 266 | -------------------------------------------------------------------------------- /FORMS/Transparent Login Form (21-09-23)/readme: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /FORMS/readme: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Youtube 2 | The source code for the Videos posted in @codewith_muhilan Youtube channel is available in this repository 3 | --------------------------------------------------------------------------------

Boat 135G Ultra Sound

RS 40,999

Boat 135G Ultra Sound

RS 40,999

Login Here

Login Here