mirror/flexbox-patterns
1
0
Fork 0
mirror of https://github.com/cjcenizal/flexbox-patterns.git synced 2025-08-19 14:22:37 +02:00
Code Issues Releases Wiki Activity

Add Post and Stream patterns.

Browse Source 
- Upgrade FontAwesome to 4.7.0.
This commit is contained in:
CJ Cenizal
2016-12-30 10:31:04 -08:00
parent a1b5188de0
commit 9bc53b177b
10 changed files with 561 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
dist/index.html vendored
View File

@@ -3,8 +3,8 @@
<head>
<title>Flexbox Patterns Demo Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="http://fonts.googleapis.com/css?family=Lato:400" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link href="http://fonts.googleapis.com/css?family=Lato:400,700" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="styles.css" rel="stylesheet" type="text/css">
<style>
body {
@@ -73,6 +73,25 @@
</div>
</div>
</div>
<!-- Post-->
<div class="demo"><div class="post">
<div class="postUser">
<div class="postUser__portrait">
<span class="icon fa fa-user-circle-o"></span>
</div>
<div class="postUser__name">Sherlyn S.</div>
</div>
<div class="postBody">
<div class="postBody__content">
I built a tree house out of reclaimed cedar and gave it a coat of my home-made
organic coffee-based varnish. Tree housewarming party this weekend!
</div>
<div class="postBody__date">
December 4, 2023
</div>
</div>
</div>
</div>
<!-- Side bar-->
<div class="demo"><div class="sideBar">
@@ -127,6 +146,80 @@
<div class="featureListItem__description">You can get notified by email or SMS.</div>
</div>
</div>
<!-- Stream-->
<div class="demo"><div class="stream">
<div class="post">
<div class="postUser">
<div class="postUser__portrait">
<span class="icon fa fa-user-circle-o"></span>
</div>
<div class="postUser__name">CJ C.</div>
</div>
<div class="postBody">
<div class="postBody__content">
Going hiking with @karla in Yosemite!
</div>
<div class="postBody__date">
May 27, 2027
</div>
</div>
</div>
<div class="post">
<div class="postUser">
<div class="postUser__portrait">
<span class="icon fa fa-user-circle-o"></span>
</div>
<div class="postUser__name">Jatesh V.</div>
</div>
<div class="postBody">
<div class="postBody__content">
Flexboxpatterns.com is the most amazing flexbox resource I've ever used! It's changed my
life forever and now everybody tells me that *I'M* amazing, too! Use flexboxpatterns.com!
Love flexboxpatterns.com!
</div>
<div class="postBody__date">
May 28, 2027
</div>
</div>
</div>
<div class="post">
<div class="postUser">
<div class="postUser__portrait">
<span class="icon fa fa-user-circle-o"></span>
</div>
<div class="postUser__name">Damien S.</div>
</div>
<div class="postBody">
<div class="postBody__content">
Anybody else wondering when the Blade Runner and Westworld tie-in will be released? #crossover
#replicant
</div>
<div class="postBody__date">
June 1, 2027
</div>
</div>
</div>
<div class="post">
<div class="postUser">
<div class="postUser__portrait">
<span class="icon fa fa-user-circle-o"></span>
</div>
<div class="postUser__name">Ziggie G.</div>
</div>
<div class="postBody">
<div class="postBody__content">
I love eating pizza!!!!!!!
</div>
<div class="postBody__date">
June 5, 2027
</div>
</div>
</div>
</div>
</div>
<!-- Card-->
<div class="demo"><div class="card card--fixedWidth">