Added styling to file section

This commit is contained in:
Luke Barratt 2014-04-26 21:21:11 +01:00
parent 8014a0eac7
commit cf8f4e89af
4 changed files with 175 additions and 147 deletions

View file

@ -10,3 +10,37 @@
margin: em(20) 0; margin: em(20) 0;
} }
} }
/*
Files List
*/
#files {
.file {
@include span-columns(12);
padding-top: em(20);
margin-bottom: em(20);
position: relative;
border-top: em(3) solid $light-gray;
.actions {
position: absolute;
top: em(20);
right: 0;
}
.comments {
float: right;
i {
margin-right: em(10);
}
}
}
.controls {
@include span-columns(12);
margin-top: em(20);
}
}

View file

@ -1,33 +1,28 @@
<h1>Editing file</h1> <h1>Editing File</h1>
<div class="wide box"> <%= form_for(@file, html: { class: 'square' }) do |f| %>
<%= form_for(@file) do |f| %> <%= render 'shared/errors', messages: @file.errors.full_messages %>
<%= f.error_messages %>
<%= cascade @file, ["name", "size_s", "md5_s"] %> <%= cascade @file, ["name", "size_s", "md5_s"] %>
<p> <div class="fields horizontal">
<%= f.label :description %><br /> <%= f.label :description %>
<%= f.text_field :description %> <%= f.text_field :description %>
</p>
<p>
<%= f.label :directory_id %><br />
<%= f.select :directory_id, Directory.all.collect{|c| ["#{c.path} - #{c.name}", c.id]} %>
</p>
<p>
<%= f.submit 'Update' %>
</p>
<% end %>
</div> </div>
<div class="wide box"> <div class="fields horizontal">
<h3> <%= f.label :directory_id %>
Related Files <%= f.select :directory_id, Directory.all.collect { |c| ["#{c.path} - #{c.name}", c.id] } %>
</h3> </div>
<table class="data"> <div class="controls">
<%= f.submit 'Update' %>
</div>
<% end %>
<h3>Related Files</h3>
<table class="striped">
<tr> <tr>
<th>Name</th> <th>Name</th>
<th>Size</th> <th>Size</th>
@ -42,18 +37,17 @@
<%= related.size_s %> MB <%= related.size_s %> MB
</td> </td>
<td> <td>
<%= link_to "Remove", :controller => "data_files", :action => "delFile", :id => @file, "related_id" => related %> <%= link_to "Remove", controller: "data_files", action: "delFile", id: @file, "related_id" => related %>
</td> </td>
</tr> </tr>
<% end %> <% end %>
</table> </table>
<%= form_for @file, :url => {:action => "addFile", :id => @file} do |f| %> <%= form_for @file, url: { action: "addFile", id: @file } do |f| %>
<p> <div class="fields">
<%= f.select :related_id, @file.directory.files.not(@file).collect {|file| [file, file.id]} %> <%= f.select :related_id, @file.directory.files.not(@file).collect {|file| [file, file.id]} %>
<%= f.submit "Add" %>
</p>
<% end %>
</div> </div>
<div class="controls">
<%= link_to 'Show', @file %> <%= f.submit "Add" %>
</div>
<% end %>

View file

@ -1,26 +1,24 @@
<h1>New file</h1> <h1 class="title">New File</h1>
<div class="wide box"> <%= form_for @file, html: { multipart: true, class: 'square' } do |f| %>
<%= form_for @file, :html => { :multipart => true } do |f| %> <%= render 'shared/errors', messages: @file.errors.full_messages %>
<%= f.error_messages %>
<p> <div class="fields horizontal">
<%= f.label :name %><br /> <%= f.label :name %>
<%= f.file_field :name %> <%= f.file_field :name %>
</p>
<p>
<%= f.label :description %><br />
<%= f.text_field :description %>
</p>
<p>
<%= f.label :directory_id %><br />
<%= f.select :directory_id, Directory.all.collect{|c| ["#{c.path} - #{c.name}", c.id]} %>
</p>
<p>
<%= f.submit 'Create' %>
</p>
<% end %>
</div> </div>
<div class="fields horizontal">
<%= f.label :description %>
<%= f.text_field :description %>
</div>
<div class="fields horizontal">
<%= f.label :directory_id %>
<%= f.select :directory_id, Directory.all.collect{|c| ["#{c.path} - #{c.name}", c.id]} %>
</div>
<div class="controls">
<%= f.submit 'Create File' %>
</div>
<% end %>

View file

