date + time layoutRef

This commit is contained in:
Felix Niklas 2015-09-29 15:54:14 +02:00
parent 51963fe859
commit 1ad13c2b59
4 changed files with 682 additions and 610 deletions

View file

@ -848,6 +848,8 @@ class TicketZoomRef extends App.ControllerContent
startDate: new Date().toLocaleDateString("en-US") # returns 9/25/2015 startDate: new Date().toLocaleDateString("en-US") # returns 9/25/2015
container: @$('.js-datepicker').parent() container: @$('.js-datepicker').parent()
@$('.js-timepicker').timepicker()
# for testing purposes the highlights get stored in localStorage # for testing purposes the highlights get stored in localStorage
loadHighlights: -> loadHighlights: ->
if highlights = localStorage['highlights'] if highlights = localStorage['highlights']

View file

@ -39,7 +39,7 @@
<p> <p>
Enter the link provided by the plugin at the end of the installation to link the two systems: Enter the link provided by the plugin at the end of the installation to link the two systems:
</p> </p>
<div class="form-group fromGroup--standalone"> <div class="form-group formGroup--standalone">
<label for="otrs-link">OTRS Link</label> <label for="otrs-link">OTRS Link</label>
<div class="u-positionOrigin"> <div class="u-positionOrigin">
<input type="url" id="otrs-link" class="form-control" placeholder="http://otrs.company.de/otrs"> <input type="url" id="otrs-link" class="form-control" placeholder="http://otrs.company.de/otrs">

View file

