mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2024-12-02 20:07:25 -05:00
176 lines
4.1 KiB
Sass
176 lines
4.1 KiB
Sass
@import "app/styles/mixins"
|
|
@import "app/styles/bootstrap/variables"
|
|
|
|
#level-view.hero .spell-palette-entry-view
|
|
// Not clickable.
|
|
cursor: default
|
|
|
|
.spell-palette-entry-view
|
|
display: block
|
|
padding: 0px 4px
|
|
font-family: Menlo, Monaco, Consolas, "Courier New", monospace
|
|
font-size: 12px
|
|
border: 1px solid transparent
|
|
cursor: pointer
|
|
@include user-select(all)
|
|
height: 19px
|
|
text-overflow: ellipsis
|
|
overflow: hidden
|
|
white-space: nowrap
|
|
|
|
&:hover
|
|
border: 1px solid #000000
|
|
|
|
&.pinned
|
|
background-color: darken(#FFFFFF, 25%)
|
|
|
|
&.single-entry
|
|
height: 38px
|
|
line-height: 38px
|
|
|
|
// Originally pulled these colors from the most relevant textmate-theme classes, but then fudged them a lot.
|
|
//&.function
|
|
// color: black
|
|
//&.object
|
|
// color: rgb(6, 150, 14)
|
|
//&.string
|
|
// color: rgb(3, 106, 7)
|
|
//&.number
|
|
// color: rgb(0, 0, 205)
|
|
//&.boolean
|
|
// color: rgb(88, 92, 246)
|
|
//&.snippet
|
|
// color: blue
|
|
//&.undefined
|
|
// color: rgb(197, 6, 11)
|
|
color: rgb(243, 169, 49)
|
|
|
|
|
|
body:not(.dialogue-view-active)
|
|
.spell-palette-popover.popover
|
|
right: 45%
|
|
min-width: 500px
|
|
margin-top: -17%
|
|
|
|
.spell-palette-popover.popover
|
|
// Only those popovers which are our direct children (spell documentation)
|
|
left: auto !important
|
|
max-width: 600px
|
|
padding: 0
|
|
border-style: solid
|
|
border-image: url(/images/level/popover_border_background.png) 16 12 fill round
|
|
border-width: 16px 12px
|
|
@include box-shadow(0 0 0 #000)
|
|
// Prevent flickering in weird scenarios where popover goes over its own property
|
|
pointer-events: none
|
|
|
|
// Jiggle animation
|
|
// TODO: consolidate with problem_alert.sass jiggle
|
|
+keyframes(jiggle)
|
|
0%
|
|
transform: rotate(0deg)
|
|
25%
|
|
transform: rotate(1deg)
|
|
50%
|
|
transform: rotate(0deg)
|
|
75%
|
|
transform: rotate(-1deg)
|
|
100%
|
|
transform: rotate(0deg)
|
|
|
|
&.jiggling
|
|
@include animation(jiggle .3s infinite)
|
|
|
|
&.pinned
|
|
top: 50px !important
|
|
right: 45%
|
|
// bottom: 151px
|
|
@include user-select(text)
|
|
// Wish I could set max-width and max-height (and override Bootstrap's stuff)
|
|
// but without explicitly setting height, child overflow-y: scroll doesn't work
|
|
min-width: 45%
|
|
height: 60%
|
|
|
|
.arrow
|
|
display: none
|
|
|
|
.close
|
|
position: absolute
|
|
top: 5%
|
|
right: 5%
|
|
font-size: 28px
|
|
font-weight: bold
|
|
@include opacity(0.6)
|
|
text-shadow: 0 1px 0 white
|
|
|
|
&:hover
|
|
@include opacity(1)
|
|
|
|
h1:not(.not-code), h2:not(.not-code), h3:not(.not-code), h4:not(.not-code), h5:not(.not-code), h6:not(.not-code)
|
|
font-family: Monaco, Menlo, Ubuntu Mono, Consolas, "source-code-pro", monospace !important
|
|
font-variant: normal
|
|
|
|
.popover-title
|
|
background-color: transparent
|
|
margin: 0 14px
|
|
padding: 8px 0
|
|
border-bottom-color: #ccc
|
|
|
|
.popover-content
|
|
max-height: 100%
|
|
overflow-y: auto
|
|
margin-right: 10px
|
|
img
|
|
float: right
|
|
|
|
&.top .arrow
|
|
bottom: -2%
|
|
&.bottom .arrow
|
|
top: -2%
|
|
&.left .arrow
|
|
right: 0%
|
|
&.right .arrow
|
|
left: -3%
|
|
|
|
.docs-ace-container
|
|
padding: 2px 4px
|
|
border-radius: 4px
|
|
|
|
&, .docs-ace
|
|
background-color: #f9f2f4
|
|
font-size: 12px
|
|
font-family: Monaco, Menlo, Ubuntu Mono, Consolas, "source-code-pro", monospace !important
|
|
|
|
.docs-ace
|
|
.ace_cursor, .ace_bracket
|
|
display: none
|
|
|
|
code
|
|
color: black
|
|
font-family: Monaco, Menlo, Ubuntu Mono, Consolas, "source-code-pro", monospace !important
|
|
font-size: 12px
|
|
|
|
html.no-borderimage
|
|
.spell-palette-popover.popover
|
|
background: transparent url(/images/level/popover_background.png)
|
|
background-size: 100% 100%
|
|
border: 0
|
|
|
|
html.fullscreen-editor
|
|
.spell-palette-popover.popover.pinned
|
|
min-width: 600px
|
|
bottom: inherit
|
|
right: 50%
|
|
margin-right: -300px
|
|
|
|
// iPad property docs
|
|
|
|
.tome-inventory-property-documentation
|
|
background-color: #e3d39a
|
|
padding: 10px
|
|
padding-bottom: 65px
|
|
width: 320px
|
|
min-height: 480px
|
|
|
|
h1:not(.not-code), h2:not(.not-code), h3:not(.not-code), h4:not(.not-code), h5:not(.not-code), h6:not(.not-code)
|
|
font-family: Menlo, Monaco, Consolas, "Courier New", monospace
|