@import '../../styles/constants';

.ArtboardModule {
    @extend %background;

    position: absolute;

    display: flex;
    align-items: center;
    justify-content: center;

    &__artboard {
        position: absolute;
    }

    #base {
        position: relative;

        width: 100%;
        height: 100%;

        transform-origin: center;
    }

    &--enabled {
        .ArtboardModule__artboard {
            * {
                &:not(.ui-dialog) {
                    cursor: pointer;
                }
            }
        }
    }

    &--shown {
        position: relative;

        display: inline-block;
        padding-top: $header-height;

        .ArtboardModule__artboard {
            transform-origin: top left;
        }
    }
}
