mirror of
https://github.com/onkelbeh/cheatsheets.git
synced 2025-06-16 07:07:37 +02:00
59 lines
1.1 KiB
Sass
59 lines
1.1 KiB
Sass
/*
|
|
* .post-icon -- category icons
|
|
*/
|
|
|
|
$icon-size: 56px
|
|
|
|
@mixin iconify($color, $text)
|
|
&
|
|
background: $color
|
|
color: lighten($color, 50%)
|
|
box-shadow: -2px 2px #e67e22, 2px -2px #f1c40f, 1px -2px rgba($color, 0.2), 1px 3px rgba($color, 0.3)
|
|
|
|
span:after
|
|
content: $text
|
|
|
|
.post-icon,
|
|
abbr.post-icon
|
|
border: 0
|
|
margin: 0
|
|
display: inline-block
|
|
width: $icon-size
|
|
height: $icon-size
|
|
line-height: $icon-size + 2px
|
|
text-align: center
|
|
border-radius: 50%
|
|
color: #aaa
|
|
background: #eee
|
|
|
|
+body-font
|
|
font-size: 16px
|
|
letter-spacing: 1px
|
|
|
|
span:after
|
|
content: attr(data-label)
|
|
font-size: 0.9em
|
|
position: relative
|
|
top: -1px
|
|
|
|
@media (max-width: 480px)
|
|
transform: scale(0.75)
|
|
|
|
&.-icon-css
|
|
+iconify(#3498db, 'CSS')
|
|
font-size: 14px
|
|
line-height: $icon-size + 2px
|
|
&.-icon-development
|
|
+iconify(#34495e, 'DEV')
|
|
font-size: 14px
|
|
line-height: $icon-size + 2px
|
|
&.-icon-ruby
|
|
+iconify(#e74c3c, 'RB')
|
|
text-indent: 2px
|
|
&.-icon-javascript
|
|
+iconify(#2ecc71, 'JS')
|
|
text-indent: 1px
|
|
&.-icon-productivity
|
|
+iconify(#2ecc71, 'PROD')
|
|
text-indent: 1px
|