⚠ In case you've missed it, we have migrated to our new website, with a brand new forum. For more details about the migration you can read our blog post for website migration. This is an archived forum. ⚠

  •     

profile picture

Increase size of Add Modal



GaryW
  • profile picture
  • Member

Posted 02 October 2019 - 13:22 PM

Hi.

 

I have an Add Modal that only has one Relationship drop down in it, however the drop down menu is longer than the pop up window size.  An outer scroll bar appears, but its not very pretty to see the drop down menu chopping off because the Modals height is not high enough.

 

In inspector I can manually over ride the min-height:250px to min-height: 500px and it looks beautiful, however I cant find what governs that code to have it change in the real code.
 

<div class="modal-body gc-modal-body" style="min-height: 250px; max-height: 953px;"><div> 

Any help appreciated


Soreno
  • profile picture
  • Member

Posted 02 October 2019 - 18:01 PM

Hi GaryW.

Try to rewrite that style from your view.php. Something like:

<style>
.gc-insert-modal .gc-modal-body {
   min-height: 500px;
   max-height: 953px;
}
</style>

GaryW
  • profile picture
  • Member

Posted 02 October 2019 - 19:27 PM

Thank you Soreno, unfortunately that doesn't work.  The Min-Height Css is inline so it gets over ridden.


Soreno
  • profile picture
  • Member

Posted 02 October 2019 - 19:58 PM

Ok, then use "!important"

.gc-insert-modal .gc-modal-body {
   min-height: 500px !important;
   max-height: 953px !important;
}

GaryW
  • profile picture
  • Member

Posted 02 October 2019 - 20:13 PM

You would think that would work but it doesnt

 

 

Ok, then use "!important"

.gc-insert-modal .gc-modal-body {
   min-height: 500px !important;
   max-height: 953px !important;
}

Soreno
  • profile picture
  • Member

Posted 02 October 2019 - 20:34 PM

[attachment=1382:Screenshot_20191002_232514.png]


GaryW
  • profile picture
  • Member

Posted 02 October 2019 - 21:22 PM

Curious, where in your view are you coding?


Soreno
  • profile picture
  • Member

Posted 03 October 2019 - 07:46 AM

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <?php foreach($css_files as $file): ?>
        <link type="text/css" rel="stylesheet" href="<?php echo $file; ?>" />
    <?php endforeach; ?>
    <style>
     .gc-insert-modal .gc-modal-body {
        min-height: 500px !important;
        max-height: 953px !important;
     }
    </style>
</head>
<body>
        <div style="padding: 20px 10px;">
            <?php echo $output; ?>
        </div>
        <?php foreach($js_files as $file): ?>
            <script src="<?php echo $file; ?>"></script>
        <?php endforeach; ?>
</body>
</html>

GaryW
  • profile picture
  • Member

Posted 03 October 2019 - 15:03 PM

Thats where i am putting it, i can see it in my source code but its not showing up in the inspector window.

 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <?php foreach($css_files as $file): ?>
        <link type="text/css" rel="stylesheet" href="<?php echo $file; ?>" />
    <?php endforeach; ?>
    <style>
     .gc-insert-modal .gc-modal-body {
        min-height: 500px !important;
        max-height: 953px !important;
     }
    </style>
</head>
<body>
        <div style="padding: 20px 10px;">
            <?php echo $output; ?>
        </div>
        <?php foreach($js_files as $file): ?>
            <script src="<?php echo $file; ?>"></script>
        <?php endforeach; ?>
</body>
</html>

GaryW
  • profile picture
  • Member

Posted 03 October 2019 - 15:15 PM

Fixed, thank you Sereno, slight correction:

        <style type="text/css">
           .gc-modal-body {
           min-height: 500px !important;
           max-height: 953px !important;
           }
      </style>