Need to know how window on Client portal can be resized so user can see more no of tickets in same window.

Version 1.12.5
Php 7.0.29


Need to know how window on Client portal can be resized so user can see more no of tickets in same window.

Version 1.12.5
Php 7.0.29

    You would do it the same way that you make the Agent side wider, that is to say edit the css files.

    Pretty sure that would be at:
    /css/osticket.css
    -or-
    /assets/default/css/

    apyash
    Here are CSS file changes you will need to get 90% or 100% of your screen:
    The line number may not match, also make sure to do backup and keep note, because when you upgrade these settings will be wiped and you will need to re-add it

    // Admin Screen
    // /scp/css/scp.css line: 127
    /* changed This will change whole Width of page
    width: 960px to 90%
    */
    #container {
    width:90%;
    margin:0 auto 20px auto;
    }

    /* added line:517
    width: 100%;
    */
    table.list {
    clear: both;
    background: #ccc;
    margin: 2px 0;
    border-bottom: 1px solid #ccc;
    width: 100%;
    }

    /* changed Overflow Menu line: 727
    width: 960px to 90%
    */
    .jb-overflowmenu {
    position: relative;
    height:35px;
    width: 90%;
    }

    /* added width: 100% line:1128
    */
    table.list {
    clear:both;
    background:#ccc;
    margin: 2px 0;
    border-bottom: 1px solid #ccc;
    width:100%;
    }

    /* added width:100% Line:1287*/
    .form_table {
    margin-top:3px;
    border-left:1px solid #ddd;
    border-right:1px solid #ddd;
    width: 100%;
    }

    /* added width: 100% line:1474*/
    .ticket_info {
    background:#F4FAFF;
    width:100%;
    }

    ============= Cleint Screen: ==============

    // assets/default/css/theme.css?9ae093d:89
    // added width: 100%
    table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    }

    // /assets/default/css/theme.css?9ae093d:292
    // Change width from 840px to 90%
    #container {
    background: #fff;
    width: 840px;
    margin: 0 auto;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
    }

    ///assets/default/css/theme.css?9ae093d:795
    // added width 100%
    #ticketTable {
    border: 1px solid #aaa;
    border-left: none;
    border-bottom: none;
    width: 100%;
    }

    ============= this might need to apply to media size only ============
    https: /assets/default/css/theme.css?9ae093d:339
    // added float: left;
    #nav li {
    margin: 0;
    padding: 0px;
    list-style: none;
    display: inline;
    float: left;
    }

    https:/assets/default/css/theme.css?9ae093d:108
    // float:left;
    }
    h1, h2, h3, h4, h5, h6, form, fieldset {
    margin: 0;
    padding: 0px;
    float: left;
    }

      Thanks for quick reply.
      I have tried this. Ticket View page is corrected from above changes. BUT ticket creation page alignment seems to be affected as below screen coming for Ticket Creation Page on Client Scree now.

        apyash
        If you use my CSS settings using 90%, everything would work out, that's what I am using, if you changed to 100%, then you will need to minus out those pixels from left or right to fix in the screen.

          I have changed to 90% still in Opening Ticket Page
          Copyright text coming in between of this page. I may need to do some more tweaking to get it fixed on "Create Ticket Page".

            apyash
            Not sure why, but I think you missing something or typo, it works fine for me

              4 years later

              Are these changes still effective in 1.17.4/1.18? Or is there more to change now?

                7 days later

                JamesDean59
                it should be, if anything not working, or added in new version you will need to add it

                  25 days later

                  @ramrajone
                  I've applied above settings and it working fine, except for the text editor (redactor): the text is still aligned at around 50% of the screen
                  Update: this behaviour only occurs in within replying to existing tickets, not when opening a new ticket

                  I've tried to change /var/www/osticket/upload/css/redactor.css , but I only found 1 instance of max-width, but nothing seems to alter this. If I change the CSS in the devtools of my browser, this section did the trick:

                  element.style {
    min-height: 150px;
    max-width: 95%;
    margin: auto;
}

                  My question: which .css file section do I need to change to change the text width in the text editor?

                  FYI: I'm using version 1.17.3

                    wouterve
                    This is the file I have made changes that work for me, also make sure to clear the cache or use another browser to test after applying:
                    the file is \js\redactor-osticket.js and you change line 378:
                    from 'maxWidth': el.hasClass('fullscreen') ? '950px' : false,
                    to 'maxWidth': el.hasClass('fullscreen') ? '100%' : false,

                      OK perfect, I've done the same and it's working for me as well!

                      Thanks for the help

                      (reminder for others reading this post: you need to apply these adaptations for each update)

                        Write a Reply...