twitter config mockup

This commit is contained in:
Felix Niklas 2015-11-20 12:03:25 +01:00
parent 7ac0a5c280
commit 34e517262c
6 changed files with 109 additions and 47 deletions

View file

@ -3,6 +3,7 @@ class Index extends App.ControllerContent
'click .js-new': 'new'
'click .js-edit': 'edit'
'click .js-delete': 'delete'
'click .js-create-app': 'createApp'
constructor: ->
super
@ -46,6 +47,18 @@ class Index extends App.ControllerContent
# showDescription: showDescription
# description: description
createApp: ->
modal = new App.ControllerModalNice
head: 'Connect Twitter App'
container: @el.parents('.content')
content: App.view('twitter/app_create')
shown: true
button: 'Connect'
cancel: true
onSubmit: () =>
@html App.view('twitter/list')()
modal.close()
new: (e) ->
# e.preventDefault()
# new App.ControllerGenericNew(

View file

@ -0,0 +1,32 @@
<h2>Create Twitter App</h2>
<p>
The tutorial on how to create a Twitter App is hosted on <a href="http://zammad.org/twitter-app-tutorial" target="_blank">zammad.org/twitter-app-tutorial</a>
</p>
<fieldset>
<div class="input form-group">
<div class="formGroup-label">
<label for="CallbackURL">Callback URL</label>
</div>
<div class="controls">
<input id="CallbackURL" type="text" name="name" class="form-control" value="http://example.com/twitter-app" readonly>
<span class="help-block">You need this callback URL for the Twitter App setup.</span>
</div>
</div>
<h2>Enter your Twitter App Keys</h2>
<div class="input form-group">
<div class="formGroup-label">
<label for="TwitterApiKey">Twitter API Key <span>*</span></label>
</div>
<div class="controls">
<input id="TwitterApiKey" type="text" name="name" class="form-control">
</div>
</div>
<div class="input form-group">
<div class="formGroup-label">
<label for="TwitterApiKeySecret">Twitter API Secret <span>*</span></label>
</div>
<div class="controls">
<input id="TwitterApiKeySecret" type="text" name="name" class="form-control">
</div>
</div>
</fieldset>

View file

@ -2,11 +2,6 @@
<div class="page-header-title">
<h1><%- @T('Twitter') %> <small><%- @T('Accounts') %></small></h1>
</div>
<div class="page-header-meta">
<!--<a class="btn js-config"><%- @T('Configure App') %></a>
<a class="btn btn--success js-new"><%- @T('Add Account') %></a>-->
</div>
</div>
<div class="page-content">
@ -16,46 +11,4 @@
</p>
<div class="btn btn--success js-create-app"><%- @T('Connect Twitter App') %></div>
</div>
<!--<div class="action">
<div class="action-block action-row">
<h2>Zammad Community <span class="text-muted">@zammad_community</span></h2>
</div>
<div class="action-flow action-flow--row">
<div class="action-block">
<h3><%- @T('Search Terms') %></h3>
zammad
</div>
<%- @Icon('arrow-right', 'action-flow-icon') %>
<div class="action-block">
<h3><%- @T('Group') %></h3>
social network
</div>
</div>
<div class="action-flow action-flow--row">
<div class="action-block">
<h3><%- @T('Mentions') %></h3>
@zammad_community
</div>
<%- @Icon('arrow-right', 'action-flow-icon') %>
<div class="action-block">
<h3><%- @T('Group') %></h3>
social network
</div>
</div>
<div class="action-flow action-flow--row">
<div class="action-block">
<h3><%- @T('Direct Messages') %></h3>
@zammad_community
</div>
<%- @Icon('arrow-right', 'action-flow-icon') %>
<div class="action-block">
<h3><%- @T('Group') %></h3>
social network
</div>
</div>
<div class="action-controls">
<div class="sla-toggle btn btn--danger btn--secondary js-delete"><%- @T('Delete') %></div>
<div class="sla-edit btn js-edit"><%- @T('Edit') %></div>
</div>
</div>-->
</div>

View file

@ -0,0 +1,55 @@
<div class="page-header">
<div class="page-header-title">
<h1><%- @T('Twitter') %> <small><%- @T('Accounts') %></small></h1>
</div>
<div class="page-header-meta">
<a class="btn js-config"><%- @T('Configure App') %></a>
<a class="btn btn--success js-new"><%- @T('Add Account') %></a>
</div>
</div>
<div class="page-content">
<div class="action">
<div class="action-block action-row">
<h2><%- @Icon('status', 'supergood-color inline') %> Zammad Community <span class="text-muted">@zammad_community</span></h2>
</div>
<div class="action-flow action-flow--row">
<div class="action-block">
<h3><%- @T('Search Terms') %></h3>
zammad
</div>
<%- @Icon('arrow-right', 'action-flow-icon') %>
<div class="action-block">
<h3><%- @T('Group') %></h3>
social network
</div>
</div>
<div class="action-flow action-flow--row">
<div class="action-block">
<h3><%- @T('Mentions') %></h3>
@zammad_community
</div>
<%- @Icon('arrow-right', 'action-flow-icon') %>
<div class="action-block">
<h3><%- @T('Group') %></h3>
social network
</div>
</div>
<div class="action-flow action-flow--row">
<div class="action-block">
<h3><%- @T('Direct Messages') %></h3>
@zammad_community
</div>
<%- @Icon('arrow-right', 'action-flow-icon') %>
<div class="action-block">
<h3><%- @T('Group') %></h3>
social network
</div>
</div>
<div class="action-controls">
<div class="sla-toggle btn btn--danger btn--secondary js-delete"><%- @T('Delete') %></div>
<div class="sla-edit btn js-edit"><%- @T('Edit') %></div>
</div>
</div>
</div>

View file

@ -1367,6 +1367,15 @@ textarea,
&.form-control--multiline {
height: auto;
}
&[readonly] {
background: hsl(198,10%,95%);
&:focus {
box-shadow: none;
border-color: hsl(0,0%,90%);
}
}
}
input[type=url] {