Skip to content

Instantly share code, notes, and snippets.

View jahidHn's full-sized avatar

Jahid Hasan jahidHn

View GitHub Profile
@jahidHn
jahidHn / media-query.css
Created September 3, 2014 06:21
Media-query
/*==================================================
= Bootstrap 3 Media Queries =
==================================================*/
/*========== Mobile First Method ==========*/
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
}
@jahidHn
jahidHn / using localhost as a ftp server
Last active April 6, 2018 03:45
How to setup ftp server in ubuntu
Command Line:
# Install Lamp
Configure for permission:
cd /var/www/html
sudo chown -R user:www-data /var/www/html/
sudo chmod -R 775 /var/www/html/
sudo chmod g+s /var/www/html/
#Install ftp [vsftpd]
@jahidHn
jahidHn / index.html
Created September 20, 2015 11:09
jquery.s
<div class="messagepop pop">
<form method="post" id="new_message" action="/messages">
<p><label for="email">Your email or name</label><input type="text" size="30" name="email" id="email" /></p>
<p><label for="body">Message</label><textarea rows="6" name="body" id="body" cols="35"></textarea></p>
<p><input type="submit" value="Send Message" name="commit" id="message_submit"/> or <a class="close" href="/">Cancel</a></p>
</form>
</div>
<a href="/contact" id="contact">Contact Us</a>
@jahidHn
jahidHn / Responsive Modal Design.markdown
Created March 28, 2016 06:56
Responsive Modal Design

Responsive Modal Design

Material Design inspired modals. No jQuery required. Responsive. Read the how to on Ettrics.com

A Pen by Ettrics on CodePen.

License.

<div ng-app="myApp" id="container">
<div class="u-wrapper u-paddingHm u-paddingTl" ng-controller="MainController as mainCtrl">
<header class="u-marginBl u-textCenter">
<div>
<svg class="u-inlineBlock" width="58px" height="58px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 54 54"><g><path fill="#4CAF50" d="M3.1,27.9c0,0,10.2-24.1,11.6-27.2c0.2-0.5,0.6-0.8,1.2-0.6c0.5,0.1,0.8,0.7,1.5,2.2c1.3,2.9,18,37.2,18.7,38.6c0.8,1.6,1,2.6,0.7,3.4c-0.3,0.6-1,1.1-1.8,1.4c-2.3,0.9-20.3,7.8-21.5,8.3c-0.7,0.3-0.8-0.4-1.4-1.7C11.6,51,3.7,32.1,3.1,30.7C2.5,29.3,3.1,27.9,3.1,27.9z"/><path fill="#2196F3" d="M50.9,17.3c-0.3-0.3-0.4-0.4-0.7-0.2c-0.3,0.1-11.5,8.6-16.8,12.5c2.7,5.5,4.7,9.7,5,10.2c0.4,0.8,0.8,1.7,1,2.6c0.1-0.2,0.2-0.3,0.3-0.5c0.9-1.8,11.3-23.4,11.5-23.8C51.3,17.7,51.2,17.7,50.9,17.3z"/></g></svg>
<h2 class="u-marginTs">vModal</h2>
</div>

Modal windows

Modals with nice effects written with SASS/Compass. I divided my effects in separated SASS partials so I can exclude effects when I don't use them to reduce bloat in the compiled CSS file. Effect credits go to Codrops.

A Pen by Jeroen van Beek on CodePen.

License.

Modal Animations

Most of the time these slide in or fade in - just playing with other instantiation animations.

All animations are class-driven, and are animating the exact same HTML elements.

Forked from Jesse Couch's Pen Modal Animations.

A Pen by Jahid Hasan on CodePen.

@jahidHn
jahidHn / CSS3 Loading Animation.markdown
Created April 3, 2016 12:59
CSS3 Loading Animation
@jahidHn
jahidHn / gist:15c1390d4b3d6a9b795f8791d58b50e7
Created April 25, 2017 08:26 — forked from patricklindsay/gist:8945d08bc063bec306479713963f16ec
Vacation Niseko Word Count in Detail 05/04/2017
Calculating Total Word Count..
Counting Integral::Pages Word Count
Title: 105
Description: 582
Body: 12743
Total: 13430
Counting SpecialOffers Word Count
Title: 197