ID: 445744b5fa70334b90357efb70237beff3f89b90
319 lines
—
11K —
View raw
| @require 'reset.styl'
body
> .container
margin auto
max-width 80%
/* Page header */
> .header
padding 1em 0
text-align center
> .flex-container
display flex
flex-direction row
flex-wrap wrap
justify-content space-between
align-content stretch
align-items flex-start
width 80%
margin auto
> .flex-item
order 0
flex 0 1 auto
align-self auto
/* Logo text */
a.logo,
a.logo:hover,
a.logo:visited
color #000
font-weight bold
text-decoration none
/* Logo picture */
img
height 1.5em
margin 0 1em
vertical-align middle
/* Menu under the logo */
> .menu
display flex
flex-direction row
flex-wrap wrap
justify-content flex-end
align-content flex-start
align-items flex-start
margin 1em auto
width 80%
> .flex-item
order 0
flex 0 1 auto
align-self auto
margin .5em 1em
/* Highlight username if there are unread messages */
.new_messages
background-color rgb(255, 175, 50)
border-radius 4px
color #fff
font-weight bold
margin 0
padding .5em .5em
text-decoration none
> .content
padding 1em 0
line-height 1.5em
.vote
margin 0 1.5em 0 0
> a
display: inline-block
margin: 0
overflow: hidden
padding: 0
text-decoration none
vertical-align middle
/* up-down arrows are images */
img
cursor pointer
height 1em
margin 0
padding .2em
float left
/* Arrow style if already upvoted (green) */
.upvoted
background-color #fff
border 1px solid #00E313
border-radius 999em
/* Arrow style if already upvoted (red) */
.downvoted
background-color #fff
border 1px solid #FF0000
border-radius 999em
/* Votes counter */
.count
margin 0 .5em
/* Home page */
.posts
/* A singe post */
.post
margin 0 0 2em 0
vertical-align top
> .title
font-size 1.5em
> a
color #000
/* Some post info showed below the title */
> .info
color #666
margin .5em 0
opacity .8
/* New submission page */
> form.submit
margin auto
max-width 30em
/* Page for a post */
> .post
/* Style used to format Markdown tables */
table
background #fff
border-collapse collapse
text-align left
th
border-bottom 2px solid #6678b1
color #039
font-weight normal
padding 0 1em
td
border-bottom 1px solid #ccc
color #669
padding .5em 1em
tbody tr:hover td
color #009
/* The post title */
> .title
font-size 1.5em
/* Info below post title */
.info
margin 1em 0
/* Post text */
> .text
margin 1em 2.5em
word-wrap break-word
/* The "new comment" form for this post page */
.new_comment
margin 0 2.5em
overflow hidden
> textarea
height 2.5em
-webkit-transition 1s
transition 1s
> textarea:focus
height 10em
> input[type=submit]
float right
margin 1em 0
/* Comments tree for the Post page */
> .comments
margin 5em 0 0 0
/* A single comment in the tree */
> .comment
margin 0 0 2em 0
overflow hidden
/* This is just a mark to indicate the beginning
* of a new comment. The only reason for this is
* to make the thread more readable
*/
> .pin
color #f00 /* #CD006B */
float left
font-size .5em
padding 0 1em 0 0
vertical-align top
/* Some info about this comment */
> .info
font-size .9em
margin 0 0 0 1em
.username > a,
.username > a:hover
font-weight bold
.op > a,
.op > a:hover
background-color rgb(255, 175, 50)
border-radius 4px
color #fff
font-weight bold
margin 0 .5em 0 0
padding 0em 0.5em
text-decoration none
> .vote
margin 0 1em
/* The comment text */
> .text
margin .5em 0 0 1.5em
word-wrap break-word
/* Give the comment that's linked to in the URL location hash a lightyellow background color */
.comment:target
background-color lightyellow
/* User home page */
table.user
/* If one length specified: both horizontal and vertical spacing
* If two length specified: first sets the horizontal spacing, and
* the second sets the vertical spacing
*/
border-spacing 2em 1em
border-collapse separate
margin auto
width 80%
tr
> td:first-child
font-weight bold
text-align right
vertical-align top
width 30%
> td:last-child
text-align left
/* User activity */
> .user_activity
> *
margin 0 0 2em 0
> .info
color #888
/* Login page */
> .login
margin auto
max-width 20em
input[type=submit]
margin 1em 0
.title
line-height 2em
/* Page to edit a post or a comment */
> .edit
{
}
/* Page to reply to a comment */
> .reply
{
}
/* About page */
> .about
> h3
margin 1em 0 .5em 0
> p
line-height 1.5em
> footer
border-top 1px solid #6ECFFF
margin 3em 0 0 0
padding 2em 0
img
height 1.2em
margin 0 .5em 0 0
vertical-align middle
> ul
list-style none
margin 0
overflow hidden
padding 0
> li
float left
margin 0 2em 0 0
|