archive/pillar
0
0
Fork 0
Code Issues 42 Pull Requests Projects Releases Wiki Activity
Files
07821c7f97ba7d0c75d100d46a6b66ff8471dada
pillar/src/styles/theatre.sass

207 lines
4.0 KiB
Sass
Raw Normal View History

Fix and tweaks to theatre mode * Only show width/height if available (would be None otherwise) * If image width/height is not available, allow zooming * Fix styling and cleanup * Remove footer (reported by Vulp35 on Twitter, thanks!)
2018-10-01 11:56:52 +02:00
// Bootstrap variables and utilities.
@import "../../node_modules/bootstrap/scss/functions"
@import "../../node_modules/bootstrap/scss/variables"
@import "../../node_modules/bootstrap/scss/mixins"
// Pillar variables and utilities.
@import "config"
@import "utils"
// Bootstrap components.
@import "../../node_modules/bootstrap/scss/root"
@import "../../node_modules/bootstrap/scss/reboot"
@import "../../node_modules/bootstrap/scss/type"
@import "../../node_modules/bootstrap/scss/code"
@import "../../node_modules/bootstrap/scss/grid"
@import "../../node_modules/bootstrap/scss/dropdown"
@import "../../node_modules/bootstrap/scss/nav"
@import "../../node_modules/bootstrap/scss/navbar"
@import "../../node_modules/bootstrap/scss/tooltip"
@import "../../node_modules/bootstrap/scss/utilities"
// Pillar components.
@import "apps_base"
@import "components/navbar"
@import "components/dropdown"
@import "components/footer"
@import "components/shortcode"
@import "components/flyout"
@import "components/buttons"
@import "components/popover"
@import "components/tooltip"
@import "components/checkbox"
@import "components/overlay"
@import "components/card"
Quick-Search: Added Quick-search in the topbar Changed how and what we store in elastic to unify it with how we store things in mongodb so we can have more generic javascript code to render the data. Elastic changes: Added: Node.project.url Altered to store id instead of url Node.picture Made Post searchable ./manage.py elastic reset_index ./manage.py elastic reindex Thanks to Pablo and Sybren
2018-11-22 15:31:53 +01:00
@import "components/search"
Fix and tweaks to theatre mode * Only show width/height if available (would be None otherwise) * If image width/height is not available, allow zooming * Fix styling and cleanup * Remove footer (reported by Vulp35 on Twitter, thanks!)
2018-10-01 11:56:52 +02:00
@import "comments"
@import "notifications"
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
$theatre-width: 350px
CSS: Cleanup and simplification Mainly to rely more on bootstrap styling
2018-08-31 19:32:17 +02:00
body.theatre
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
.page-content
position: absolute
top: 0
left: 0
right: 0
bottom: 0
display: flex
align-items: center
justify-content: center
General cleanup
2018-08-28 15:52:50 +02:00
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
.page-body
height: 100%
width: 100%
#theatre-container
#theatre-media
height: 100%
width: 100%
padding: 25px
position: relative
Use native scrollbars
2016-11-16 17:48:35 +01:00
overflow: auto
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
&:hover
ul#theatre-tools
display: block
img
display: block
box-shadow: 1px 1px 10px rgba(black, .2)
max-width: 100%
max-height: 100%
height: auto
margin: 0 auto
+position-center-translate
&.zoomed-out
cursor: zoom-in
&.zoomed-in
display: block
padding: 0
img
cursor: zoom-out
position: initial
top: initial
left: initial
transform: initial
height: initial
width: initial
max-width: initial
max-height: initial
ul#theatre-tools
display: none
position: fixed
z-index: 9
bottom: 15px
right: 15px
margin: 0
padding: 0
list-style: none
color: white
background-color: rgba(black, .5)
border-radius: 3px
box-shadow: 0 0 15px rgba(black, .2)
li
display: inline-block
a, span
display: block
padding: 10px
cursor: default
color: white
&:hover a, &:hover span
color: $color-primary
&.download
a
cursor: pointer
&:hover
color: $color-primary
&.disabled
a
cursor: not-allowed
color: $color-text-dark-hint
&.active
background-color: rgba(black, .8)
a, span
color: $color-primary
&.theatre-tool-resize.active span i:before
content: '\e843'
&.with-info
#theatre-media ul#theatre-tools
right: $theatre-width + 15
#theatre-info
right: 0
visibility: visible
position: relative
Comments: Style tweaks More compact and also convert IDs to classes (when not used by javascript)
2017-09-21 01:14:53 +02:00
.comments-container .comments-list .comment-reply-container
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
.comment-reply-form .comment-reply-field textarea
display: block
#theatre-info
min-width: $theatre-width
Fix and tweaks to theatre mode * Only show width/height if available (would be None otherwise) * If image width/height is not available, allow zooming * Fix styling and cleanup * Remove footer (reported by Vulp35 on Twitter, thanks!)
2018-10-01 11:56:52 +02:00
overflow-y: auto
position: absolute
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
right: -$theatre-width
Fix and tweaks to theatre mode * Only show width/height if available (would be None otherwise) * If image width/height is not available, allow zooming * Fix styling and cleanup * Remove footer (reported by Vulp35 on Twitter, thanks!)
2018-10-01 11:56:52 +02:00
top: 0
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
transition: right 200ms ease-in-out
Fix and tweaks to theatre mode * Only show width/height if available (would be None otherwise) * If image width/height is not available, allow zooming * Fix styling and cleanup * Remove footer (reported by Vulp35 on Twitter, thanks!)
2018-10-01 11:56:52 +02:00
visibility: hidden
width: $theatre-width
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
ul.theatre-info-details
li
display: flex
padding: 2px 0
span
display: inline-block
flex: 2
&:first-child
flex: 1
Comments: Style tweaks More compact and also convert IDs to classes (when not used by javascript)
2017-09-21 01:14:53 +02:00
.comments-container
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
height: 100%
padding: 0 15px
Comments: Style tweaks More compact and also convert IDs to classes (when not used by javascript)
2017-09-21 01:14:53 +02:00
.comments-list
.comments-list-title
font-size: 1.2em
Introducing Pillar Framework Refactor of pillar-server and pillar-web into a single python package. This simplifies the overall architecture of pillar applications. Special thanks @sybren and @venomgfx
2016-08-19 09:19:06 +02:00
.comment-container,
.comment-reply-container
padding-top: 10px
padding-bottom: 10px
.comment-reply-form
.comment-reply-field textarea
display: none
.comment-reply-preview
padding-top: 25px
.comment-reply-meta
.comment-author,
.comment-rules
display: none
button.comment-action-submit
min-width: auto
font-size: .9em
Reference in New Issue Copy Permalink