Установите чат-бот на полный экран на мобильном телефоне / планшете - PullRequest
0 голосов
/ 15 ноября 2018

Я встроил чат-бот на веб-сайт, который открывается в правой нижней части экрана одним нажатием кнопки.Мне просто нужен этот бот, чтобы автоматически приспосабливать все мобильные устройства / планшеты с экрана одним нажатием кнопки.Примечание: я хочу, чтобы бот занимал весь экран для мобильных устройств / планшетов.

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

<div class="container">
  <button class="btn askQuestion"><img src="images/question.png" /> Ask a Question</button>
  <div id="chat_window_1" class="row chat-window col-xs-6 col-md-4" style="margin-left:10px;">
    <div class="col-xs-12 col-md-12">
      <div class="panel panel-default noBorder">
        <div class="panel-heading top-bar chat-heading">
          <div class="col-md-8 col-xs-8 noLRP">
            <h3 class="panel-title ChatTitle"><img src="images/32x32.png" class="titleImg" />DPOPlus Q&A</h3>
            <!-- <img src="images/chat-logo.png" alt="Dominer" /> -->
          </div>
          <div class="col-md-4 col-xs-4" style="text-align: right;">
            <!-- <a href="#"><span id="minim_chat_window" class="glyphicon glyphicon-minus icon_minim"></span></a>-->
            <a id="expand" href="#"><span class="glyphicon glyphicon-new-window"></span></a>
            <a href="#"><span class="glyphicon glyphicon-remove icon_close" data-id="chat_window_1"></span></a>
          </div>
        </div>
        <div id="response" class="panel-body msg_container_base"></div>
        <div id="footdiv" class="panel-footer">
          <div class="input-group">
            <input id="btn-input" type="text" class="form-control input-sm chat_input" placeholder="Write your message..." />
            <span class="input-group-btn">
              <button class="btn btn-sm sendBtn" id="btn-chat"><img src="images/send.png"></button>
            </span>
          </div>
        </div>
      </div>
    </div>
  </div>   
</div>
...