🦉

Ahmed Talal ahmedtalaltwd7

🦉

ahmedtalaltwd7 / 2-cool-ways-to-use-has.markdown

Created July 22, 2024 00:09

2 cool ways to use :has()

ahmedtalaltwd7 / index.html

Created July 21, 2024 23:27

Responsive Grid Image Gallery ( Animation )

	<main class='gallery'>
	<div class='item' data-pos='0'><img src='https://images.unsplash.com/photo-1708247874023-f6d71a45113a?q=80&w=2344&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D'></div>
	<div class='item' data-pos='1'><img src='https://images.unsplash.com/photo-1437751059337-ea72d4f73fcf?q=80&w=2322&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D'></div>
	<div class='item' data-pos='2'><img src='https://images.unsplash.com/photo-1515594515116-863345d8507c?q=80&w=2340&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D'></div>
	<div class='item' data-pos='3'><img src='https://images.unsplash.com/photo-1533106497176-45ae19e68ba2?q=80&w=2340&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D'></div>
	<div class='item' data-pos='4'><img src='https://images.unsplash.com/photo-1517953377824-516f2dca803b?q=80&w=2378&auto=format&f

ahmedtalaltwd7 / image-zoom.markdown

Created July 21, 2024 22:55

Image Zoom

ahmedtalaltwd7 / chat-socket.markdown

Created July 1, 2022 22:58

Chat Socket

Chat example using Socket.IO and Javascript Vanilla and CSS without preprocessor

ahmedtalaltwd7 / chat-interface.markdown

Created May 27, 2022 15:35

Chat Interface

ahmedtalaltwd7 / pagination.html

Created December 2, 2021 00:54 — forked from sharu725/pagination.html

Jekyll Pagination

	<!--
	Before implementing this Jekyll snippet make sure
	1. "plugins: jekyll-paginate" is added in the _config.yml file.
	2. for loop has "paginator.post" instead of "site.posts".
	-->

	{% if paginator.total_pages > 1 %}
	<div class="wj-pagination">
	{% if paginator.previous_page %}
	<a href="{{ paginator.previous_page_path \| prepend: site.baseurl \| replace: '//', '/' }}">« Prev</a>

ahmedtalaltwd7 / index.html

Created October 22, 2021 23:46

Material design Product Card

	<div class="row">
	<div class="col l4 m8 s12 offset-m2 offset-l4">
	<div class="product-card">
	<div class="card z-depth-4">
	<div class="card-image">
	<a href="#" class="btn-floating btn-large price waves-effect waves-light brown darken-3">5 €</a>
	<!-- alternative image links:
	http://i58.photobucket.com/albums/g249/Landry_Bete/dessert14_zpsg6u4skv6.jpg
	https://www.dropbox.com/s/15xhr85exkhusgi/dessert14.jpg?raw=1 -->
	<img src="https://res.cloudinary.com/landry-bete/image/upload/v1488769144/dessert14_trnhnj.jpg" alt="product-img">