simongehrig.de/scss-grid
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added Menu Mixins:

Browse Source 
Desktop vertical
Desktop vertical
Tablet/Phone Fullscreen
Toggle Button
This commit is contained in:
Simon Gehrig
2017-03-29 12:14:21 +02:00
parent 5cafe3670b
commit 9cd926a1e5
25 changed files with 2269 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/layout/image/cover/cover.html
+63
View File
@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Camera</title>
<link type="text/css"
rel="stylesheet"
href="./cover.css">
</head>
<body>
<div class="content">
<div class="img-square">
<img src="http://lorempixel.com/300/400/city/1">
</div>
<div class="img-square">
<img src="http://lorempixel.com/400/300/city/2">
</div>
<div class="img-square">
<img src="http://lorempixel.com/700/400/city/3">
</div>
<div class="img-square">
<img src="http://lorempixel.com/400/700/city/4">
</div>
</div>
<div class="content">
<div class="img-round">
<img src="http://lorempixel.com/300/400/city/1">
</div>
<div class="img-round">
<img src="http://lorempixel.com/400/300/city/2">
</div>
<div class="img-round">
<img src="http://lorempixel.com/700/400/city/3">
</div>
<div class="img-round">
<img src="http://lorempixel.com/400/700/city/4">
</div>
</div>
<div class="content">
<div class="img-wrapper">
<img src="http://lorempixel.com/300/400/city/1">
</div>
<div class="img-wrapper">
<img src="http://lorempixel.com/400/300/city/2">
</div>
<div class="img-wrapper">
<img src="http://lorempixel.com/700/400/city/3">
</div>
<div class="img-wrapper">
<img src="http://lorempixel.com/400/700/city/4">
</div>
</div>
</body>
</html>
examples/layout/image/cover/cover.scss
+21
View File
@@ -0,0 +1,21 @@
@import "../../../../framework";
.content {
.img-square {
width: 25%;
margin: 0 -4px 0 0 !important;
@include image-cover(0.75);
}
.img-round {
width: 25%;
margin-right: -4px !important;
@include image-cover(1);
img {
border-radius: 50%;
}
}
}