gergelypolonkai-web-jekyll/css/style.sass
Gergely Polonkai 2336e7df0b Restyle tag labels
They now look like actual tags
2015-04-28 15:20:15 +02:00

207 lines
3.9 KiB
Sass

---
---
$main-font: sans-serif
$page-background: #333333
$content-background: #ffffff
$content-text: #544240
$header-background: #4d4d4d
$header-text: #ffffff
$menu-background: #f18137
$menu-text: #ffffff
$footer-text: #7f7f7f
$well-background: #ccc
$link-color: #018cb0
$light-color: #666
=border-top-right-radius($value)
border-top-right-radius: $value
-moz-border-radius-topright: 2px
-webkit-border-top-right-radius: $value
=border-top-left-radius($value)
border-top-left-radius: $value
-moz-border-radius-topleft: $value
-webkit-border-top-left-radius: $value
=border-bottom-right-radius($value)
border-bottom-right-radius: $value
-moz-border-radius-bottomright: $value
-webkit-border-bottom-right-radius: $value
=border-bottom-left-radius($value)
border-bottom-left-radius: $value
-moz-border-radius-bottomleft: $value
-webkit-border-bottom-left-radius: $value
=border-radius($tr, $br: $tr, $bl: $br, $tl: $tr)
+border-top-right-radius($tr)
+border-bottom-right-radius($br)
+border-bottom-left-radius($bl)
+border-top-left-radius($tl)
=background-clip-padding-box
-moz-background-clip: padding
-webkit-background-clip: padding-box
background-clip: padding-box
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6
color: $content-text
a
color: $link-color
#main-container
background-color: $content-background
.popover
max-width: 100%
.navbar-inverse
background-color: $menu-background
a.navbar-brand
color: $menu-text
.navbar-nav
li
a
color: $menu-text
font-weight: bold
li.open
background-color: $menu-background
a.dropdown-toggle
background-color: $menu-background
ul.dropdown-menu
background-color: $content-background
color: $content-text
li
background-color: $content-background
color: $content-text
a
background-color: $content-background
color: $content-text
font-weight: normal
article.post
div.meta
font-size: 80%
color: $light-color
margin-top: .8em
margin-bottom: .5em
.gist-data
max-height: 300px
overflow: auto
body
background-color: $page-background
margin: 50px 0 0 0
.well, .jumbotron
background-color: $well-background
color: $content-text
small
color: $content-background
.jumbotron
margin-top: 20px
#about-well-image
img
padding-right: 1em
#keywords-button
font-size: 50%
color: #7f7f7f
font-weight: normal
text-decoration: none
#keywords-button:hover
background-color: #4d4d4d
color: #ffffff
cursor: pointer
.keyword-first-letter
font-weight: bold
color: #f18137
.i
font-style: italic
.b
font-weight: bold
.post
margin-bottom: 2em
p.article-date
text-indent: 0
font-size: 80%
color: #7f7f7f
.paginator
margin: .5em 0
.plusone-container
margin-left: 1em
display: inline
.tag-label
+border-radius(2px, 2px, 0, 0)
+background-clip-padding-box
float: left
position: relative
background: #ccc
margin-left: 16px
margin-top: 3px
padding: 0 15px 0 14px
line-height: 24px
font-size: 12px
color: #555
display: inline-block
.tag-label:first-child
margin-left: 7px
.tag-label:before
position: absolute
left: -7px
top: 0
width: 0
height: 0
display: block
border-style: solid
border-width: 12px 7px 12px 0
border-color: transparent #ccc transparent transparent
content: ""
/* the "hole" on the left end */
.tag-label:after
content: ""
position: absolute
width: 5px
height: 5px
background: $content-background
top: 9px
left: -1px
border-radius: 50%
box-shadow: inset 0 1px 1px #aaa
.tag-label:hover:before
border-color: transparent $menu-background transparent transparent
.tag-label:hover
background: $menu-background
color: $menu-text
text-decoration: none
.tag-label:hover:after
box-shadow: inset 0 1px 1px $menu-background