craftpip / jquery-confirm

A multipurpose plugin for alert, confirm & dialog, with extended features.
http://craftpip.github.io/jquery-confirm/
MIT License
1.87k stars 507 forks source link

fullscreen mode #522

Open alombia opened 4 years ago

alombia commented 4 years ago

jquery-confirm version: v3.x.x

I'm submitting a ... (check one with "x") [ ] bug report [ ] feature request [ ] support request

Current behavior:

Expected behavior:

Steps to reproduce:

Related code:

insert any relevant code here

Other information:

Hizoka76 commented 4 years ago

I done this :

css file :

.jconfirm .jconfirm-holder {
    max-height: 100%;
    padding: 50px 0;
}

=>

.jconfirm .jconfirm-holder {
    max-height: 100%;
}

 

js file :

                template.find('.jconfirm-box').css('width', this.boxWidth);

=>

                if(! this.fullScreen) {
                    template.find('.jconfirm-box').css('width', this.boxWidth);
                } else {
                    template.find('.jconfirm').css('width', $('html').width());
                    template.find('.jconfirm-box').css('height', $('html').height());
                    template.find('.jconfirm-content-pane').css('height', $('html').height() - 50);
                }

 

            this.$holder.css({
                'padding-top': this.offsetTop,
                'padding-bottom': this.offsetBottom,
            });

=>

            if(! this.fullScreen) {
                this.$holder.css({
                    'padding-top': this.offsetTop,
                    'padding-bottom': this.offsetBottom,
                });
                template.find('.jconfirm .jconfirm-holder').css('padding', '50px 0');
            }

 

        bootstrapClasses: {

=>

        fullScreen: false,
        bootstrapClasses: {

 

        _buildHTML: function(){
            var that = this;

=>

        _buildHTML: function(){
            var that = this;

            if(this.fullScreen) {
                this.draggable = false
                this.backgroundDismiss = false
                this.backgroundDismissAnimation = false
            }

 

        _parseBgDismissAnimation: function(bgDismissAnimation){
            var animation = bgDismissAnimation.split(',');
            var that = this;
            $.each(animation, function(k, a){
                if(a.indexOf(that._bgDismissPrefix) === -1)
                    animation[k] = that._bgDismissPrefix + $.trim(a);
            });
            this.backgroundDismissAnimationParsed = animation.join(' ').toLowerCase();
        },

=>

        _parseBgDismissAnimation: function(bgDismissAnimation){
            if(bgDismissAnimation) {
                var animation = bgDismissAnimation.split(',');
                var that = this;
                $.each(animation, function(k, a){
                    if(a.indexOf(that._bgDismissPrefix) === -1)
                        animation[k] = that._bgDismissPrefix + $.trim(a);
                });
                this.backgroundDismissAnimationParsed = animation.join(' ').toLowerCase();
            }
        },

 

Now, just add fullScreen: true in your command :)