Mercurial > hg > dml-open-vis
diff src/DML/MainVisBundle/Resources/assets/bem-blocks/main-region.less @ 0:493bcb69166c
added public content
author | Daniel Wolff |
---|---|
date | Tue, 09 Feb 2016 20:54:02 +0100 |
parents | |
children |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/DML/MainVisBundle/Resources/assets/bem-blocks/main-region.less Tue Feb 09 20:54:02 2016 +0100 @@ -0,0 +1,90 @@ +@import "../config.less"; + +.main-region { + + @perspective: 900px; + @duration: .75s; + + .font_standard(); + + position: absolute; + top: @main-menu--height; + bottom: 0; + right: 0; + left: 0; + z-index: @z-index_main-region; + + // ================================== + + &__config-grid { + .position_absolute_everywhere(); + z-index: @z-index_main-region + 2; + } + + // ================================== + &__flipper-container { + background-color: #ccc; + .box-shadow(inset 0px 5px 5px 0px rgba(0,0,0,0.2)); + .position_absolute_everywhere(); + .perspective(@perspective); + z-index: @z-index_main-region-flipper; + } + &__flipper { + .position_absolute_everywhere(); + .transform-style(preserve-3d); + .transition(transform @duration); + .transform-origin(right center); + z-index: @z-index_main-region-flipper + 1; + .backface-visibility(hidden); + } + + &__flipper_to_recording { + .transform(translateX(-100%) rotateY(-180deg)); + } + + &__flipper &__config-grid { + .transition(transform @duration); + .transform-style(preserve-3d); + } + &__flipper_animating &__config-grid { + .backface-visibility(hidden); + } + + &__flipper &__config-grid.config-grid_type_collection { + z-index: @z-index_main-region-flipper + 3; + //background: #f00; + } + + &__flipper &__config-grid.config-grid_type_recording { + z-index: @z-index_main-region-flipper + 2; + .transform(rotateY(180deg)); + //background: #0f0; + } + + .ie &__flipper &__config-grid { + } + + .ie &__flipper &__config-grid.config-grid_type_recording { + .transform(rotateY(0deg)); + } + + .ie &__flipper_to_recording { + .transform(translateX(0px) rotateY(0deg)); + } + + .ie &__flipper_animating &__config-grid { + .transform-origin(center center); + } + + .ie &__flipper_to_collection &__config-grid.config-grid_type_collection, + .ie &__flipper_to_recording &__config-grid.config-grid_type_recording { + .transform(perspective(@perspective) rotateY(0deg)); + } + + .ie &__flipper_to_collection &__config-grid.config-grid_type_recording { + .transform(perspective(@perspective) rotateY(180deg)); + } + .ie &__flipper_to_recording &__config-grid.config-grid_type_collection { + .transform(perspective(@perspective) rotateY(-180deg)); + } +} \ No newline at end of file