mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2024-11-24 08:08:15 -05:00
290 lines
6.3 KiB
Sass
290 lines
6.3 KiB
Sass
@import "bootstrap/variables"
|
||
@import "bootstrap/mixins"
|
||
|
||
html
|
||
background-color: #2f261d
|
||
|
||
body
|
||
position: absolute !important
|
||
|
||
// https://github.com/twbs/bootstrap/issues/9237 -- need a version that's not !important
|
||
.secret
|
||
display: none
|
||
|
||
h1 h2 h3 h4
|
||
letter-spacing: 2px
|
||
|
||
.main-content-area
|
||
box-shadow: 0px 0px 10px
|
||
position: relative
|
||
width: 1024px
|
||
margin: 56px auto 0
|
||
min-height: 600px
|
||
padding: 14px 12px 5px 12px
|
||
+box-sizing(border-box)
|
||
+clearfix()
|
||
|
||
#outer-content-wrapper
|
||
background: #B4B4B4
|
||
|
||
#outer-content-wrapper.show-background
|
||
background: #8cc63f url(/images/pages/base/repeat-tile.png) top center
|
||
|
||
#intermediate-content-wrapper
|
||
background: url(/images/pages/base/sky_repeater.png) repeat-x
|
||
|
||
#inner-content-wrapper
|
||
background: url(/images/pages/base/background_texture.png) top center no-repeat
|
||
|
||
#front-summary-points-left
|
||
width: 250px
|
||
margin: 0px 20px 10px 15px
|
||
|
||
#front-summary-points-left p.lead
|
||
margin-bottom: 5px
|
||
|
||
#front-screenshot
|
||
width: 710px
|
||
|
||
.content
|
||
width: 1024px
|
||
margin: 0 auto
|
||
|
||
.footer
|
||
border-top: 1px solid black
|
||
background-color: #2f261d
|
||
p
|
||
margin: 0
|
||
padding-top: 10px
|
||
padding-bottom: 10px
|
||
text-align: center
|
||
|
||
.mixpanel-badge, .firebase-badge
|
||
width: 100px
|
||
margin: 10px 10px 0px
|
||
|
||
.footer-link-text a
|
||
font-family: 'Bangers', cursive
|
||
font-weight: normal
|
||
font-size: 25px
|
||
letter-spacing: 1px
|
||
color: #ffffff
|
||
cursor: pointer
|
||
margin: 0px 10px
|
||
&:hover
|
||
color: $white
|
||
|
||
a
|
||
cursor: pointer
|
||
|
||
.share-buttons, .partner-badges
|
||
padding-bottom: 10px
|
||
text-align: center
|
||
@include opacity(0.75)
|
||
|
||
&.fade-in
|
||
@include opacity(0)
|
||
|
||
&:hover, &:active
|
||
@include opacity(1)
|
||
@include transition(opacity .10s linear)
|
||
|
||
.github-star-button
|
||
margin-left: 20px
|
||
|
||
&>div
|
||
display: inline-block
|
||
vertical-align: top
|
||
|
||
.error
|
||
left: 8px
|
||
|
||
.selectable
|
||
cursor: pointer
|
||
|
||
.modal-dialog
|
||
padding: 5px
|
||
margin-top: 30px
|
||
margin-bottom: 0px
|
||
padding-top: 30px
|
||
.background-wrapper
|
||
background: url("/images/pages/base/modal_background.png")
|
||
background-size: 100% 100%
|
||
border: 0
|
||
@include box-shadow(0 0 0 #000)
|
||
//position: absolute
|
||
width: 99%
|
||
|
||
.background-wrapper.plain
|
||
background: white
|
||
|
||
.modal-content
|
||
@include box-shadow(none)
|
||
|
||
.modal-header
|
||
margin: 0 14px
|
||
padding: 8px 0
|
||
border-bottom-color: #ccc
|
||
|
||
.close
|
||
font-size: 28px
|
||
@include opacity(0.60)
|
||
&:hover
|
||
@include opacity(1)
|
||
|
||
.modal-footer
|
||
background-color: transparent
|
||
margin: 0 14px
|
||
border-bottom-color: #ccc
|
||
.modal-footer.linkedin
|
||
text-align: center
|
||
.signin-text
|
||
font-size: 15px
|
||
padding-bottom: 10px
|
||
.login-link
|
||
cursor: pointer
|
||
|
||
|
||
// Bigger versions of some Bootstrap icons
|
||
// TODO: make the non-white versions of these if we ever need them
|
||
.icon.big
|
||
background-image: url(/images/pages/base/glyphicons-simplified.png)
|
||
|
||
.icon-white.big
|
||
background-image: url(/images/pages/base/glyphicons-simplified.png)
|
||
|
||
.icon.big, .icon-white.big
|
||
width: 19px
|
||
height: 19px
|
||
line-height: 19px
|
||
|
||
.icon-pause.big
|
||
background-position: -114px 0px
|
||
|
||
.icon-play.big
|
||
background-position: -95px 0px
|
||
|
||
.icon-repeat.big
|
||
background-position: -76px 0px
|
||
|
||
.icon-volume-off.big
|
||
background-position: -57px 0px
|
||
|
||
.icon-volume-down.big
|
||
background-position: -38px 0px
|
||
|
||
.icon-volume-up.big
|
||
background-position: -19px 0px
|
||
|
||
.icon-cog.big
|
||
background-position: 0px 0px
|
||
|
||
// loading screens for everything but the play view
|
||
.loading-screen
|
||
.progress
|
||
width: 50%
|
||
margin: 0 25%
|
||
|
||
// all loading screens
|
||
.loading-container
|
||
text-align: center
|
||
.progress-bar
|
||
width: 0%
|
||
transition: width 0.1s ease
|
||
.errors .alert
|
||
padding: 5px
|
||
display: block
|
||
margin: 10px auto
|
||
.btn
|
||
margin-left: 10px
|
||
|
||
|
||
.modal
|
||
overflow-y: auto !important
|
||
.wait
|
||
h3
|
||
text-align: center
|
||
.progress
|
||
width: 50%
|
||
margin: 10px auto
|
||
.progress-bar
|
||
width: 100%
|
||
|
||
table.table
|
||
background-color: white
|
||
|
||
//.ui-autocomplete
|
||
// z-index: $zindexAutocomplete
|
||
|
||
.ui-slider
|
||
border: 1px solid black
|
||
.ui-slider-handle
|
||
border: 1px solid black !important
|
||
|
||
.flag-cursor
|
||
cursor: crosshair
|
||
|
||
|
||
// Fonts
|
||
|
||
.header-font
|
||
font-family: $headings-font-family
|
||
|
||
body[lang='ru'], body[lang|='zh'], body[lang='pl'], body[lang='tr'], body[lang='cs'], body[lang='el'], body[lang='ro'], body[lang='vi'], body[lang='th'], body[lang='ko'], body[lang='sk'], body[lang='sl'], body[lang='bg'], body[lang='he'], body[lang='lt'], body[lang='sr'], body[lang='uk'], body[lang='hi'], body[lang='ur'], body[lang='hu']
|
||
h1, h2, h3, h4, h5, h6
|
||
font-family: 'Open Sans Condensed', Impact, "Arial Narrow", "Arial", sans-serif
|
||
text-transform: uppercase
|
||
letter-spacing: -1px !important
|
||
|
||
.header-font
|
||
font-family: 'Open Sans Condensed', Impact, "Arial Narrow", "Arial", sans-serif !important
|
||
text-transform: uppercase
|
||
letter-spacing: -1px !important
|
||
|
||
body[lang='ja']
|
||
h1, h2, h3, h4, h5, h6
|
||
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", 'Open Sans Condensed', sans-serif
|
||
text-transform: uppercase
|
||
letter-spacing: -1px !important
|
||
|
||
.header-font
|
||
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", 'Open Sans Condensed', sans-serif
|
||
text-transform: uppercase
|
||
letter-spacing: -1px !important
|
||
|
||
#top-nav
|
||
.navbar-nav
|
||
li
|
||
a.header-font
|
||
font-size: 16px
|
||
|
||
@media only screen and (max-width: 800px)
|
||
.main-content-area
|
||
width: 100%
|
||
.content
|
||
width: 100%
|
||
|
||
.footer-link-text a
|
||
font-size: 17px
|
||
margin-left: 3px
|
||
margin-right: 3px
|
||
|
||
.share-buttons
|
||
margin-bottom: 20px
|
||
.partner-badges
|
||
display: none
|
||
|
||
// point the new glyphicons to the fonts in public
|
||
|
||
@font-face
|
||
font-family: 'Glyphicons Halflings'
|
||
src: url("/fonts/glyphicons-halflings-regular.eot")
|
||
src: url("/fonts/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("/fonts/glyphicons-halflings-regular.woff") format("woff"), url("/fonts/glyphicons-halflings-regular.ttf") format("truetype"), url("/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular") format("svg")
|
||
|
||
.spr:after
|
||
content: " "
|
||
.spl:before
|
||
content: " "
|
||
|
||
a[data-toggle="coco-modal"]
|
||
cursor: pointer
|