You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
136 lines
2.5 KiB
136 lines
2.5 KiB
@import "../Shared.sass"
|
|
|
|
.Blob
|
|
margin-top: 0.5em
|
|
border-radius: 0.5em
|
|
display: inline-block
|
|
box-sizing: border-box
|
|
cursor: default
|
|
margin-left: 0.25em
|
|
margin-right: 0.25em
|
|
|
|
&.Blob-clickable
|
|
cursor: pointer
|
|
|
|
&:hover
|
|
color: $blob-foreground-clickable-hover
|
|
|
|
&.Blob-gray
|
|
background-color: $blob-background
|
|
color: $blob-foreground
|
|
|
|
&.Blob-clickable:hover
|
|
background-color: $blob-background-hover
|
|
|
|
&.Blob-green
|
|
background-color: $green-1
|
|
color: $green-6
|
|
|
|
&.Blob-clickable:hover
|
|
background-color: $green-2
|
|
|
|
&.Blob-blue
|
|
background-color: $blue-1
|
|
color: $blue-6
|
|
|
|
&.Blob-clickable:hover
|
|
background-color: $blue-2
|
|
|
|
&.Blob-cyan
|
|
background-color: $cyan-1
|
|
color: $cyan-6
|
|
|
|
&.Blob-clickable:hover
|
|
background-color: $cyan-2
|
|
|
|
&.Blob-yellow
|
|
background-color: $yellow-1
|
|
color: $yellow-6
|
|
|
|
&.Blob-clickable:hover
|
|
background-color: $yellow-2
|
|
|
|
&.Blob-red
|
|
background-color: $red-1
|
|
color: $red-6
|
|
|
|
&.Blob-clickable:hover
|
|
background-color: $red-2
|
|
|
|
&.Blob-indigo
|
|
background-color: $indigo-1
|
|
color: $indigo-6
|
|
|
|
&.Blob-clickable:hover
|
|
background-color: $indigo-2
|
|
|
|
|
|
&.Blob-fill-on-any
|
|
display: block
|
|
|
|
@media screen and (max-width: $mobile-max)
|
|
&.Blob-fill-on-mobile
|
|
display: block
|
|
|
|
@media screen and (max-width: $tablet-max)
|
|
&.Blob-fill-on-tablet
|
|
display: block
|
|
|
|
@media screen and (max-width: $desktop-max)
|
|
&.Blob-fill-on-desktop
|
|
display: block
|
|
|
|
.Blob-body
|
|
display: flex
|
|
flex-direction: row
|
|
border-radius: inherit
|
|
|
|
.BlobText
|
|
padding: 0.5em
|
|
min-width: 1ch
|
|
|
|
&.BlobText-centered
|
|
text-align: center
|
|
|
|
&.BlobText-text-secondary
|
|
opacity: 0.75
|
|
|
|
.BlobTextLine
|
|
&.BlobTextLine-secondary
|
|
opacity: 0.5
|
|
|
|
&:not(:last-child)
|
|
padding-bottom: 0.2em
|
|
|
|
input.BlobInput
|
|
font: inherit
|
|
background-color: $blob-background-dark
|
|
color: inherit
|
|
border: none
|
|
padding: 0.5em
|
|
border-radius: inherit
|
|
|
|
&:not(:first-child)
|
|
border-bottom-left-radius: 0
|
|
border-top-left-radius: 0
|
|
|
|
&:not(:last-child)
|
|
border-bottom-right-radius: 0
|
|
border-top-right-radius: 0
|
|
|
|
div
|
|
text-wrap: avoid
|
|
|
|
.BlobGroup
|
|
display: inline-block
|
|
|
|
.Blob:not(:first-child)
|
|
margin-left: 0
|
|
border-top-left-radius: 0
|
|
border-bottom-left-radius: 0
|
|
|
|
.Blob:not(:last-child)
|
|
margin-right: 0
|
|
border-top-right-radius: 0
|
|
border-bottom-right-radius: 0
|
|
|