@ -1,17 +1,21 @@
<h1>Files</h1> <h1 class="title">Files</h1>
<% active = 1; n = 1; %> <%
active = 1
n = 1
%>
<div id="filesTab"> <div id="files" class="tabbed">
<ul id="filesTab-nav" class="tabs"> <ul id="files-nav" class="tabs">
<% @directories.each do |dir| %> <% @directories.each do |dir| %>
<li><a href="#dir_<%= dir.id %>"><%= h dir.name %></a></li> <li><a href="#dir_<%= dir.id %>"><%= h dir.name %></a></li>
<% end %> <% end %>
</ul> </ul>
<div class="tabs"> <div class="tabbed-contents">
<% @directories.each do |dir| %> <% @directories.each do |dir| %>
<div class="box wide tab" id="dir_<%= dir.id %>"> <div class="tab" id="dir_<%= dir.id %>">
<% <%
if @directory.path.include?(dir.path) if @directory.path.include?(dir.path)
dir = @directory dir = @directory
@ -20,54 +24,49 @@
n = n + 1 n = n + 1
%> %>
<div class="directories">
<% if !dir.subdirs.ordered.empty? or dir.parent.id != Directory::ROOT %> <% if !dir.subdirs.ordered.empty? or dir.parent.id != Directory::ROOT %>
<h3> <h3>Directories</h3>
Directories
</h3>
<% end %> <% end %>
<div class="subdirectories">
<ul class="disc">
<% if dir.parent.id != Directory::ROOT %> <% if dir.parent.id != Directory::ROOT %>
<div class="box sub wide"> <li class="parent">
<h3>
<%= link_to "Parent", dir.parent %> <%= link_to "Parent", dir.parent %>
</h3> </li>
</div>
<% end %> <% end %>
<% dir.subdirs.ordered.each do |subdir| %> <% dir.subdirs.ordered.each do |subdir| %>
<div class="box sub wide"> <li><%= namelink subdir %></li>
<h3>
<%= namelink subdir %>
</h3>
</div>
<% end %> <% end %>
</ul>
</div>
</div>
<div></div> <h3>Files</h3>
<h3>
Files
</h3>
<% dir.files.unrelated.each do |file| %> <% dir.files.unrelated.each do |file| %>
<div class="box sub wide"> <div class="file">
<div class="left"> <div class="actions">
<h3>
<%= namelink file %>
</h3>
<p>
<b>Size: </b> <%= file.size_s %> MB, <b>Comments: </b> <%= file.comments.count %> <br />
<b>MD5: </b> <%= file.md5_s %><br />
</p>
<%= link_to "Direct Download", file.url, :class => "green" %>
<% if file.can_update? cuser %> <% if file.can_update? cuser %>
[ <%= link_to 'Edit', edit_data_file_path(file) %> ] <%= link_to icon('pencil'), edit_data_file_path(file) %>
<% end; if file.can_destroy? cuser %> <% end %>
[ <%= link_to 'Destroy', file, :confirm => 'Are you sure?', :method => :delete %> ]
<% if file.can_destroy? cuser %>
<%= link_to icon('times'), file, confirm: 'Are you sure?', method: :delete %>
<% end %> <% end %>
</div> </div>
<div class="clear"></div>
<h4><%= namelink file %></h4>
<p><strong>Size:</strong> <%= file.size_s %>MB</p>
<div class="comments">
<%= link_to file do %>
<%= icon('comments') %> Comments (<%= file.comments.count %>)
<% end %>
</div>
<%= link_to 'Download', file.url, class: 'button tiny' %>
</div> </div>
<% end %> <% end %>
@ -76,12 +75,12 @@
<% end %> <% end %>
<% if cuser and cuser.admin? %> <% if cuser and cuser.admin? %>
<p> <div class="controls">
<%= link_to "Edit Directory", edit_directory_path(dir) %> | <%= link_to "Edit Directory", edit_directory_path(dir), class: 'button' %>
<%= link_to "Delete Directory", dir, :confirm => "Are you REALLY sure?", :method => :delete %> | <%= link_to "Delete Directory", dir, confirm: "Are you REALLY sure?", method: :delete, class: 'button' %>
<%= link_to "New Directory", :controller => "directories", :action => "new", :id => dir %> | <%= link_to "New Directory", { controller: "directories", action: "new", id: dir }, { class: 'button' } %>
<%= link_to "New File", :controller => "data_files", :action => "new", :id => dir %> <%= link_to "New File", { controller: "data_files", action: "new", id: dir }, { class: 'button' } %>
</p> </div>
<% end %> <% end %>
</div> </div>
<% end %> <% end %>
@ -89,5 +88,8 @@
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var tabber1 = new Yetii({ id: 'filesTab', active: <%= active %>}); new Yetii({
id: 'files',
active: <%= active %>
});
</script> </script>