fix more layout issues based on joey's feedback

This commit is contained in:
Sören Brunk 2014-04-30 16:38:37 +02:00
parent 2920554787
commit 58f92f148b
13 changed files with 76 additions and 44 deletions

View file

@ -47,7 +47,7 @@ boxComAForm :: Maybe CredPair -> MkAForm WebDAVInput
boxComAForm defcreds = WebDAVInput boxComAForm defcreds = WebDAVInput
<$> areq textField (bfs "Username or Email") (T.pack . fst <$> defcreds) <$> areq textField (bfs "Username or Email") (T.pack . fst <$> defcreds)
<*> areq passwordField (bfs "Box.com Password") (T.pack . snd <$> defcreds) <*> areq passwordField (bfs "Box.com Password") (T.pack . snd <$> defcreds)
<*> areq checkBoxField (bfs "Share this account with other devices and friends?") (Just True) <*> areq checkBoxField "Share this account with other devices and friends?" (Just True)
<*> areq textField (bfs "Directory") (Just "annex") <*> areq textField (bfs "Directory") (Just "annex")
<*> enableEncryptionField <*> enableEncryptionField

View file

@ -148,7 +148,7 @@ enableEncryptionField = areq (selectFieldList choices) (bfs "Encryption") (Just
{- Defines the layout used by the Bootstrap3 form helper -} {- Defines the layout used by the Bootstrap3 form helper -}
bootstrapFormLayout :: BootstrapFormLayout bootstrapFormLayout :: BootstrapFormLayout
bootstrapFormLayout = BootstrapHorizontalForm (ColSm 0) (ColSm 2) (ColSm 0) (ColSm 5) bootstrapFormLayout = BootstrapHorizontalForm (ColSm 0) (ColSm 2) (ColSm 0) (ColSm 10)
{- Adds the form-control class used by Bootstrap3 for layout to a field {- Adds the form-control class used by Bootstrap3 for layout to a field
- This is the same as Yesod.Form.Bootstrap3.bfs except it takes just a Text - This is the same as Yesod.Form.Bootstrap3.bfs except it takes just a Text

View file

@ -1,3 +1,3 @@
<a title="#{fromMaybe "" tooltip}" class="#{buttonclass}" href="@{route}" onclick="(function( $ ) { $.post('@{route}'); })( jQuery ); return false;"> <a title="#{fromMaybe "" tooltip}" class="#{buttonclass}" href="@{route}" onclick="(function( $ ) { $.post('@{route}'); })( jQuery ); return false;">
<span class="glyphicon #{iconclass}"> # <span class="glyphicon #{iconclass}"> #
#{fromMaybe "" label} \ #{fromMaybe "" label}

View file

@ -4,7 +4,7 @@
Deleting #{reldir} Deleting #{reldir}
<p> <p>
Deleting this repository will remove <tt>#{reldir}</tt> and all its # Deleting this repository will remove <tt>#{reldir}</tt> and all its #
^{actionButton FileBrowserR (Just "files") (Just "Click to open a file browser") "" "icon-folder-open"}. ^{actionButton FileBrowserR (Just "files") (Just "Click to open a file browser") "" "glyphicon-folder-open"}.
$if havegitremotes $if havegitremotes
$if havedataremotes $if havedataremotes
<div .alert> <div .alert>

View file

@ -24,7 +24,8 @@
<div .form-group> <div .form-group>
<div .col-sm-10 .col-sm-offset-2> <div .col-sm-10 .col-sm-offset-2>
<button .btn .btn-primary type=submit> <button .btn .btn-primary type=submit>
Save Changes # Save Changes
\
<a .btn .btn-default href="@{DashboardR}"> <a .btn .btn-default href="@{DashboardR}">
Cancel # Cancel #
$if new $if new

View file

@ -3,9 +3,12 @@
<div .form-group> <div .form-group>
Check ^{fvInput reposView} for # Check ^{fvInput reposView} for #
<div .form-group> <div .form-group>
\
^{fvInput durationView} minutes # ^{fvInput durationView} minutes #
<div .form-group> <div .form-group>
\
^{fvInput recurranceView} # ^{fvInput recurranceView} #
\
starting at ^{fvInput timeView} # starting at ^{fvInput timeView} #
$if new $if new
<button type=submit .btn .btn-primary> <button type=submit .btn .btn-primary>
@ -13,5 +16,6 @@
$else $else
<button type=submit .btn .btn-default> <button type=submit .btn .btn-default>
Save Save
\
<a .btn .btn-default href="@{RemoveActivityR u activity}"> <a .btn .btn-default href="@{RemoveActivityR u activity}">
Remove Remove

View file

@ -11,5 +11,6 @@
<div .col-sm-10 .col-sm-offset-2> <div .col-sm-10 .col-sm-offset-2>
<button .btn .btn-primary type=submit> <button .btn .btn-primary type=submit>
Save Preferences Save Preferences
\
<a .btn .btn-default href="@{ConfigurationR}"> <a .btn .btn-default href="@{ConfigurationR}">
Cancel Cancel

View file

@ -29,6 +29,7 @@
<div .col-sm-10 .col-sm-offset-2> <div .col-sm-10 .col-sm-offset-2>
<button .btn .btn-primary type=submit onclick="$('#workingmodal').modal('show');"> <button .btn .btn-primary type=submit onclick="$('#workingmodal').modal('show');">
Use this account Use this account
\
<a .btn .btn-default href="@{DisconnectXMPPR}"> <a .btn .btn-default href="@{DisconnectXMPPR}">
Stop using this account Stop using this account
<div .modal .fade #workingmodal> <div .modal .fade #workingmodal>

View file

@ -1,21 +1,21 @@
<ul .dropdown-menu> <ul .dropdown-menu>
<li> <li>
<a href="@{NewRepositoryR}"> <a href="@{NewRepositoryR}">
<span .glyphicon .glyphicon-plus-sign> # <span .glyphicon .glyphicon-plus-sign>
Add another local repository \ Add another local repository
<li> <li>
<a href="@{RepositorySwitcherR}"> <a href="@{RepositorySwitcherR}">
<span .glyphicon .glyphicon-folder-close> # <span .glyphicon .glyphicon-folder-close>
Switch repository \ Switch repository
<li> <li>
<a href="@{RestartR}"> <a href="@{RestartR}">
<span .glyphicon .glyphicon-repeat> # <span .glyphicon .glyphicon-repeat>
Restart daemon \ Restart daemon
<li> <li>
<a href="@{ShutdownR}"> <a href="@{ShutdownR}">
<span .glyphicon .glyphicon-off> # <span .glyphicon .glyphicon-off>
Shutdown daemon \ Shutdown daemon
<li> <li>
<a href="@{LogR}"> <a href="@{LogR}">
<span .glyphicon .glyphicon-list> # <span .glyphicon .glyphicon-list>
View log \ View log

View file

@ -1,2 +1,8 @@
.forcewrap .forcewrap
word-wrap: break-word word-wrap: break-word
.small-margin-bottom
margin-bottom: 10px
.small-margin-top
margin-top: 10px
.tiny-margin-bottom
margin-bottom: 4px

View file

@ -5,37 +5,35 @@
$with percent <- maybe "unknown" (showPercentage 0) $ percentComplete transfer info $with percent <- maybe "unknown" (showPercentage 0) $ percentComplete transfer info
<div .row> <div .row>
<div .col-sm-10> <div .col-sm-10>
<div .row> <h3 .forcewrap .small-margin-top .tiny-margin-bottom>
<h3 .forcewrap> $maybe file <- associatedFile info
$maybe file <- associatedFile info #{file}
#{file} $nothing
$nothing #{key2file $ transferKey transfer}
#{key2file $ transferKey transfer} $case transferDirection transfer
$case transferDirection transfer $of Upload
$of Upload &rarr;
&rarr; $of Download
$of Download &larr;
&larr; <small>
<small> <a href="@{EditRepositoryR $ RepoUUID $ transferUUID transfer}">
<a href="@{EditRepositoryR $ RepoUUID $ transferUUID transfer}"> #{maybe "unknown" Remote.name $ transferRemote info}
#{maybe "unknown" Remote.name $ transferRemote info} $with size <- maybe "unknown" (roughSize dataUnits True) $ keySize $ transferKey transfer
$with size <- maybe "unknown" (roughSize dataUnits True) $ keySize $ transferKey transfer $if isJust $ startedTime info
$if isJust $ startedTime info $if isrunning info
$if isrunning info <span .pull-right><b>#{percent} of #{size}</b>
<small .pull-right><b>#{percent} of #{size}</b></small>
$else
<small .pull-right>paused at #{percent} of #{size}</small>
$else $else
<small .pull-right>queued (#{size})</small> <span .pull-right>paused at #{percent} of #{size}
<div .row> $else
<div .progress .progress-striped> <span .pull-right>queued (#{size})
<div .progress-bar style="width: #{percent};"> <div .progress .progress-striped .small-margin-bottom>
<div .btn-group .col-sm-2> <div .progress-bar style="width: #{percent};">
<div .btn-group .col-sm-2 .small-margin-top>
$if isrunning info $if isrunning info
^{actionButton (PauseTransferR transfer) Nothing (Just "pause") "btn" "icon-pause"} ^{actionButton (PauseTransferR transfer) Nothing (Just "pause") "btn btn-default btn-sm" "glyphicon-pause"}
$else $else
^{actionButton (StartTransferR transfer) Nothing (Just "continue") "btn" "icon-play"} ^{actionButton (StartTransferR transfer) Nothing (Just "continue") "btn btn-default btn-sm" "glyphicon-play"}
^{actionButton (CancelTransferR transfer) Nothing (Just "cancel") "btn" "icon-remove"} ^{actionButton (CancelTransferR transfer) Nothing (Just "cancel") "btn btn-default btn-sm" "glyphicon-remove"}
$if scanrunning $if scanrunning
<img src="@{StaticR activityicon_gif}" alt=""> # <img src="@{StaticR activityicon_gif}" alt=""> #
Scanning for files to transfer Scanning for files to transfer

View file

@ -3,3 +3,24 @@ body
padding-bottom: 40px padding-bottom: 40px
.sidebar-nav .sidebar-nav
padding: 9px 0 padding: 9px 0
.icon-white
color: #FFF
.navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus
color: #999
.form-horizontal .form-control
max-width: 300px
display: inline
.form-horizontal input.form-control+span
width: 100%
h1
font-size: 30px
h2
font-size: 24px
h3
font-size: 18px
h4
font-size: 14px
h5
font-size: 12px
h6
font-size: 11px

View file

@ -18,7 +18,7 @@
<ul .nav .navbar-nav .navbar-right> <ul .nav .navbar-nav .navbar-right>
$if hasFileBrowser $if hasFileBrowser
<li> <li>
^{actionButton FileBrowserR (Just "Files") (Just "Click to open a file browser") "" "icon-folder-open icon-white"} ^{actionButton FileBrowserR (Just "Files") (Just "Click to open a file browser") "" "glyphicon-folder-open icon-white"}
<li .dropdown #menu1> <li .dropdown #menu1>
<a .dropdown-toggle data-toggle="dropdown" href="#menu1"> <a .dropdown-toggle data-toggle="dropdown" href="#menu1">
Repository: #{reldir} Repository: #{reldir}