Implemented most of the styles in scarlet now
This commit is contained in:
parent
31dfc47d5c
commit
59ef1f53f2
@ -5,10 +5,10 @@
|
|||||||
"Ubuntu"
|
"Ubuntu"
|
||||||
],
|
],
|
||||||
"styles": [
|
"styles": [
|
||||||
"reset",
|
"libs/reset",
|
||||||
"font-awesome",
|
"libs/font-awesome",
|
||||||
"config",
|
"include/config",
|
||||||
"mixins",
|
"include/mixins",
|
||||||
"base",
|
"base",
|
||||||
"typography",
|
"typography",
|
||||||
"layout",
|
"layout",
|
||||||
|
|||||||
@ -3,7 +3,7 @@ component Dashboard(posts []*arn.Post)
|
|||||||
|
|
||||||
.dashboard-widget
|
.dashboard-widget
|
||||||
each post in posts
|
each post in posts
|
||||||
a.dashboard-event.ui.ajax(href=post.Link())
|
a.dashboard-event.ajax(href=post.Link())
|
||||||
.dashboard-event-author
|
.dashboard-event-author
|
||||||
AvatarNoLink(post.Author())
|
AvatarNoLink(post.Author())
|
||||||
.dashboard-event-text
|
.dashboard-event-text
|
||||||
|
|||||||
@ -1,23 +1,22 @@
|
|||||||
.dashboard-widget
|
.dashboard-widget
|
||||||
display flex
|
vertical
|
||||||
flex-flow column
|
|
||||||
align-items center
|
align-items center
|
||||||
|
|
||||||
.dashboard-event
|
.dashboard-event
|
||||||
display flex
|
vertical-wrap
|
||||||
flex-flow column wrap
|
ui-element
|
||||||
margin-bottom 1rem
|
margin-bottom 1rem
|
||||||
padding 0.75rem
|
padding 0.75rem
|
||||||
width 100%
|
width 100%
|
||||||
max-width 700px
|
max-width 700px
|
||||||
|
|
||||||
.dashboard-event-author
|
.dashboard-event-author
|
||||||
display flex
|
horizontal
|
||||||
justify-content center
|
justify-content center
|
||||||
width 100%
|
width 100%
|
||||||
|
|
||||||
.dashboard-event-text
|
.dashboard-event-text
|
||||||
display flex
|
horizontal
|
||||||
justify-content center
|
justify-content center
|
||||||
align-items center
|
align-items center
|
||||||
width 100%
|
width 100%
|
||||||
@ -10,10 +10,11 @@ component ThreadLink(thread *arn.Thread)
|
|||||||
.post-author.thread-author
|
.post-author.thread-author
|
||||||
Avatar(thread.Author())
|
Avatar(thread.Author())
|
||||||
.thread-content-container
|
.thread-content-container
|
||||||
.post-content.thread-content
|
.thread-content
|
||||||
if thread.Sticky
|
if thread.Sticky
|
||||||
i.fa.fa-thumb-tack.fa-fw.thread-icon
|
Icon("thumb-tack")
|
||||||
a.thread-title.ajax(href="/threads/" + thread.ID)= thread.Title
|
a.thread-link-title.ajax(href="/threads/" + thread.ID)= thread.Title
|
||||||
|
.spacer
|
||||||
.thread-reply-count= thread.Replies
|
.thread-reply-count= thread.Replies
|
||||||
.thread-icons
|
.thread-icons
|
||||||
Icon(arn.GetForumIcon(thread.Tags[0]))
|
Icon(arn.GetForumIcon(thread.Tags[0]))
|
||||||
@ -1,7 +1,7 @@
|
|||||||
component Thread(thread *arn.Thread, posts []*arn.Post)
|
component Thread(thread *arn.Thread, posts []*arn.Post)
|
||||||
.thread
|
|
||||||
h2.thread-title= thread.Title
|
h2.thread-title= thread.Title
|
||||||
|
|
||||||
|
.thread
|
||||||
.posts
|
.posts
|
||||||
Postable(thread.ToPostable(), nil, thread.Author().ID)
|
Postable(thread.ToPostable(), nil, thread.Author().ID)
|
||||||
|
|
||||||
|
|||||||
16
pages/threads/threads.scarlet
Normal file
16
pages/threads/threads.scarlet
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
.thread
|
||||||
|
horizontal
|
||||||
|
justify-content center
|
||||||
|
|
||||||
|
.posts
|
||||||
|
vertical
|
||||||
|
width 100%
|
||||||
|
max-width 830px
|
||||||
|
|
||||||
|
.post
|
||||||
|
vertical
|
||||||
|
margin-bottom 1rem
|
||||||
|
|
||||||
|
> 600px
|
||||||
|
.post
|
||||||
|
horizontal
|
||||||
@ -21,8 +21,14 @@ a
|
|||||||
:active
|
:active
|
||||||
transform translateY(3px)
|
transform translateY(3px)
|
||||||
|
|
||||||
|
&.active
|
||||||
|
color link-active-color
|
||||||
|
|
||||||
strong
|
strong
|
||||||
font-weight bold
|
font-weight bold
|
||||||
|
|
||||||
em
|
em
|
||||||
font-style italic
|
font-style italic
|
||||||
|
|
||||||
|
.spacer
|
||||||
|
flex 1
|
||||||
@ -1,4 +1,5 @@
|
|||||||
#content
|
#content
|
||||||
vertical
|
vertical
|
||||||
padding content-padding
|
padding content-padding
|
||||||
|
padding-top content-padding-top
|
||||||
line-height 1.7em
|
line-height 1.7em
|
||||||
@ -1,26 +1,78 @@
|
|||||||
.forum-header
|
.forum-header
|
||||||
text-align left
|
text-align left
|
||||||
|
margin-bottom 1rem
|
||||||
|
|
||||||
.post-content
|
.post-content
|
||||||
|
ui-element
|
||||||
|
flex-grow 1
|
||||||
|
padding 0.8rem 1rem
|
||||||
|
position relative
|
||||||
|
|
||||||
|
h1
|
||||||
|
font-size 1.5rem
|
||||||
|
line-height 2em
|
||||||
|
|
||||||
|
h2
|
||||||
|
font-size 1.3rem
|
||||||
|
line-height 2em
|
||||||
|
font-weight normal
|
||||||
|
|
||||||
|
h3
|
||||||
|
font-size 1.1rem
|
||||||
|
line-height 2em
|
||||||
|
font-weight normal
|
||||||
|
|
||||||
|
:hover
|
||||||
|
.post-toolbar
|
||||||
|
opacity 1
|
||||||
|
|
||||||
|
.thread-content
|
||||||
|
horizontal
|
||||||
ui-element
|
ui-element
|
||||||
padding 0.4rem 1rem
|
padding 0.4rem 1rem
|
||||||
|
align-items center
|
||||||
|
|
||||||
.thread-link
|
.thread-link
|
||||||
horizontal
|
horizontal
|
||||||
|
|
||||||
|
.thread-icons,
|
||||||
|
.thread-reply-count
|
||||||
|
opacity 0.5
|
||||||
|
text-align right
|
||||||
|
font-size 0.9rem
|
||||||
|
|
||||||
|
.thread-reply-count
|
||||||
|
margin-right 0.5rem
|
||||||
|
|
||||||
.thread-content-container
|
.thread-content-container
|
||||||
flex 1
|
flex 1
|
||||||
vertical
|
vertical
|
||||||
justify-content center
|
justify-content center
|
||||||
|
|
||||||
.thread-content
|
.thread-link-title
|
||||||
horizontal
|
color text-color
|
||||||
|
|
||||||
.forum-tags
|
.forum-tags
|
||||||
margin-bottom content-padding
|
margin-bottom 1rem
|
||||||
|
|
||||||
|
.post-author
|
||||||
|
horizontal
|
||||||
|
justify-content center
|
||||||
|
align-items flex-start
|
||||||
|
margin 0.25rem 0.5rem
|
||||||
|
margin-left 0
|
||||||
|
|
||||||
// Toolbar
|
// Toolbar
|
||||||
|
|
||||||
|
.post-toolbar
|
||||||
|
horizontal
|
||||||
|
opacity 0
|
||||||
|
position absolute
|
||||||
|
bottom 3px
|
||||||
|
right 0
|
||||||
|
margin-right 0.5rem
|
||||||
|
default-transition
|
||||||
|
|
||||||
.post-tool
|
.post-tool
|
||||||
opacity 0.7
|
opacity 0.7
|
||||||
&:hover
|
&:hover
|
||||||
|
|||||||
@ -1,2 +1,3 @@
|
|||||||
i.fa
|
.fa + span,
|
||||||
margin-right 0.5em
|
.fa + a
|
||||||
|
margin-left 0.5em
|
||||||
@ -3,6 +3,7 @@ text-color = rgb(60, 60, 60)
|
|||||||
main-color = rgb(248, 165, 130)
|
main-color = rgb(248, 165, 130)
|
||||||
link-color = rgb(245, 126, 76)
|
link-color = rgb(245, 126, 76)
|
||||||
link-hover-color = rgb(242, 93, 30)
|
link-hover-color = rgb(242, 93, 30)
|
||||||
|
link-active-color = rgb(100, 149, 237)
|
||||||
post-highlight-color = rgba(248, 165, 130, 0.7)
|
post-highlight-color = rgba(248, 165, 130, 0.7)
|
||||||
|
|
||||||
// UI
|
// UI
|
||||||
@ -30,7 +31,8 @@ outline-shadow-medium = 0 0 6px rgba(0, 0, 0, 0.13)
|
|||||||
outline-shadow-heavy = 0 0 6px rgba(0, 0, 0, 0.6)
|
outline-shadow-heavy = 0 0 6px rgba(0, 0, 0, 0.6)
|
||||||
|
|
||||||
// Distances
|
// Distances
|
||||||
content-padding = 1.5rem
|
content-padding = 1.6rem
|
||||||
|
content-padding-top = 2rem
|
||||||
hover-line-size = 2px
|
hover-line-size = 2px
|
||||||
nav-height = 3.11rem
|
nav-height = 3.11rem
|
||||||
|
|
||||||
@ -4,6 +4,7 @@
|
|||||||
height nav-height
|
height nav-height
|
||||||
overflow hidden
|
overflow hidden
|
||||||
background-color nav-color
|
background-color nav-color
|
||||||
|
justify-content center
|
||||||
// border-bottom ui-border
|
// border-bottom ui-border
|
||||||
|
|
||||||
.navigation-link
|
.navigation-link
|
||||||
@ -34,3 +35,13 @@
|
|||||||
font-size 1.1em
|
font-size 1.1em
|
||||||
line-height 1em
|
line-height 1em
|
||||||
padding 0.75em 1em
|
padding 0.75em 1em
|
||||||
|
|
||||||
|
.navigation-text
|
||||||
|
display none
|
||||||
|
|
||||||
|
> 930px
|
||||||
|
#navigation
|
||||||
|
justify-content flex-start
|
||||||
|
|
||||||
|
.navigation-text
|
||||||
|
display inline-block
|
||||||
@ -1,101 +0,0 @@
|
|||||||
.anime-list-container
|
|
||||||
text-align left
|
|
||||||
|
|
||||||
.embedded-anime-list-container
|
|
||||||
.anime-list
|
|
||||||
width calc(100% - 225px - 1em)
|
|
||||||
.anime-list-image
|
|
||||||
display block
|
|
||||||
|
|
||||||
.anime-list
|
|
||||||
list-style-type none
|
|
||||||
margin 0
|
|
||||||
width 100%
|
|
||||||
max-width 750px
|
|
||||||
|
|
||||||
.anime-status-icon
|
|
||||||
margin 0 !important
|
|
||||||
|
|
||||||
.anime-list-image
|
|
||||||
display none
|
|
||||||
position fixed
|
|
||||||
top 50%
|
|
||||||
right calc(16px + 1em)
|
|
||||||
z-index 9999
|
|
||||||
width 225px
|
|
||||||
margin 0
|
|
||||||
padding 0
|
|
||||||
opacity 0
|
|
||||||
border-radius 3px
|
|
||||||
box-shadow 0px 0px 8px rgba(0, 0, 0, 0.4)
|
|
||||||
transform translate(10%, -50%)
|
|
||||||
transition all transitionSpeed ease
|
|
||||||
pointer-events none
|
|
||||||
|
|
||||||
.anime
|
|
||||||
padding 0.25em 0.75em
|
|
||||||
border uiBorder
|
|
||||||
border-radius 3px
|
|
||||||
margin 0.25em 0
|
|
||||||
background uiBackground
|
|
||||||
display flex
|
|
||||||
flex-direction row
|
|
||||||
transition all 200ms ease
|
|
||||||
&:hover
|
|
||||||
background uiHoverBackground
|
|
||||||
.anime-list-image
|
|
||||||
opacity 1
|
|
||||||
transform translate(0, -50%)
|
|
||||||
|
|
||||||
.anime-title
|
|
||||||
.anime-view-link
|
|
||||||
color darken(mainColor, 30%) !important
|
|
||||||
&:hover
|
|
||||||
color rgb(255, 32, 12) !important
|
|
||||||
|
|
||||||
.anime-title
|
|
||||||
flex-grow 0
|
|
||||||
flex-shrink 1
|
|
||||||
white-space nowrap
|
|
||||||
text-overflow ellipsis
|
|
||||||
overflow hidden
|
|
||||||
|
|
||||||
.spacer
|
|
||||||
flex 1
|
|
||||||
|
|
||||||
.anime-completed
|
|
||||||
.anime-warning
|
|
||||||
.anime-up-to-date
|
|
||||||
.anime-download-link
|
|
||||||
flex 0 0 32px
|
|
||||||
text-align right
|
|
||||||
|
|
||||||
.anime-completed
|
|
||||||
color blue !important
|
|
||||||
opacity 0.25
|
|
||||||
&:hover
|
|
||||||
opacity 0.7
|
|
||||||
|
|
||||||
.anime-warning
|
|
||||||
color red !important
|
|
||||||
opacity 0.2
|
|
||||||
&:hover
|
|
||||||
opacity 0.7
|
|
||||||
|
|
||||||
.anime-up-to-date
|
|
||||||
color green !important
|
|
||||||
opacity 0.7
|
|
||||||
|
|
||||||
.airing-date
|
|
||||||
.episodes-behind
|
|
||||||
flex-grow 0
|
|
||||||
flex-shrink 1
|
|
||||||
opacity 0.5
|
|
||||||
text-align right
|
|
||||||
white-space nowrap
|
|
||||||
|
|
||||||
.episodes-behind
|
|
||||||
&:before
|
|
||||||
content '+'
|
|
||||||
&:after
|
|
||||||
content ''
|
|
||||||
@ -1,105 +0,0 @@
|
|||||||
html
|
|
||||||
height 100%
|
|
||||||
|
|
||||||
body
|
|
||||||
font-family "Ubuntu", "Trebuchet MS", sans-serif
|
|
||||||
font-size 1.05rem
|
|
||||||
tab-size 4
|
|
||||||
overflow hidden
|
|
||||||
height 100%
|
|
||||||
|
|
||||||
a
|
|
||||||
text-decoration none
|
|
||||||
transition all transitionSpeed ease
|
|
||||||
&:hover
|
|
||||||
text-decoration none
|
|
||||||
&:active
|
|
||||||
transform translateY(3px)
|
|
||||||
|
|
||||||
/*.page
|
|
||||||
height 100vh*/
|
|
||||||
|
|
||||||
section
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
|
|
||||||
.icon-list
|
|
||||||
margin-left 1px !important
|
|
||||||
list-style-type none
|
|
||||||
.fa
|
|
||||||
opacity 0.93
|
|
||||||
|
|
||||||
.powered-by
|
|
||||||
opacity 0.8
|
|
||||||
font-size 0.9em
|
|
||||||
margin-top 1em
|
|
||||||
|
|
||||||
.maintenance
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
text-align center
|
|
||||||
padding 1em
|
|
||||||
font-size 3em
|
|
||||||
line-height 1.5em
|
|
||||||
|
|
||||||
.region-block
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
font-size 1.2em
|
|
||||||
padding 1em
|
|
||||||
p
|
|
||||||
text-align center
|
|
||||||
max-width none
|
|
||||||
|
|
||||||
.editor-info
|
|
||||||
max-width 1200px
|
|
||||||
|
|
||||||
// tooltipOffset = -10px
|
|
||||||
//
|
|
||||||
// .tooltip
|
|
||||||
// display inline-block
|
|
||||||
// position relative
|
|
||||||
//
|
|
||||||
// &:after
|
|
||||||
// display inline
|
|
||||||
// content attr(data-tooltip)
|
|
||||||
// opacity 0
|
|
||||||
// transition opacity 250ms ease
|
|
||||||
// background rgb(48, 48, 48)
|
|
||||||
// border-radius 3px
|
|
||||||
// color rgb(255, 255, 255)
|
|
||||||
// // box-shadow 0 0 8px rgba(0, 0, 0, 0.2)
|
|
||||||
// padding 0.3rem 0.75rem
|
|
||||||
// width auto
|
|
||||||
// pointer-events none
|
|
||||||
//
|
|
||||||
// position absolute
|
|
||||||
// left 50%
|
|
||||||
// top tooltipOffset
|
|
||||||
// transform translate(-50%, -100%)
|
|
||||||
// z-index 100
|
|
||||||
//
|
|
||||||
// margin 0
|
|
||||||
//
|
|
||||||
// &:before
|
|
||||||
// content ""
|
|
||||||
// border solid
|
|
||||||
// border-color rgb(60, 60, 60) transparent
|
|
||||||
// border-width 6px 6px 0 6px
|
|
||||||
// opacity 0
|
|
||||||
// transition opacity 250ms ease
|
|
||||||
// pointer-events none
|
|
||||||
// margin 0
|
|
||||||
// padding 0
|
|
||||||
//
|
|
||||||
// position absolute
|
|
||||||
// left 50%
|
|
||||||
// top tooltipOffset
|
|
||||||
// transform translateX(-50%)
|
|
||||||
// z-index 99
|
|
||||||
//
|
|
||||||
// &:hover
|
|
||||||
// &:after
|
|
||||||
// opacity 1
|
|
||||||
// &:before
|
|
||||||
// opacity 1
|
|
||||||
@ -1,91 +0,0 @@
|
|||||||
html, body
|
|
||||||
color textColor
|
|
||||||
background-color rgb(254, 254, 254)
|
|
||||||
|
|
||||||
a
|
|
||||||
color mainColor
|
|
||||||
&:hover
|
|
||||||
color hoverColor
|
|
||||||
|
|
||||||
#header
|
|
||||||
background-color rgb(245, 245, 245)
|
|
||||||
background-image url("/images/characters/pencil-girl.png")
|
|
||||||
background-repeat no-repeat
|
|
||||||
background-size auto 100%
|
|
||||||
background-position 100% 0%
|
|
||||||
|
|
||||||
#slogan
|
|
||||||
color rgb(120, 120, 120)
|
|
||||||
|
|
||||||
#content
|
|
||||||
background-color transparent
|
|
||||||
|
|
||||||
a
|
|
||||||
color linkColor
|
|
||||||
&:hover
|
|
||||||
color linkHoverColor
|
|
||||||
|
|
||||||
.active
|
|
||||||
color activeLinkColor
|
|
||||||
&:hover
|
|
||||||
color @color
|
|
||||||
|
|
||||||
.navigation-link
|
|
||||||
color rgb(160, 160, 160)
|
|
||||||
&.active
|
|
||||||
&:hover
|
|
||||||
color rgb(80, 80, 80)
|
|
||||||
text-shadow 1px 1px 3px rgba(4, 4, 4, 0.1)
|
|
||||||
|
|
||||||
.saving
|
|
||||||
opacity 0.5 !important
|
|
||||||
|
|
||||||
input[type="text"]
|
|
||||||
input[type="email"]
|
|
||||||
input[type="password"]
|
|
||||||
input[type="url"]
|
|
||||||
input[type="number"]
|
|
||||||
textarea
|
|
||||||
color rgb(32, 32, 32)
|
|
||||||
background-color rgb(255, 255, 255)
|
|
||||||
box-shadow none
|
|
||||||
border 1px solid rgba(0, 0, 0, 0.1)
|
|
||||||
&:focus
|
|
||||||
color rgb(0, 0, 0)
|
|
||||||
box-shadow 0 0 6px alpha(mainColor, 20%)
|
|
||||||
border 1px solid mainColor
|
|
||||||
&:disabled
|
|
||||||
background-color rgb(224, 224, 224)
|
|
||||||
cursor not-allowed
|
|
||||||
|
|
||||||
button
|
|
||||||
select
|
|
||||||
border 1px solid rgb(170, 170, 170)
|
|
||||||
color rgb(32, 32, 32)
|
|
||||||
background linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.04) 100%)
|
|
||||||
box-shadow 0 0 2px rgb(255, 255, 255), 0 -2px 5px rgba(0, 0, 0, 0.08) inset
|
|
||||||
&:focus
|
|
||||||
color rgb(0, 0, 0)
|
|
||||||
box-shadow 0 0 6px alpha(mainColor, 20%)
|
|
||||||
border 1px solid mainColor
|
|
||||||
|
|
||||||
input[type="submit"]:hover
|
|
||||||
button:hover
|
|
||||||
.button:hover
|
|
||||||
cursor pointer
|
|
||||||
background linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.04) 100%)
|
|
||||||
text-decoration none
|
|
||||||
|
|
||||||
button[disabled]
|
|
||||||
opacity 0.5
|
|
||||||
&:hover
|
|
||||||
cursor not-allowed
|
|
||||||
color rgb(32, 32, 32)
|
|
||||||
background linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.04) 100%)
|
|
||||||
|
|
||||||
.user-name
|
|
||||||
a
|
|
||||||
color rgb(16, 16, 16)
|
|
||||||
|
|
||||||
.list-provider-name-highlight
|
|
||||||
color rgb(48, 48, 48)
|
|
||||||
@ -1,28 +0,0 @@
|
|||||||
textColor = rgb(60, 60, 60)
|
|
||||||
mainColor = rgb(248, 165, 130)
|
|
||||||
hoverColor = darken(mainColor, 10%)
|
|
||||||
linkColor = darken(mainColor, 15%)
|
|
||||||
linkHoverColor = darken(hoverColor, 20%)
|
|
||||||
activeLinkColor = rgb(100, 149, 237)
|
|
||||||
uiBorder = 1px solid rgba(0, 0, 0, 0.1)
|
|
||||||
uiHoverBorder = 1px solid rgba(0, 0, 0, 0.15)
|
|
||||||
uiBackground = linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.037) 100%)
|
|
||||||
uiHoverBackground = linear-gradient(to bottom, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.027) 100%)
|
|
||||||
outlineShadowLight = 0 0 6px alpha(black, 0.05)
|
|
||||||
outlineShadowMedium = 0 0 6px alpha(black, 0.13)
|
|
||||||
outlineShadowHeavy = 0 0 6px alpha(black, 0.6)
|
|
||||||
transitionSpeed = 290ms
|
|
||||||
fadeSpeed = 200ms
|
|
||||||
contentPadding = 1.5rem
|
|
||||||
contentPaddingMobile = 1rem
|
|
||||||
|
|
||||||
uiElement()
|
|
||||||
border uiBorder
|
|
||||||
background uiBackground
|
|
||||||
border-radius 3px
|
|
||||||
transition all transitionSpeed ease
|
|
||||||
|
|
||||||
&:hover
|
|
||||||
border uiHoverBorder
|
|
||||||
background uiHoverBackground
|
|
||||||
box-shadow outlineShadowMedium
|
|
||||||
@ -1,108 +0,0 @@
|
|||||||
p, ul, ol, h3, dl, blockquote, label
|
|
||||||
line-height 1.7em
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
|
|
||||||
p, ul, ol, pre, h2, dl, blockquote, label
|
|
||||||
text-align left
|
|
||||||
margin-top 0.4em
|
|
||||||
margin-bottom 0.4em
|
|
||||||
float left
|
|
||||||
|
|
||||||
p
|
|
||||||
max-width 728px
|
|
||||||
clear both
|
|
||||||
|
|
||||||
dl
|
|
||||||
max-width 728px
|
|
||||||
|
|
||||||
dt
|
|
||||||
font-weight bold
|
|
||||||
font-size 1.4em
|
|
||||||
line-height 2.5em
|
|
||||||
|
|
||||||
dd
|
|
||||||
margin-left 1em
|
|
||||||
margin-bottom 1em
|
|
||||||
|
|
||||||
table
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
|
|
||||||
iframe
|
|
||||||
float left
|
|
||||||
display block
|
|
||||||
margin 0 auto
|
|
||||||
|
|
||||||
pre
|
|
||||||
border 1px solid rgb(128, 128, 128)
|
|
||||||
padding 1em
|
|
||||||
width 100%
|
|
||||||
box-shadow 1px 1px 16px rgba(0, 0, 0, 0.6)
|
|
||||||
color rgb(224, 224, 224)
|
|
||||||
background-color rgb(32, 32, 32)
|
|
||||||
border none
|
|
||||||
border-radius 3px
|
|
||||||
|
|
||||||
pre, code
|
|
||||||
font-family 'Ubuntu Mono', Consolas, monospace
|
|
||||||
|
|
||||||
ul
|
|
||||||
list-style-type square
|
|
||||||
|
|
||||||
ol
|
|
||||||
list-style-type decimal
|
|
||||||
|
|
||||||
ul, ol
|
|
||||||
list-style-position outside
|
|
||||||
padding 0
|
|
||||||
margin-left 1.7em
|
|
||||||
width calc(100% - 1.7em)
|
|
||||||
|
|
||||||
strong
|
|
||||||
font-weight bold
|
|
||||||
|
|
||||||
em
|
|
||||||
font-style italic
|
|
||||||
|
|
||||||
hr
|
|
||||||
clear both
|
|
||||||
height 4px
|
|
||||||
border-bottom 1px dotted #ccc
|
|
||||||
border-left none
|
|
||||||
border-right none
|
|
||||||
border-top none
|
|
||||||
|
|
||||||
img
|
|
||||||
margin 0.5em auto
|
|
||||||
max-width 100%
|
|
||||||
height auto
|
|
||||||
|
|
||||||
i.fa
|
|
||||||
margin-right 0.5em
|
|
||||||
|
|
||||||
table
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
|
|
||||||
th
|
|
||||||
font-size 120%
|
|
||||||
padding 5px 0
|
|
||||||
text-align left
|
|
||||||
|
|
||||||
tr
|
|
||||||
border-bottom-width 1px
|
|
||||||
border-bottom-style solid
|
|
||||||
border-bottom-color rgba(0, 0, 0, 0.05)
|
|
||||||
&:last-child
|
|
||||||
border none
|
|
||||||
|
|
||||||
td
|
|
||||||
padding 0.5em
|
|
||||||
text-align left
|
|
||||||
vertical-align top
|
|
||||||
|
|
||||||
tbody
|
|
||||||
tr
|
|
||||||
&:hover
|
|
||||||
background-color rgba(0, 0, 0, 0.03)
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
.embedded-header
|
|
||||||
position fixed
|
|
||||||
left 0
|
|
||||||
bottom 0
|
|
||||||
z-index 1
|
|
||||||
|
|
||||||
.embedded-content
|
|
||||||
margin-bottom 3em
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
.fade
|
|
||||||
opacity 1
|
|
||||||
transition opacity fadeSpeed ease
|
|
||||||
will-change opacity
|
|
||||||
|
|
||||||
.fade-out
|
|
||||||
opacity 0
|
|
||||||
@ -1,79 +0,0 @@
|
|||||||
maxWidth = 560px
|
|
||||||
|
|
||||||
input[type="text"]
|
|
||||||
input[type="email"]
|
|
||||||
input[type="password"]
|
|
||||||
input[type="url"]
|
|
||||||
input[type="number"]
|
|
||||||
button
|
|
||||||
font-family inherit
|
|
||||||
font-size 1rem
|
|
||||||
border-radius 3px
|
|
||||||
transition all transitionSpeed ease
|
|
||||||
margin 0 0 10px
|
|
||||||
padding 0.4em 0.8em
|
|
||||||
width calc(100% - 1.6em)
|
|
||||||
max-width maxWidth
|
|
||||||
float left
|
|
||||||
&:focus
|
|
||||||
outline none
|
|
||||||
&:active
|
|
||||||
transform translateY(3px)
|
|
||||||
|
|
||||||
input[type="submit"]
|
|
||||||
button
|
|
||||||
.button
|
|
||||||
font-family inherit
|
|
||||||
font-size 1em
|
|
||||||
color black
|
|
||||||
padding 0.5em 2em
|
|
||||||
border-radius 3px
|
|
||||||
box-shadow none
|
|
||||||
border none
|
|
||||||
text-align center
|
|
||||||
transition all transitionSpeed ease
|
|
||||||
width 100%
|
|
||||||
max-width none
|
|
||||||
|
|
||||||
textarea
|
|
||||||
float left
|
|
||||||
border 1px solid rgba(0, 0, 0, 0.5)
|
|
||||||
border-radius 3px
|
|
||||||
padding 0.2em 0.4em
|
|
||||||
font-size 1em
|
|
||||||
font-family inherit
|
|
||||||
line-height 1.7em
|
|
||||||
outline none
|
|
||||||
resize vertical
|
|
||||||
overflow auto
|
|
||||||
|
|
||||||
select
|
|
||||||
// Layout
|
|
||||||
float left
|
|
||||||
padding 0.5em
|
|
||||||
padding 5px 10px
|
|
||||||
width 100%
|
|
||||||
max-width 756px
|
|
||||||
|
|
||||||
// Font
|
|
||||||
font-size 1em
|
|
||||||
font-weight normal
|
|
||||||
font-family inherit
|
|
||||||
|
|
||||||
transition all 0.5s ease
|
|
||||||
-webkit-appearance none
|
|
||||||
-moz-appearance none
|
|
||||||
box-shadow 0px 1px 3px rgba(0, 0, 0, 0.1)
|
|
||||||
user-select none
|
|
||||||
border-radius 2px
|
|
||||||
font-size inherit
|
|
||||||
overflow hidden
|
|
||||||
text-overflow ellipsis
|
|
||||||
white-space nowrap
|
|
||||||
|
|
||||||
.error
|
|
||||||
padding 1em
|
|
||||||
background-color rgb(255, 64, 64)
|
|
||||||
color white
|
|
||||||
border-radius 5px
|
|
||||||
margin-bottom 1em
|
|
||||||
@ -1,128 +0,0 @@
|
|||||||
#posts
|
|
||||||
display flex
|
|
||||||
flex-flow column
|
|
||||||
flex 1
|
|
||||||
max-width 100%
|
|
||||||
|
|
||||||
.post
|
|
||||||
display flex
|
|
||||||
flex-flow column
|
|
||||||
margin 0.5rem 0
|
|
||||||
|
|
||||||
.post-author
|
|
||||||
text-align center
|
|
||||||
flex-grow 0
|
|
||||||
display flex
|
|
||||||
flex-flow row
|
|
||||||
justify-content center
|
|
||||||
margin-bottom -3px
|
|
||||||
|
|
||||||
img
|
|
||||||
margin 0 !important
|
|
||||||
|
|
||||||
#post-input
|
|
||||||
.post-input
|
|
||||||
width 100%
|
|
||||||
min-height 150px
|
|
||||||
margin 0.5rem 0
|
|
||||||
|
|
||||||
.post-submit
|
|
||||||
margin-top 0.5rem
|
|
||||||
max-width 200px
|
|
||||||
align-items flex-end
|
|
||||||
|
|
||||||
.post-toolbar
|
|
||||||
display flex
|
|
||||||
flex-flow row
|
|
||||||
opacity 0
|
|
||||||
transition opacity 250ms ease
|
|
||||||
position absolute
|
|
||||||
bottom 3px
|
|
||||||
right 0
|
|
||||||
|
|
||||||
.post-save
|
|
||||||
float right
|
|
||||||
&:hover
|
|
||||||
cursor pointer
|
|
||||||
|
|
||||||
.post-input-toolbar
|
|
||||||
display flex
|
|
||||||
flex-flow row
|
|
||||||
|
|
||||||
.post-tool
|
|
||||||
opacity 0.7
|
|
||||||
&:hover
|
|
||||||
cursor pointer
|
|
||||||
opacity 1
|
|
||||||
|
|
||||||
.post-likes
|
|
||||||
opacity 0.4
|
|
||||||
margin-right 0.4em
|
|
||||||
&:before
|
|
||||||
content "+"
|
|
||||||
|
|
||||||
.post-permalink
|
|
||||||
color blue !important
|
|
||||||
|
|
||||||
.post-delete
|
|
||||||
color rgb(255, 32, 12) !important
|
|
||||||
|
|
||||||
.post-like
|
|
||||||
color green !important
|
|
||||||
|
|
||||||
.post-unlike
|
|
||||||
color rgb(255, 32, 12) !important
|
|
||||||
|
|
||||||
.post-content
|
|
||||||
uiElement()
|
|
||||||
text-align left
|
|
||||||
flex-grow 1
|
|
||||||
padding 0.4rem 1rem
|
|
||||||
margin-left 0.3rem
|
|
||||||
border-radius 3px
|
|
||||||
position relative
|
|
||||||
|
|
||||||
&:hover
|
|
||||||
.post-toolbar
|
|
||||||
opacity 1
|
|
||||||
|
|
||||||
h1
|
|
||||||
font-size 1.5rem
|
|
||||||
line-height 2em
|
|
||||||
|
|
||||||
h2
|
|
||||||
font-size 1.3rem
|
|
||||||
line-height 2em
|
|
||||||
font-weight normal
|
|
||||||
|
|
||||||
h3
|
|
||||||
font-size 1.1rem
|
|
||||||
line-height 2em
|
|
||||||
font-weight normal
|
|
||||||
|
|
||||||
.post[data-highlight="true"]
|
|
||||||
.post-content
|
|
||||||
border 2px solid alpha(mainColor, 70%)
|
|
||||||
|
|
||||||
.hidden
|
|
||||||
display none
|
|
||||||
|
|
||||||
.thread
|
|
||||||
display flex
|
|
||||||
flex-flow column
|
|
||||||
align-items center
|
|
||||||
|
|
||||||
.thread-title
|
|
||||||
width auto
|
|
||||||
|
|
||||||
.posts
|
|
||||||
width 100%
|
|
||||||
max-width 830px
|
|
||||||
|
|
||||||
@media only screen and (min-width: 500px)
|
|
||||||
.post
|
|
||||||
flex-flow row
|
|
||||||
justify-content center
|
|
||||||
|
|
||||||
.post-author
|
|
||||||
//
|
|
||||||
@ -1,89 +0,0 @@
|
|||||||
.grid
|
|
||||||
display flex
|
|
||||||
flex-flow row wrap
|
|
||||||
justify-content center
|
|
||||||
float none !important
|
|
||||||
|
|
||||||
.grid-cell
|
|
||||||
position relative
|
|
||||||
|
|
||||||
flex-grow 0
|
|
||||||
flex-shrink 0
|
|
||||||
|
|
||||||
width 16vw
|
|
||||||
height 9vw
|
|
||||||
min-width 90px
|
|
||||||
min-height 127px
|
|
||||||
max-width 200px
|
|
||||||
max-height 282px
|
|
||||||
border-radius 3px
|
|
||||||
background-size cover
|
|
||||||
background-position 50% 50%
|
|
||||||
|
|
||||||
margin 0.5rem
|
|
||||||
|
|
||||||
&:hover
|
|
||||||
.backside-card
|
|
||||||
transform rotateY(180deg)
|
|
||||||
|
|
||||||
.front
|
|
||||||
opacity 0
|
|
||||||
.back
|
|
||||||
opacity 1
|
|
||||||
// .grid-icon
|
|
||||||
// transform scale(1.3)
|
|
||||||
|
|
||||||
.ui
|
|
||||||
uiElement()
|
|
||||||
|
|
||||||
.scale-out
|
|
||||||
&:hover
|
|
||||||
transform scale(1.02)
|
|
||||||
|
|
||||||
.backside-card
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
transition all transitionSpeed ease-in-out
|
|
||||||
|
|
||||||
.front
|
|
||||||
position absolute
|
|
||||||
left 0
|
|
||||||
top 0
|
|
||||||
opacity 1
|
|
||||||
transition opacity transitionSpeed ease
|
|
||||||
|
|
||||||
.back
|
|
||||||
position absolute
|
|
||||||
left 0
|
|
||||||
top 0
|
|
||||||
opacity 0
|
|
||||||
transition opacity transitionSpeed ease
|
|
||||||
transform rotateY(180deg)
|
|
||||||
|
|
||||||
.grid-anime
|
|
||||||
border none
|
|
||||||
&:hover
|
|
||||||
border none
|
|
||||||
|
|
||||||
.grid-text
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
display flex
|
|
||||||
flex-flow column
|
|
||||||
align-items center
|
|
||||||
justify-content center
|
|
||||||
font-size 1rem
|
|
||||||
color rgb(160, 160, 160)
|
|
||||||
|
|
||||||
.grid-icon
|
|
||||||
font-size 2.5rem
|
|
||||||
margin-top 2rem
|
|
||||||
margin-bottom 0.7rem
|
|
||||||
color linkColor
|
|
||||||
|
|
||||||
.grid-image
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
margin 0
|
|
||||||
border-radius 3px
|
|
||||||
object-fit cover
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
h1
|
|
||||||
display inline-block
|
|
||||||
font-size 3em
|
|
||||||
line-height 3em
|
|
||||||
|
|
||||||
h2
|
|
||||||
font-size 2em
|
|
||||||
line-height 1.5em
|
|
||||||
font-weight bold
|
|
||||||
text-align center
|
|
||||||
width 100%
|
|
||||||
&:first-of-type
|
|
||||||
margin-top 0
|
|
||||||
h3
|
|
||||||
line-height 2em
|
|
||||||
font-size 1.5em
|
|
||||||
font-weight bold
|
|
||||||
text-align left
|
|
||||||
margin-top 0.6em
|
|
||||||
@ -1,86 +0,0 @@
|
|||||||
#container
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
float left
|
|
||||||
overflow-x hidden
|
|
||||||
overflow-y scroll
|
|
||||||
position absolute
|
|
||||||
top 0
|
|
||||||
left 0
|
|
||||||
z-index 0
|
|
||||||
|
|
||||||
#emergency
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
background-color rgb(255, 32, 32)
|
|
||||||
color black
|
|
||||||
padding 0.7em
|
|
||||||
box-sizing border-box
|
|
||||||
|
|
||||||
#header-container
|
|
||||||
display block
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
height auto
|
|
||||||
background-color transparent
|
|
||||||
|
|
||||||
#header
|
|
||||||
display block
|
|
||||||
margin 0 auto
|
|
||||||
width 100%
|
|
||||||
overflow hidden
|
|
||||||
|
|
||||||
#title, #slogan
|
|
||||||
display block
|
|
||||||
margin 0 auto
|
|
||||||
width calc(100% - 3em)
|
|
||||||
height auto
|
|
||||||
text-align left
|
|
||||||
|
|
||||||
#title
|
|
||||||
padding 1.5em
|
|
||||||
padding-bottom 0.5em
|
|
||||||
text-transform uppercase
|
|
||||||
//letter-spacing 1px
|
|
||||||
//opacity 0
|
|
||||||
letter-spacing 6px
|
|
||||||
h1
|
|
||||||
line-height inherit
|
|
||||||
a
|
|
||||||
text-decoration none
|
|
||||||
|
|
||||||
#slogan
|
|
||||||
padding 1.5em
|
|
||||||
padding-top 0.5em
|
|
||||||
line-height 1.3em
|
|
||||||
|
|
||||||
#content-container
|
|
||||||
display block
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
height auto
|
|
||||||
background-color transparent
|
|
||||||
|
|
||||||
#content
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
min-height 100%
|
|
||||||
padding contentPadding
|
|
||||||
line-height 1.7em
|
|
||||||
text-align center
|
|
||||||
display flex
|
|
||||||
flex-flow column
|
|
||||||
& > div
|
|
||||||
width 100%
|
|
||||||
|
|
||||||
.header-logged-in
|
|
||||||
background-image none !important
|
|
||||||
|
|
||||||
.navigation-link-left
|
|
||||||
float left
|
|
||||||
|
|
||||||
.navigation-link-right
|
|
||||||
float right
|
|
||||||
|
|
||||||
.navigation-icon-no-title
|
|
||||||
margin-right 0 !important
|
|
||||||
@ -1,95 +0,0 @@
|
|||||||
duration = 0.8s
|
|
||||||
size = 24px
|
|
||||||
|
|
||||||
#loading-animation
|
|
||||||
display block
|
|
||||||
position fixed
|
|
||||||
bottom 1.15rem
|
|
||||||
right 1.15rem
|
|
||||||
pointer-events none
|
|
||||||
|
|
||||||
.sk-cube-grid
|
|
||||||
width size
|
|
||||||
height size
|
|
||||||
transform rotateZ(0deg)
|
|
||||||
animation sk-rotate duration infinite linear
|
|
||||||
|
|
||||||
.sk-cube
|
|
||||||
width 33.3%
|
|
||||||
height 33.3%
|
|
||||||
background-color alpha(linkHoverColor, 70%)
|
|
||||||
box-shadow 0 0 size alpha(linkHoverColor, 80%)
|
|
||||||
float left
|
|
||||||
animation sk-cube-grid duration infinite linear
|
|
||||||
border-radius 100%
|
|
||||||
|
|
||||||
.sk-cube5
|
|
||||||
background-color linkHoverColor
|
|
||||||
box-shadow 0 0 size alpha(linkHoverColor, 90%)
|
|
||||||
|
|
||||||
.sk-cube1
|
|
||||||
.sk-cube3
|
|
||||||
.sk-cube7
|
|
||||||
.sk-cube9
|
|
||||||
visibility hidden
|
|
||||||
|
|
||||||
@keyframes sk-cube-grid
|
|
||||||
0%, 100%
|
|
||||||
transform scale3D(0.4, 0.4, 0.4)
|
|
||||||
50%
|
|
||||||
transform scale3D(0.9, 0.9, 0.9)
|
|
||||||
|
|
||||||
@keyframes sk-rotate
|
|
||||||
0%
|
|
||||||
transform rotateZ(0deg)
|
|
||||||
100%
|
|
||||||
transform rotateZ(360deg)
|
|
||||||
|
|
||||||
// Anime list loading
|
|
||||||
.sk-folding-cube
|
|
||||||
margin 20px auto
|
|
||||||
width 40px
|
|
||||||
height 40px
|
|
||||||
position relative
|
|
||||||
transform rotateZ(45deg)
|
|
||||||
.sk-cube
|
|
||||||
float left
|
|
||||||
width 50%
|
|
||||||
height 50%
|
|
||||||
position relative
|
|
||||||
transform scale(1.1)
|
|
||||||
&:before
|
|
||||||
content ''
|
|
||||||
position absolute
|
|
||||||
top 0
|
|
||||||
left 0
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
background-color mainColor
|
|
||||||
animation sk-foldCubeAngle 2.4s infinite linear both
|
|
||||||
transform-origin 100% 100%
|
|
||||||
.sk-cube2
|
|
||||||
transform scale(1.1) rotateZ(90deg)
|
|
||||||
&:before
|
|
||||||
animation-delay 0.3s
|
|
||||||
.sk-cube3
|
|
||||||
transform scale(1.1) rotateZ(180deg)
|
|
||||||
&:before
|
|
||||||
animation-delay 0.6s
|
|
||||||
.sk-cube4
|
|
||||||
transform scale(1.1) rotateZ(270deg)
|
|
||||||
&:before
|
|
||||||
animation-delay 0.9s
|
|
||||||
|
|
||||||
@keyframes sk-foldCubeAngle
|
|
||||||
0%, 10%
|
|
||||||
transform perspective(140px) rotateX(-180deg)
|
|
||||||
opacity 0
|
|
||||||
|
|
||||||
25%, 75%
|
|
||||||
transform perspective(140px) rotateX(0deg)
|
|
||||||
opacity 1
|
|
||||||
|
|
||||||
90%, 100%
|
|
||||||
transform perspective(140px) rotateY(180deg)
|
|
||||||
opacity 0
|
|
||||||
@ -1,67 +0,0 @@
|
|||||||
@media only screen and (max-width: 1024px)
|
|
||||||
#header
|
|
||||||
background-image none
|
|
||||||
|
|
||||||
@media only screen and (max-width: 930px)
|
|
||||||
#title, #slogan
|
|
||||||
display none
|
|
||||||
|
|
||||||
.navigation-text
|
|
||||||
display none
|
|
||||||
|
|
||||||
.navigation-button i.fa
|
|
||||||
margin-right 0
|
|
||||||
|
|
||||||
.episodes-behind
|
|
||||||
&:before
|
|
||||||
content '+'
|
|
||||||
&:after
|
|
||||||
content ''
|
|
||||||
|
|
||||||
#content
|
|
||||||
padding contentPaddingMobile
|
|
||||||
|
|
||||||
#header
|
|
||||||
text-align center
|
|
||||||
|
|
||||||
#navigation
|
|
||||||
float none
|
|
||||||
display inline-block
|
|
||||||
width auto
|
|
||||||
|
|
||||||
.profile
|
|
||||||
left contentPaddingMobile * -1 !important
|
|
||||||
top contentPaddingMobile * -1 !important
|
|
||||||
min-width calc(100% + 2rem) !important
|
|
||||||
|
|
||||||
@media only screen and (min-width: 1100px)
|
|
||||||
.anime-list-image
|
|
||||||
display block
|
|
||||||
|
|
||||||
@media only screen and (max-width: 560px)
|
|
||||||
#navigation
|
|
||||||
padding 0
|
|
||||||
|
|
||||||
.navigation-link-right
|
|
||||||
display none
|
|
||||||
|
|
||||||
.navigation-button i.fa
|
|
||||||
font-size 1.5em
|
|
||||||
|
|
||||||
// Remove admin icon
|
|
||||||
@media only screen and (max-width: 612px)
|
|
||||||
.navigation-link-right[href='/admin']
|
|
||||||
display none
|
|
||||||
|
|
||||||
@media only screen and (max-width: 320px)
|
|
||||||
.navigation-button i.fa
|
|
||||||
font-size 1.4em
|
|
||||||
|
|
||||||
@media only screen and (max-height: 700px)
|
|
||||||
.anime-list-image
|
|
||||||
top 0.5em
|
|
||||||
transform translate(10%, 0)
|
|
||||||
|
|
||||||
.anime:hover
|
|
||||||
.anime-list-image
|
|
||||||
transform translate(0, 0)
|
|
||||||
@ -1,31 +0,0 @@
|
|||||||
#navigation
|
|
||||||
width 100%
|
|
||||||
height 100%
|
|
||||||
padding 0 content-padding
|
|
||||||
box-sizing border-box
|
|
||||||
|
|
||||||
.navigation-link
|
|
||||||
display inline-block
|
|
||||||
height 100%
|
|
||||||
text-decoration none
|
|
||||||
position relative
|
|
||||||
&:after
|
|
||||||
content ""
|
|
||||||
display block
|
|
||||||
margin auto
|
|
||||||
margin-top 0
|
|
||||||
height 3px
|
|
||||||
width 0px
|
|
||||||
default-transition
|
|
||||||
&.active
|
|
||||||
&:hover
|
|
||||||
cursor pointer
|
|
||||||
text-decoration none
|
|
||||||
&:after
|
|
||||||
width 100%
|
|
||||||
background-color rgb(248, 165, 130)
|
|
||||||
|
|
||||||
.navigation-button
|
|
||||||
padding 0.75em 1em
|
|
||||||
font-size 1.1em
|
|
||||||
line-height 1em
|
|
||||||
@ -1,60 +0,0 @@
|
|||||||
html, body, div, span, object, iframe,
|
|
||||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
|
||||||
a, abbr, address, cite, code,
|
|
||||||
del, dfn, em, img, ins, kbd, q, samp,
|
|
||||||
small, strong, sub, sup, var,
|
|
||||||
b, i,
|
|
||||||
dl, dt, dd, ol, ul, li,
|
|
||||||
fieldset, form, label, legend,
|
|
||||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
|
||||||
article, aside, canvas, details, embed,
|
|
||||||
figure, figcaption, footer, header, hgroup,
|
|
||||||
menu, nav, output, ruby, section, summary,
|
|
||||||
time, mark, audio, video, main
|
|
||||||
outline 0
|
|
||||||
border 0
|
|
||||||
font-size 100%
|
|
||||||
font inherit
|
|
||||||
vertical-align baseline
|
|
||||||
background transparent
|
|
||||||
|
|
||||||
html
|
|
||||||
box-sizing border-box
|
|
||||||
|
|
||||||
textarea
|
|
||||||
resize vertical
|
|
||||||
|
|
||||||
article, aside, details, figcaption, figure,
|
|
||||||
footer, header, hgroup, menu, nav, section
|
|
||||||
display block
|
|
||||||
|
|
||||||
body
|
|
||||||
line-height 1
|
|
||||||
-webkit-font-smoothing antialiased
|
|
||||||
-moz-osx-font-smoothing grayscale
|
|
||||||
|
|
||||||
ol, ul
|
|
||||||
list-style none
|
|
||||||
|
|
||||||
blockquote, q
|
|
||||||
quotes none
|
|
||||||
|
|
||||||
blockquote:before, blockquote:after,
|
|
||||||
q:before, q:after
|
|
||||||
content ''
|
|
||||||
content none
|
|
||||||
|
|
||||||
table
|
|
||||||
border-collapse collapse
|
|
||||||
border-spacing 0
|
|
||||||
|
|
||||||
audio, canvas, img, video, input, select
|
|
||||||
vertical-align middle
|
|
||||||
|
|
||||||
:focus
|
|
||||||
outline 0
|
|
||||||
|
|
||||||
*
|
|
||||||
margin 0
|
|
||||||
padding 0
|
|
||||||
box-sizing inherit
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
.category
|
|
||||||
flex 1
|
|
||||||
min-width 300px
|
|
||||||
max-width 100%
|
|
||||||
|
|
||||||
.categories
|
|
||||||
display flex
|
|
||||||
flex-flow row wrap
|
|
||||||
|
|
||||||
.field
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
padding 0 0.5em
|
|
||||||
box-sizing border-box
|
|
||||||
|
|
||||||
.value
|
|
||||||
margin-left 0.5em
|
|
||||||
font-weight bold
|
|
||||||
font-size 1.1em
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
#staff-info
|
|
||||||
display none
|
|
||||||
float left
|
|
||||||
width 100%
|
|
||||||
text-align left
|
|
||||||
@ -1,33 +0,0 @@
|
|||||||
avatarSize = 50px
|
|
||||||
|
|
||||||
.user-list
|
|
||||||
width 100%
|
|
||||||
display flex
|
|
||||||
flex-flow row wrap
|
|
||||||
|
|
||||||
.user
|
|
||||||
display block
|
|
||||||
transform scale(1.0)
|
|
||||||
width avatarSize
|
|
||||||
height avatarSize
|
|
||||||
border-radius 100%
|
|
||||||
margin 0.2em
|
|
||||||
&:hover
|
|
||||||
.user-image
|
|
||||||
box-shadow outlineShadowHeavy
|
|
||||||
|
|
||||||
.user-image
|
|
||||||
opacity 0
|
|
||||||
transition all 250ms ease
|
|
||||||
border-radius 100%
|
|
||||||
margin 0 !important
|
|
||||||
width avatarSize
|
|
||||||
height avatarSize
|
|
||||||
object-fit cover
|
|
||||||
|
|
||||||
svg.user-image
|
|
||||||
circle.body, circle.head
|
|
||||||
fill textColor
|
|
||||||
text
|
|
||||||
fill white
|
|
||||||
font-size 0.65rem
|
|
||||||
@ -1,6 +0,0 @@
|
|||||||
.video-container
|
|
||||||
width 100%
|
|
||||||
|
|
||||||
.video
|
|
||||||
width 100%
|
|
||||||
height 100vh
|
|
||||||
@ -6,3 +6,10 @@ p, h1, h2, h3, h4, h5, h6
|
|||||||
|
|
||||||
:last-child
|
:last-child
|
||||||
margin-bottom 0
|
margin-bottom 0
|
||||||
|
|
||||||
|
h2
|
||||||
|
margin-bottom content-padding
|
||||||
|
|
||||||
|
p > img
|
||||||
|
max-width 100%
|
||||||
|
border-radius 3px
|
||||||
@ -2,5 +2,7 @@
|
|||||||
width 50px
|
width 50px
|
||||||
height 50px
|
height 50px
|
||||||
border-radius 100%
|
border-radius 100%
|
||||||
|
object-fit cover
|
||||||
default-transition
|
default-transition
|
||||||
outline-shadow-up
|
:hover
|
||||||
|
box-shadow outline-shadow-heavy
|
||||||
Loading…
Reference in New Issue
Block a user