@ -1,4 +1,5 @@
<div class="main no-padding flex tabsSidebar-sidebarSpacer tabsSidebar-tabsSpacer"> <div class="tabsSidebar-holder">
<div class="main no-padding flex tabsSidebar-sidebarSpacer tabsSidebar-tabsSpacer">
<div class="ticketZoom"> <div class="ticketZoom">
<div class="ticketZoom-controls"> <div class="ticketZoom-controls">
@ -81,16 +82,16 @@
<div class="bubble-arrow"></div> <div class="bubble-arrow"></div>
<div class="textBubble-content"> <div class="textBubble-content">
<div class="article-text" id="article-1249870934"> <div class="article-text" id="article-1249870934">
Welcome! Welcome!
<br/> <br/>
Thank you for installing Zammad.<br/> Thank you for installing Zammad.<br/>
<br/> <br/>
You will find updates and patches at <a href="http://zammad.org/" title="http://zammad.org/" target="_blank">http://zammad.org/</a>. Online<br/> You will find updates and patches at <a href="http://zammad.org/" title="http://zammad.org/" target="_blank">http://zammad.org/</a>. Online<br/>
documentation is available at <a href="http://guides.zammad.org/" title="http://guides.zammad.org/" target="_blank">http://guides.zammad.org/</a>. You can also<br/> documentation is available at <a href="http://guides.zammad.org/" title="http://guides.zammad.org/" target="_blank">http://guides.zammad.org/</a>. You can also<br/>
use our forums at <a href="http://forums.zammad.org/" title="http://forums.zammad.org/" target="_blank">http://forums.zammad.org/</a><br/> use our forums at <a href="http://forums.zammad.org/" title="http://forums.zammad.org/" target="_blank">http://forums.zammad.org/</a><br/>
<br/> <br/>
Regards,<br/> Regards,<br/>
The <a href="http://Zammad.org" title="http://Zammad.org" target="_blank">Zammad.org</a> Project The <a href="http://Zammad.org" title="http://Zammad.org" target="_blank">Zammad.org</a> Project
</div> </div>
<div class="textBubble-overflowContainer"> <div class="textBubble-overflowContainer">
<div class="btn btn--text js-unfold"><%- @T('See more') %></div> <div class="btn btn--text js-unfold"><%- @T('See more') %></div>
@ -185,7 +186,7 @@ The <a href="http://Zammad.org" title="http://Zammad.org" target="_blank">Zammad
<div class="flex bubble-gap internal-border"> <div class="flex bubble-gap internal-border">
<div class="textBubble"><div class="bubble-arrow"></div><div class="article-text" id="article-35098758344">Ich wollte mir die Lyrics von Maria herunterladen, aber ich schaff es einfach nicht, da raufzukommen. Schick mir bitte mein Passwort. <div class="textBubble"><div class="bubble-arrow"></div><div class="article-text" id="article-35098758344">Ich wollte mir die Lyrics von Maria herunterladen, aber ich schaff es einfach nicht, da raufzukommen. Schick mir bitte mein Passwort.
Grüße, Peter</div></div> Grüße, Peter</div></div>
</div> </div>
</div> </div>
<div class="article-meta-clip bottom"> <div class="article-meta-clip bottom">
@ -235,24 +236,24 @@ Grüße, Peter</div></div>
<div class="textBubble"> <div class="textBubble">
<div class="bubble-arrow"></div> <div class="bubble-arrow"></div>
<div class="textBubble-content"><div class="article-text" id="article-350234270934">Lieber HP,<br> <div class="textBubble-content"><div class="article-text" id="article-350234270934">Lieber HP,<br>
anbei findest du die Midi Noten für Maria Maria "I Like it Loud".<br> anbei findest du die Midi Noten für Maria Maria "I Like it Loud".<br>
Wünsche dir einen guten Auftritt in Hamburg.<br> Wünsche dir einen guten Auftritt in Hamburg.<br>
<br> <br>
Deine Frau bekommt ein Kind haben wir gehört.<br> Deine Frau bekommt ein Kind haben wir gehört.<br>
Gratulation dazu! Wir schicken dir was liebes.<br> Gratulation dazu! Wir schicken dir was liebes.<br>
<br> <br>
Und wenn du noch mal Probleme mit der Stimme hast sag bescheid ich kenn da ein Wundermittel.<br> Und wenn du noch mal Probleme mit der Stimme hast sag bescheid ich kenn da ein Wundermittel.<br>
<br> <br>
Das ist eine Pille von einem Druiden aus dem Bayerischen Wald. Die ölt einem so richtig die Stimmbänder.<br> Das ist eine Pille von einem Druiden aus dem Bayerischen Wald. Die ölt einem so richtig die Stimmbänder.<br>
<br> <br>
Verwende ich immer wenn ich meine Frau anschreien will. Die macht meinen Tenor richtig zum Löwen.<br> Verwende ich immer wenn ich meine Frau anschreien will. Die macht meinen Tenor richtig zum Löwen.<br>
<br> <br>
Ach ja und dein Freund Tim. Richt dem mal aus dass er das doch bitte sein lassen soll mit den Anrufen.<br> Ach ja und dein Freund Tim. Richt dem mal aus dass er das doch bitte sein lassen soll mit den Anrufen.<br>
<br>Ich weiß schon dass ich ein hübscher bin. Aber ich hab ihm schon tausend mal gesagt, dass ich seine Gefühle leider nicht erwiedern kann.<br> <br>Ich weiß schon dass ich ein hübscher bin. Aber ich hab ihm schon tausend mal gesagt, dass ich seine Gefühle leider nicht erwiedern kann.<br>
<br> <br>
Bin verheiratet, hab Kind. Is doch offensichtlich, Junge!<br> Bin verheiratet, hab Kind. Is doch offensichtlich, Junge!<br>
Alles gute,<br> Alles gute,<br>
Oliver<br></div> Oliver<br></div>
<div class="textBubble-overflowContainer"> <div class="textBubble-overflowContainer">
<div class="btn btn--text js-unfold"><%- @T('See more') %></div> <div class="btn btn--text js-unfold"><%- @T('See more') %></div>
</div> </div>
@ -300,9 +301,9 @@ Oliver<br></div>
</div> </div>
</div> </div>
</div> </div>
<div class="tabsSidebar tabsSidebar--attributeBarSpacer vertical"> <div class="tabsSidebar tabsSidebar--attributeBarSpacer vertical">
<div class="sidebar bottom-form-shadow flex" data-tab="ticket"> <div class="sidebar bottom-form-shadow flex" data-tab="ticket">
<div class="sidebar-header"> <div class="sidebar-header">
<h2 class="sidebar-header-headline js-headline"> <h2 class="sidebar-header-headline js-headline">
@ -447,15 +448,24 @@ Oliver<br></div>
pending reminder pending reminder
</option> </option>
</select> </select>
<%- @Icon('arrow-down', 'dropdown-arrow') %>
</div><span class="help-inline"></span> <span class="help-block"></span> </div><span class="help-inline"></span> <span class="help-block"></span>
</div> </div>
</div> </div>
<div class="datetime form-group"> <div class="formGroup-bundle">
<div class="date form-group flex">
<div class="formGroup-label"> <div class="formGroup-label">
<label for="Ticket_187247_pending_time">Pending till <span>*</span></label> <label for="Ticket_187247_pending_time">Pending till <span>*</span></label>
</div> </div>
<div class="controls"> <div class="controls">
<input type="text" class="form-control js-datepicker"> <input type="text" value="10/28/2015" class="form-control js-datepicker">
</div>
</div>
<div class="formGroup-bundle-label">at</div>
<div class="datetime form-group">
<div class="controls">
<input type="text" value="08:00" class="form-control time js-timepicker">
</div>
</div> </div>
</div> </div>
<div class="select form-group"> <div class="select form-group">
@ -475,6 +485,7 @@ Oliver<br></div>
3 high 3 high
</option> </option>
</select> </select>
<%- @Icon('arrow-down', 'dropdown-arrow') %>
</div><span class="help-inline"></span> <span class="help-block"></span> </div><span class="help-inline"></span> <span class="help-block"></span>
</div> </div>
</div> </div>
@ -617,8 +628,62 @@ Oliver<br></div>
</div> </div>
</div> </div>
<div class="tabsSidebar-tabs vertical justified"> <div class="tabsSidebar-tabs vertical justified">
<div class="tabsSidebar-tab active" data-tab="ticket"></div> <div class="tabsSidebar-tab active" data-tab="ticket">
<div class="tabsSidebar-tab" data-tab="customer"></div> <%- @Icon('message') %>
<div class="tabsSidebar-tab" data-tab="organization"></div> </div>
<div class="tabsSidebar-tab" data-tab="customer">
<%- @Icon('person') %>
</div>
<div class="tabsSidebar-tab" data-tab="organization">
<%- @Icon('group') %>
</div>
</div>
</div>
<div class="attributeBar">
<form class="form-inline is-closed hide" role="form">
<div class="form-group">
<label for="update_ticket_1_state_id123" class="input-group-addon u-clickable">State</label>
<select id="update_ticket_1_state_id123" class="form-control level-1" name="state_id">
<option value="4">closed</option>
<option value="1" selected="">new</option>
<option value="2">open</option>
<option value="3">pending</option>
</select>
<%- @Icon('arrow-down', 'dropdown-arrow') %>
</div>
<div class="form-group is-changed">
<label for="update_ticket_1_priority_id123" class="input-group-addon u-clickable">Priority</label>
<select id="update_ticket_1_priority_id123" class="form-control" name="priority_id">
<option value="1">1 low</option>
<option value="2" selected="">2 normal</option>
<option value="3">3 high</option>
</select>
<svg class="icon icon-arrow-down dropdown-arrow"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-arrow-down"></use></svg>
</div>
<div class="form-group">
<label for="update_ticket_1_group_id123" class="input-group-addon u-clickable">Group</label>
<select id="update_ticket_1_group_id123" class="form-control" name="group_id">
<option value="4">FillGroup::450863</option>
<option value="3">FillGroup::918672</option>
<option value="2">Twitter</option>
<option value="1" selected="">Users</option>
</select>
<svg class="icon icon-arrow-down dropdown-arrow"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-arrow-down"></use></svg>
</div>
<div class="form-group">
<label for="update_ticket_1_owner_id123" class="input-group-addon u-clickable">Owner</label>
<select id="update_ticket_1_owner_id123" class="form-control" name="owner_id">
<option value="">-</option>
<option value="3">Felix Niklas</option>
</select>
<svg class="icon icon-arrow-down dropdown-arrow"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-arrow-down"></use></svg>
</div>
</form>
<form class="form-inline">
<div class="form-group">
<button type="submit" class="btn btn--primary js-submit pull-right">Update</button>
<button type="submit" class="btn js-reset pull-right hide">Discard your unsaved changes.</button>
</div>
</form>
</div> </div>
</div> </div>

View file

@ -867,7 +867,7 @@ fieldset {
} }
} }
fieldset .form-group { fieldset > .form-group {
padding: 0 4px; padding: 0 4px;
&:last-child { &:last-child {
@ -875,11 +875,6 @@ fieldset .form-group {
} }
} }
fieldset > *:not(.form-group) .form-control {
margin-left: 4px;
margin-right: 4px;
}
.form-group { .form-group {
margin-bottom: 16px; margin-bottom: 16px;
@ -888,7 +883,7 @@ fieldset > *:not(.form-group) .form-control {
} }
} }
.datetime.form-group .controls { .date.form-group .controls {
position: relative; position: relative;
} }
@ -1071,10 +1066,20 @@ fieldset > *:not(.form-group) .form-control {
} }
} }
.fromGroup--standalone .form-control { .formGroup--standalone .form-control {
margin-bottom: 0; margin-bottom: 0;
} }
.formGroup-bundle {
display: flex;
align-items: flex-end;
margin: 0 4px;
.formGroup-bundle-label {
margin: 0 5px 27px 11px;
}
}
input[type="radio"], input[type="radio"],
input[type="checkbox"] { input[type="checkbox"] {
margin: 0; margin: 0;