882 lines
46 KiB
PHP
882 lines
46 KiB
PHP
@extends('layouts.setting')
|
||
|
||
<title>Inbox Setting</title>
|
||
|
||
@section('content')
|
||
|
||
<div class="content-wrapper">
|
||
<div class="dev-chat-tabs">
|
||
<div class="dev-tabs">
|
||
<button type="button" id="defaultOpenTab">User</button>
|
||
<button type="button">Flow Setting</button>
|
||
<button type="button">Display</button>
|
||
<button type="button">Text</button>
|
||
<button type="button">Style</button>
|
||
<button type="button">Abuse</button>
|
||
<button type="button">Canned Responses</button>
|
||
<button type="button">Personal Data & Policy</button>
|
||
<button type="button">Tags</button>
|
||
<button type="button">Chat Button</button>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-users">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Add a new user</h2>
|
||
</div>
|
||
<form>
|
||
<div class="dev-input-group">
|
||
<label for="name">Name</label>
|
||
<input type="text" placeholder="Enter your name">
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label for="name">Language</label>
|
||
<div class="dev-custom-select">
|
||
<select>
|
||
<option value="0">Select your language</option>
|
||
<option value="1">Audi</option>
|
||
<option value="2">BMW</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label for="email">Email</label>
|
||
<input type="email" placeholder="Enter your email">
|
||
</div>
|
||
<button type="submit">Send Activation Email </button>
|
||
</form>
|
||
<div class="dev-title-row">
|
||
<h2>Users</h2>
|
||
</div>
|
||
<div class="dev-users-boxs">
|
||
<div class="dev-users-box">
|
||
<img src="{{ asset('images/Avatar.png') }}">
|
||
<div class="dev-box">
|
||
<h3>Leslie Alexander</h3>
|
||
<span>user1@gmail.com</span>
|
||
</div>
|
||
<div class="dev-icon">
|
||
<img src="{{ asset('images/settingss.svg') }}" alt="">
|
||
</div>
|
||
<div class="dev-icon">
|
||
<img src="{{ asset('images/binn.svg') }}" alt="">
|
||
</div>
|
||
</div>
|
||
<div class="dev-users-box">
|
||
<img src="{{ asset('images/Avatar.png') }}">
|
||
<div class="dev-box">
|
||
<h3>Leslie Alexander</h3>
|
||
<span>user1@gmail.com</span>
|
||
</div>
|
||
<div class="dev-icon">
|
||
<img src="{{ asset('images/settingss.svg') }}" alt="">
|
||
</div>
|
||
<div class="dev-icon">
|
||
<img src="{{ asset('images/binn.svg') }}" alt="">
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-flow">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Settings for chat flow</h2>
|
||
<p>General settings for the chat flow.</p>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<h2>When do you want to have notifications via email?</h2>
|
||
<form>
|
||
<div class="col col-left">
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Show profile image of editors
|
||
<input type="checkbox" checked="checked">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Show profile image for users in the chat</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Allow users to join the queue
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Users can enter the queue to easily join the chat.</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Show the chat button even when no
|
||
editor is
|
||
available.
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>When no editor is available, visitors can still send
|
||
messages.</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Allow visitors to send messages
|
||
<input type="checkbox" checked="checked">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>When no editor is available, visitors can still send
|
||
messages.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label>Email address that messages should be sent to</label>
|
||
<input type="email" placeholder="Please enter your email">
|
||
</div>
|
||
|
||
|
||
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Max number of chats per editor</label>
|
||
<input type="text" placeholder="Type here...">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Editors can always send images and files.Editors can always
|
||
send
|
||
images and files.Editors can always send images and
|
||
files.</span>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Log everyone out automatically</label>
|
||
<div class="dev-custom-select">
|
||
<select>
|
||
<option value="0">Never</option>
|
||
<option value="1">Audi</option>
|
||
<option value="2">BMW</option>
|
||
</select>
|
||
</div>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>The "Available" editor in this chat is set as "Busy" at this
|
||
time
|
||
of
|
||
day.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Log out editor who has missed a
|
||
chat
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Editor who is "Available" in the chat is marked as "Busy"
|
||
after
|
||
they
|
||
have missed a chat.</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col col-right">
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Vistors can send images and files
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Editors can always send images and files.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Guest must write Name and Email to
|
||
chat
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Choose whether you want to require Name and Email or if guests
|
||
may
|
||
chat
|
||
anonymously. Cross this out if the chat will be started
|
||
automatically.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Save email address for anonymous
|
||
chats
|
||
<input type="checkbox" checked="checked">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>When the user in an anonymous chat opts to have the chat sent
|
||
to
|
||
him
|
||
or
|
||
her, the email address
|
||
is saved.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper"> Delete chat data automatically
|
||
<input type="checkbox" checked="checked">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>You can choose to automatically delete chat conversations from
|
||
Kundo
|
||
after
|
||
a certain time. Conversations that are deleted by this option
|
||
can
|
||
not be
|
||
restored. Existing conversations that are older than the time
|
||
limit
|
||
will
|
||
be
|
||
deleted too.
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>The chat assistant shows suggestions from:</label>
|
||
<div class="dev-custom-select">
|
||
<select>
|
||
<option value="0">None</option>
|
||
<option value="1">Audi</option>
|
||
<option value="2">BMW</option>
|
||
</select>
|
||
</div>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Users get suggested replies from the chat assistant before
|
||
they
|
||
start
|
||
a
|
||
chat. The chat code must be entered in the forum or knowledge
|
||
base.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Delay for automatic deletion</label>
|
||
<input type="text" placeholder="Type here...">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>The number of days a conversation should be stored in Kundo
|
||
until
|
||
it
|
||
is
|
||
automatically deleted (if automatic deletion is enabled).</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
<button type="submit" class="dev-form-submit-btn">Save Changes</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-display">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Display Rules</h2>
|
||
<p>Here you can specify which pages the chat should be visible on, and if the chat
|
||
should start automatically or not.</p>
|
||
</div>
|
||
<div class="dev-title-copy">
|
||
<h2>When do you want to have notifications via email? </h2>
|
||
<div class="dev-title-copy-inner">
|
||
<p>
|
||
Display chat when on
|
||
<a href="#">
|
||
chat.kundo.se/chat/demo/chat-y9oc0g5n/
|
||
</a>
|
||
</p>
|
||
<div class="dev-thumbnail-wrapper">
|
||
<div class="dev-thumbnail dev-thumbnail1 ">
|
||
<img src="{{ asset('images/editt.svg') }}" alt="">
|
||
</div>
|
||
<div class="dev-thumbnail dev-thumbnail2">
|
||
<img src="{{ asset('images/binn-white.svg') }}" alt="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="dev-title-copy-inner">
|
||
<p>
|
||
Display chat when on
|
||
<a href="#">
|
||
chat.kundo.se/chat/demo/chat-y9oc0g5n/
|
||
</a>
|
||
</p>
|
||
<div class="dev-thumbnail-wrapper">
|
||
<div class="dev-thumbnail dev-thumbnail1 ">
|
||
<img src="{{ asset('images/editt.svg') }}" alt="">
|
||
</div>
|
||
<div class="dev-thumbnail dev-thumbnail2">
|
||
<img src="{{ asset('images/binn-white.svg') }}" alt="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Display chat when on</h2>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<form>
|
||
<div class="col col-left">
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Path</label>
|
||
<input type="text" placeholder="Type here...">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>http://example.com/* - means all subpages to example.com
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Automatically start the chat after:</label>
|
||
<div class="dev-custom-select">
|
||
<select>
|
||
<option value="0">Never</option>
|
||
<option value="1">Audi</option>
|
||
<option value="2">BMW</option>
|
||
</select>
|
||
</div>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>The chat will open automatically after the specified time. The
|
||
clock starts ticking when the visitor goes to that specific
|
||
page.
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</div>
|
||
<div class="col col-right">
|
||
<div class="dev-input-info-fill">
|
||
<img src="{{ asset('images/green-infoo.svg') }}" alt="info">
|
||
<span>Example</span>
|
||
<p>www.example.com/*<br>Show the chat on all pages on your
|
||
website <br><br>www.example.com/<br>Only show the chat of the start
|
||
page.<br><br>www.example.com/support/*<br>Show the chat on page
|
||
"support" and all
|
||
subpages.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Hide chat when on</h2>
|
||
<p>Specify pages/domains where the chat widget should not be shown. An ongoing chat
|
||
follows the visitor even to pages when the chat widget
|
||
should not be shown.</p>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<form>
|
||
<div class="col col-left">
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Path</label>
|
||
<input type="text" placeholder="Type here...">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>http://example.com/* - means all subpages to example.com
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</div>
|
||
<div class="col col-right">
|
||
<div class="dev-input-info-fill">
|
||
<img src="{{ asset('images/green-infoo.svg') }}" alt="info">
|
||
<span>Example</span>
|
||
<p>www.example.com/jobs/*<br>Hide the chat on page "jobs" and all
|
||
subpages.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-text">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Texts</h2>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<form>
|
||
<div class="col col-left">
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Internal name of chat flow</label>
|
||
<input type="text" placeholder="Chat">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Internal name that only editors see.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Company name</label>
|
||
<input type="text" placeholder="Type here">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Or other official sender. This name is displayed in e-mails
|
||
sent
|
||
to the visitor from the chat (if sending of chat history is
|
||
enabled)</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Welcome text</label>
|
||
<textarea rows="6">Hi! Feel free to contact us via chat if you are wondering about anything.
|
||
</textarea>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Displayed when the chat is opened and there is a user in the
|
||
queue
|
||
for the chat.</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col col-right">
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Public name of chat flow</label>
|
||
<input type="text" placeholder="Limon Media">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Internal name that only editors see.</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Welcome text at the queue</label>
|
||
<textarea
|
||
rows="6">Hi! We will be chatting with you soon, but there are some people in front of you in the queue. </textarea>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Displayed when the chat is opened.</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Message when the chat is closed</label>
|
||
<div class="input-box-row">
|
||
<div class="ui card inbox-send-message-card w-100">
|
||
<div class="content input-options bg-dark-green-color">
|
||
<div class="input-option-row ">
|
||
<img src="{{ asset('images/icons/B.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/I.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (5).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (6).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (8).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/drive.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (5).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (6).png') }}" alt="">
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="content d-flex align-items-end flex-column message-writing-content-area">
|
||
<textarea rows="5" placeholder="Your Message"
|
||
class="form-control input-reply-textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Shown when no editor is online in the chat system. </span>
|
||
</div>
|
||
</div>
|
||
<form>
|
||
<div class="col col-left">
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Test in the answer box</label>
|
||
<input type="text" placeholder="What can i help you with!">
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Start message</label>
|
||
<input type="text" placeholder="What can i help you with!">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Message that is automatically sent as the first message when
|
||
starting a chat.</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col col-right"></div>
|
||
</form>
|
||
<div class="dev-input-group dev-input-group-input-info dev-spacer">
|
||
<label>Message when the chat is closed</label>
|
||
<div class="input-box-row">
|
||
<div class="ui card inbox-send-message-card w-100">
|
||
<div class="content input-options bg-dark-green-color">
|
||
<div class="input-option-row ">
|
||
<img src="{{ asset('images/icons/B.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/I.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (5).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (6).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (8).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/drive.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (5).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (6).png') }}" alt="">
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="content d-flex align-items-end flex-column message-writing-content-area">
|
||
<textarea rows="7" placeholder="Feel free to send a masseage"
|
||
class="form-control input-reply-textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info dev-spacer">
|
||
<label>Message when the chat is closed</label>
|
||
<div class="input-box-row">
|
||
<div class="ui card inbox-send-message-card w-100">
|
||
<div class="content input-options bg-dark-green-color">
|
||
<div class="input-option-row ">
|
||
<img src="{{ asset('images/icons/B.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/I.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (5).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (6).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (8).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/drive.png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (5).png') }}" alt="">
|
||
<img src="{{ asset('images/icons/Vector (6).png') }}" alt="">
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="content d-flex align-items-end flex-column message-writing-content-area">
|
||
<textarea rows="7" placeholder="Thank you for your message!"
|
||
class="form-control input-reply-textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-style">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Style</h2>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<form>
|
||
<div class="col-left">
|
||
<div class="dev-box">
|
||
<h3>Text theme color</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-box">
|
||
<h3>Background theme color</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-box">
|
||
<h3>Text color for sent messages</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-box">
|
||
<h3>Background color of sent messages</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-box">
|
||
<h3>Text color of received messages</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-box">
|
||
<h3>Text color of notification icon</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</div>
|
||
<div class="col-right">
|
||
<div class="dev-box">
|
||
<h3>Text color of error messages</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-box">
|
||
<h3>Background color of error messages</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-box">
|
||
<h3>Link color</h3>
|
||
<div class="dev-box-inner">
|
||
<input type="text" readonly placeholder="#020400">
|
||
<span></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-abuse">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Show the chat on your website</h2>
|
||
<p>Here you can block IP addresses if you are experiencing problems with users who
|
||
do
|
||
not follow the rules.</p>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<h2>Block IP addresses</h2>
|
||
<form>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>IP address *</label>
|
||
<input type="text" placeholder="Enter here">
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>A full or partial IP address. E.g. 127.0.0.1 or 127.0.0</span>
|
||
</div>
|
||
</div>
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper">Delete
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-canned">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Create a new canned response</h2>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<form>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Name</label>
|
||
<input type="text" placeholder="Type here">
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Text</label>
|
||
<textarea rows="6">Hi! Feel free to contact us via chat if you are wondering about anything.
|
||
</textarea>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</form>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-policy">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Personal data & policy</h2>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<h2>Approval of processing of personal data</h2>
|
||
<p>Select if users must click on a checkbox to approve policy before they can
|
||
contact
|
||
you.</p>
|
||
<form>
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper">Require active approval (check box)
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Text</label>
|
||
<input type="text" placeholder="Type here">
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Link text</label>
|
||
<input type="text" placeholder="Type here">
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Preview</label>
|
||
<input type="text">
|
||
</div>
|
||
<div class="dev-input-group dev-input-group-input-info dev-custom-input-group">
|
||
<label>Policy for personal data</label>
|
||
<p>Custom policy</p>
|
||
<button type="button" class="dev-form-submit-btn">Edit</button>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</form>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-tags">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Tags</h2>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<form>
|
||
<div class="dev-input-group">
|
||
<label class="dev-checkbox-wrapper">Allow new tags to be created when
|
||
tagging
|
||
<input type="checkbox">
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</form>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<!-- -->
|
||
<div class="dev-tabcontent dev-tabcontent-chats">
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<h2>Settings for all chats</h2>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<form>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<label>Heading when selecting chat flow</label>
|
||
<textarea rows="6">
|
||
</textarea>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Displayed when the visitor can choose between different chat
|
||
flows.</span>
|
||
</div>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">Save</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
<div class="dev-tabcontent-outers">
|
||
<div class="dev-title-row">
|
||
<div>
|
||
<h2>Show the chat on your website</h2>
|
||
<p>Copy the following code and add on your website so visitors can chat with
|
||
you.
|
||
</p>
|
||
</div>
|
||
<button type="button" class="dev-form-submit-btn">DEMO <img
|
||
src="{{ asset('images/Arrow_right_stop.svg') }}" alt=""></button>
|
||
</div>
|
||
<div class="dev-content-inner">
|
||
<h2>Add the code to your website</h2>
|
||
<p>The following code should be placed at the bottom of the html-code, right
|
||
before body-tag, on all
|
||
pages where the chat should be visible.</p>
|
||
<form>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<textarea rows="11"> <script>
|
||
(function (w) {
|
||
w.$kundo_chat = w.$kundo_chat || {};
|
||
w.$kundo_chat.custom_texts = {
|
||
START_TEXT: 'Chat with us',
|
||
};
|
||
}(this));
|
||
</script>
|
||
<script src="https://static-chat.kundo.se/chat-js/org/1779/widget.js" async defer></script>
|
||
</textarea>
|
||
<div class="dev-input-info">
|
||
<img src="{{ asset('images/info.svg') }}" alt="info">
|
||
<span>Displayed when the visitor can choose between different chat
|
||
flows.</span>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
<h2>Customized chat</h2>
|
||
<p>It's possible to customize how the chat works on your website. The code below can
|
||
be
|
||
used to automatically
|
||
fill out the users name and email when the chat is started. It can be added
|
||
anywhere
|
||
on the page where the chat is loaded.
|
||
</p>
|
||
<form>
|
||
<div class="dev-input-group dev-input-group-input-info">
|
||
<textarea rows="6"> window.$kundo_chat=window.$kundo_chat
|
||
||{};window.$kundo_chat.user={
|
||
"name": "Användare Användarsson","email":
|
||
"anvandare@example.com",};
|
||
</textarea>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<!-- <div class="dev-tabcontent">
|
||
<h3>Paris</h3>
|
||
<p>Paris is the capital of France.</p>
|
||
</div>
|
||
|
||
<div class="dev-tabcontent">
|
||
<h3>Tokyo</h3>
|
||
<p>Tokyo is the capital of Japan.</p>
|
||
</div> -->
|
||
|
||
</div>
|
||
</div>
|
||
|
||
@endsection |