Event Name:
Location:
Date:
Talk topic:
SaraSoueidan
/ Event Notes.md
Last active
August 29, 2015 14:18
— forked from maban/Event Notes.md
SaraSoueidan
/ index.html
Created
February 4, 2013 13:13
A CodePen by Sara Soueidan. Responsive CSS3 Side Navigation Menu - Media Queries Transitions (resize the window slowly to see the transitions), nav items slide out on hover when it collapses on smaller screens.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <h1>Slowly resize screen to see the width transition</h1> | |
| <div class="nav-container"> | |
| <ul class="nav"> | |
| <li class="active"> | |
| <a href="#"> | |
| <span class="icon-home"></span> | |
| <span class="text">home</span> | |
| </a> | |
| </li> | |
| <li> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:13
A CodePen by Sara Soueidan. CSS3 & jQuery Mini Reminders List - Interface Inspired by Manu Gamero's Work on Dribbble:
dribbble.com/shots/786418-Mini-Reminders-PSD?list=following
======================================================
Custom Drop-Down JScript from Codrops: http://tympanus.net/codrops/2012/10/04/custom-drop-down-list-styling/
=====…
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="bar"><a href="#" id="icon">✔</a></div> | |
| <div class="wrapper"> | |
| <div class="top clearfix"> | |
| <div id="list"></div> | |
| <div id="menu"> | |
| <div id="dd" class="wrapper-dropdown"> | |
| <span>Choose List</span> | |
| <ul class="dropdown groceries-list"> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:15
A CodePen by Sara Soueidan. Custom Calendar Widget - Inspired by: http://dribbble.com/shots/513118-Calendar
======================================================
Uses jQuery UI DatePicker Widget.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="datepicker"></div> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:15
A CodePen by Sara Soueidan. Open/Fold Down Twitter Share Button
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <h2>Click to Open and tweet <br/><span><i>best viewed in Chrome</i></span></h2> | |
| <div class="wrapper"> | |
| <div class="tweet"> | |
| <button> <span class="icon-twitter"></span> Tweet</button> | |
| <div class="count">10.5K</div> | |
| </div> | |
| <div class="cover"> | |
| <span class="icon-twitter"></span> | |
| </div> | |
| </div> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:12
A CodePen by Sara Soueidan. Pure CSS3 Camera Lens Icon for Photos App - Pure CSS3.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="wrapper"> | |
| <figure> | |
| <img src="http://www.seniorcarectrs.com/wp-content/uploads/2013/01/Winter-Snowman.jpg" /> | |
| <figcaption>Snowman with Trees</figcaption> | |
| </figure> | |
| <figure> | |
| <img src="http://hdwpapers.com/thumbs/winter_snow_wallpaper_2-t2.jpg" /> | |
| <figcaption>Winter Scenery</figcaption> | |
| </figure> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:13
A CodePen by Sara Soueidan. CSS3 Black Navigation Menu - Inspired by Dribbblr Asif Aleem's work:
http://dribbble.com/shots/757351-Navigation-Menus-PSD?list=46244-Freebies
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="wrapper-1"> | |
| <ul id="nav"> | |
| <li><b class="icon-home"></b></li> | |
| <li><b class="icon-picture"></b></li> | |
| <li class="active"><b class="icon-facetime-video"></b></li> | |
| <li><b class="icon-headphones"></b></li> | |
| <li><b class="icon-user"></b></li> | |
| </ul> | |
| </div> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:13
A CodePen by Sara Soueidan. CSS3 Multiple-Choice “Windowed Slider” UI - Based on Chris Norström's Article here: http://www.chrisnorstrom.com/2012/11/invention-multiple-choice-windowed-slider-ui/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="wrapper-1"> | |
| <div class="container"> | |
| <input type="checkbox" id="check" class="checkbox"/> | |
| <label for="check"></label> | |
| <div class="left">NO</div> | |
| <div class="right">YES</div> | |
| <div class="slider"></div> | |
| </div> | |
| <div class="container container-3"> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:15
A CodePen by Sara Soueidan. CSS3 Creative Resume - I thought this would be a perfect project to use LESS mixins in.
Designed by: Pixeden: http://www.pixeden.com/resumes-templates/creative-resume-template-vol-1
Librarian Image is from Dribbble: http://dribbble.com/shots/271458-Librarian by talented "Artua"
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="container"> | |
| <div class="word_split wrapper"> | |
| <span class="word word1"> Antony </span> | |
| <span class="word word2">Smith</span> | |
| <span class="word word3">Personal</span> | |
| <span class="word word4">Details</span> | |
| <span class="word word5">Employment</span> | |
| <span class="word word6">History </span> | |
| <span class="word word7">Education</span> | |
| <span class="word word8">Personal</span> |
SaraSoueidan
/ index.html
Created
February 4, 2013 13:15
A CodePen by Sara Soueidan. Fold-Up Mobile Menu Concept - For best effect view it in Chrome.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="wrapper"> | |
| <div class="container"> | |
| <h2>Fold-Up Mobile Menu</h2> | |
| <p> Best viewed in Chrome</p> | |
| <div class="background"> | |
| <figure> | |
| <div class="img-wrapper"> | |
| <img src="http://sarasoueidan.com/RESOURCES/img1.jpg" width="170" height="100" /> | |
| </div><!--end imh wrapper--> |
OlderNewer