From 80989b7cf014c6230721aa840659e0fc7a9a0f25 Mon Sep 17 00:00:00 2001
From: skewed <none@none>
Date: Thu, 14 Jan 2010 23:24:10 +0000
Subject: [PATCH] Cleaned up markup and CSS for inline admin action buttons

--HG--
extra : convert_revision : svn%3A5ff7c347-ad56-4c35-b696-ccb81de16e03/trunk%4045431
---
 .../Parts/Common.Routable.ascx                |  2 +-
 src/Orchard.Web/Core/Themes/Styles/site.css   |  2 +-
 .../Items/Blogs.Blog.DetailAdmin.ascx         |  6 +-
 .../Items/Blogs.Blog.SummaryAdmin.ascx        | 14 ++--
 .../Items/Blogs.BlogPost.SummaryAdmin.ascx    | 10 +--
 .../Themes/TheAdmin/Styles/site.css           | 83 +++++++++++--------
 6 files changed, 66 insertions(+), 51 deletions(-)

diff --git a/src/Orchard.Web/Core/Common/Views/EditorTemplates/Parts/Common.Routable.ascx b/src/Orchard.Web/Core/Common/Views/EditorTemplates/Parts/Common.Routable.ascx
index 6768ea2ba..9591042c7 100644
--- a/src/Orchard.Web/Core/Common/Views/EditorTemplates/Parts/Common.Routable.ascx
+++ b/src/Orchard.Web/Core/Common/Views/EditorTemplates/Parts/Common.Routable.ascx
@@ -3,7 +3,7 @@
 <% Html.RegisterFootScript("jquery.slugify.js"); %>
 <fieldset>
     <%=Html.LabelFor(m => m.Title) %>
-    <%=Html.EditorFor(m => m.Title) %>
+    <%=Html.TextBoxFor(m => m.Title, new { @class = "large text" }) %>
 </fieldset>
 <fieldset class="permalink">
     <label class="sub" for="Slug"><%=_Encoded("Permalink")%><br /><span>[todo: (heskew) need path to here]/</span></label>
diff --git a/src/Orchard.Web/Core/Themes/Styles/site.css b/src/Orchard.Web/Core/Themes/Styles/site.css
index 2452207c5..3035d04fa 100644
--- a/src/Orchard.Web/Core/Themes/Styles/site.css
+++ b/src/Orchard.Web/Core/Themes/Styles/site.css
@@ -82,7 +82,7 @@ first child of the left and right table columns */
 
 /* you can specify a greater or lesser percentage for the 
 page width. Or, you can specify an exact pixel width. */
-.page
+#page
 {
     width: 90%;
     margin-left: auto;
diff --git a/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.DetailAdmin.ascx b/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.DetailAdmin.ascx
index d78599f98..c50fd6b1f 100644
--- a/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.DetailAdmin.ascx
+++ b/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.DetailAdmin.ascx
@@ -7,12 +7,12 @@
 </h1>
 <ul class="actions">
     <li class="construct">
-        <a href="<%=Url.BlogEdit(Model.Item.Slug) %>" class="ibutton edit"><%=_Encoded("Edit Blog") %></a>
+        <a href="<%=Url.BlogEdit(Model.Item.Slug) %>" class="ibutton edit" title="<%=_Encoded("Edit Blog") %>"></a>
     </li>
     <li class="destruct">
-        <% using (Html.BeginFormAntiForgeryPost(Url.BlogDelete(Model.Item.Slug))) { %>
+        <% using (Html.BeginFormAntiForgeryPost(Url.BlogDelete(Model.Item.Slug), FormMethod.Post, new { @class = "inline" })) { %>
             <fieldset>
-                <input type="image" src="<%=Html.ThemePath("/styles/images/remove.png") %>" alt="<%=_Encoded("Remove Blog") %>" title="<%=_Encoded("Remove Blog") %>" class="ibutton image remove" />
+                <button type="submit" src="<%=Html.ThemePath("/styles/images/remove.png") %>" class="ibutton remove" title="<%=_Encoded("Remove Blog") %>"><%=_Encoded("Remove Blog") %></button>
             </fieldset><%
         } %>
     </li>
diff --git a/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.SummaryAdmin.ascx b/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.SummaryAdmin.ascx
index 2d82764d7..4d9484998 100644
--- a/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.SummaryAdmin.ascx
+++ b/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.Blog.SummaryAdmin.ascx
@@ -10,17 +10,17 @@
 <%--<p>[list of authors] [modify blog access]</p>--%>
 <p><%=Html.Encode(Model.Item.Description) %></p>
 <ul class="actions">
-    <%-- todo: (heskew) make into a ul --%>
     <li class="construct">
-        <a href="<%=Url.BlogForAdmin(Model.Item.Slug) %>" class="ibutton blog"><%=_Encoded("Manage Blog") %></a>
-        <a href="<%=Url.BlogEdit(Model.Item.Slug) %>" class="ibutton edit"><%=_Encoded("Edit Blog")%></a>
-        <a href="<%=Url.Blog(Model.Item.Slug) %>" class="ibutton view"><%=_Encoded("View Blog")%></a>
-        <a href="<%=Url.BlogPostCreate(Model.Item.Slug) %>" class="ibutton add page"><%=_Encoded("New Post")%></a>
+        <a href="<%=Url.BlogForAdmin(Model.Item.Slug) %>" class="ibutton blog" title="<%=_Encoded("Manage Blog") %>"><%=_Encoded("Manage Blog") %></a>
+        <a href="<%=Url.BlogEdit(Model.Item.Slug) %>" class="ibutton edit" title="<%=_Encoded("Edit Blog") %>"><%=_Encoded("Edit Blog") %></a>
+        <a href="<%=Url.Blog(Model.Item.Slug) %>" class="ibutton view" title="<%=_Encoded("View Blog") %>"><%=_Encoded("View Blog") %></a>
+        <a href="<%=Url.BlogPostCreate(Model.Item.Slug) %>" class="ibutton add page" title="<%=_Encoded("New Post") %>"><%=_Encoded("New Post") %></a>
     </li>
     <li class="destruct">
-        <% using (Html.BeginFormAntiForgeryPost(Url.BlogDelete(Model.Item.Slug))) { %>
+        <%-- todo: (heskew) this is waaaaa too verbose. need template helpers for all ibuttons --%>
+        <% using (Html.BeginFormAntiForgeryPost(Url.BlogDelete(Model.Item.Slug), FormMethod.Post, new { @class = "inline" })) { %>
             <fieldset>
-                <input type="image" src="<%=Html.ThemePath("/styles/images/remove.png") %>" alt="<%=_Encoded("Remove Blog") %>" title="<%=_Encoded("Remove Blog") %>" class="ibutton image remove" />
+                <button type="submit" src="<%=Html.ThemePath("/styles/images/remove.png") %>" class="ibutton remove" title="<%=_Encoded("Remove Blog") %>"><%=_Encoded("Remove Blog") %></button>
             </fieldset><%
         } %>
     </li>
diff --git a/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.BlogPost.SummaryAdmin.ascx b/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.BlogPost.SummaryAdmin.ascx
index dd67b068d..4939a5fdb 100644
--- a/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.BlogPost.SummaryAdmin.ascx
+++ b/src/Orchard.Web/Packages/Orchard.Blogs/Views/DisplayTemplates/Items/Blogs.BlogPost.SummaryAdmin.ascx
@@ -11,16 +11,16 @@
 <div class="content"><%=Model.Item.As<BodyAspect>().Text ?? string.Format("<p><em>{0}</em></p>", _Encoded("there's no content for this blog post"))%></div>
 <ul class="actions">
     <li class="construct">
-        <a href="<%=Url.BlogPostEdit(Model.Item.Blog.Slug, Model.Item.Slug) %>" class="ibutton edit"><%=_Encoded("Edit Post")%></a>
-        <a href="<%=Url.BlogPost(Model.Item.Blog.Slug, Model.Item.Slug) %>" class="ibutton view"><%=_Encoded("View Post")%></a><%
+        <a href="<%=Url.BlogPostEdit(Model.Item.Blog.Slug, Model.Item.Slug) %>" class="ibutton edit" title="<%=_Encoded("Edit Post")%>"><%=_Encoded("Edit Post")%></a>
+        <a href="<%=Url.BlogPost(Model.Item.Blog.Slug, Model.Item.Slug) %>" class="ibutton view" title="<%=_Encoded("View Post")%>"><%=_Encoded("View Post")%></a><%
         if (Model.Item.Published == null) { // todo: (heskew) be smart about this and maybe have other contextual actions - including view/preview for view up there ^^ %>
-        <a href="<%=Url.BlogPost(Model.Item.Blog.Slug, Model.Item.Slug) %>" class="ibutton publish"><%=_Encoded("Publish Post Now")%></a>
+        <a href="<%=Url.BlogPost(Model.Item.Blog.Slug, Model.Item.Slug) %>" class="ibutton publish" title="<%=_Encoded("Publish Post Now")%>"><%=_Encoded("Publish Post Now")%></a>
         <% } %>
     </li>
     <li class="destruct">
-        <% using (Html.BeginFormAntiForgeryPost(Url.BlogPostDelete(Model.Item.Blog.Slug, Model.Item.Slug))) { %>
+        <% using (Html.BeginFormAntiForgeryPost(Url.BlogPostDelete(Model.Item.Blog.Slug, Model.Item.Slug), FormMethod.Post, new { @class = "inline" })) { %>
             <fieldset>
-                <input type="image" src="<%=Html.ThemePath("/styles/images/remove.png") %>" alt="<%=_Encoded("Remove Post") %>" title="<%=_Encoded("Remove Post") %>" class="ibutton image remove" />
+                <button type="submit" src="<%=Html.ThemePath("/styles/images/remove.png") %>" class="ibutton remove" title="<%=_Encoded("Remove Post") %>"><%=_Encoded("Remove Post") %></button>
             </fieldset><%
         } %>
     </li>
diff --git a/src/Orchard.Web/Themes/TheAdmin/Styles/site.css b/src/Orchard.Web/Themes/TheAdmin/Styles/site.css
index b17f6d9b1..2ebfbc007 100644
--- a/src/Orchard.Web/Themes/TheAdmin/Styles/site.css
+++ b/src/Orchard.Web/Themes/TheAdmin/Styles/site.css
@@ -284,6 +284,9 @@ a:hover, a:active, a:focus {
 #main form {
     margin:.345em 0 1.5em;
 }
+#main form.inline {
+    margin:0;
+}
 #main h1 {
     border-bottom:1px dashed #e4e7dc;
 }
@@ -340,6 +343,9 @@ span.message {
 
 /* Forms   
 ----------------------------------------------------------*/
+form.inline fieldset {
+    margin:0;
+}
 fieldset.bulk.actions {
     display:inline;
     height:auto;
@@ -480,6 +486,11 @@ button.remove:focus::-moz-focus-inner, .remove.button:focus::-moz-focus-inner {
     padding:.6em 0 .1em;
     text-align:right;
 }
+.contentItems .actions li {
+    background:inherit;
+    border:0;
+    padding:0;
+}
 .actions .construct {
     float:left;
 }
@@ -497,9 +508,10 @@ button.remove:focus::-moz-focus-inner, .remove.button:focus::-moz-focus-inner {
 
 /* Icon buttons
 ----------------------------------------------------------*/
-a.ibutton, a.ibutton:link, a.ibutton:visited {
+.ibutton, .ibutton:link, .ibutton:visited,
+button.ibutton, button.ibutton:hover, button.ibutton:focus, button.ibutton:active {
     background:url(images/icons.png) 0 -20px;
-    border:none;
+    border:0;
     display:inline;
     float:left;
     height:17px;
@@ -507,31 +519,34 @@ a.ibutton, a.ibutton:link, a.ibutton:visited {
     padding:0 0 0 17px;
     width:0;
 }
-a.ibutton:hover, a.ibutton:active, a.ibutton:focus { background-position:0 0; }
-a.ibutton.remove,
-a.ibutton.remove:link,
-a.ibutton.remove:visited { background-position:-20px -20px; }
-a.ibutton.remove:hover, a.ibutton.remove:active, a.ibutton.remove:focus { background-position:-20px 0; }
-a.ibutton.view,
-a.ibutton.view:link,
-a.ibutton.view:visited { background-position:-40px -20px; }
-a.ibutton.view:hover, a.ibutton.view:active, a.ibutton.view:focus { background-position:-40px 0; }
-a.ibutton.add.page,
-a.ibutton.add.page:link,
-a.ibutton.add.page:visited { background-position:-60px -20px; }
-a.ibutton.add.page:hover, a.ibutton.add.page:active, a.ibutton.add.page:focus { background-position:-60px 0; }
-a.ibutton.edit,
-a.ibutton.edit:link,
-a.ibutton.edit:visited { background-position:-80px -20px; }
-a.ibutton.edit:hover, a.ibutton.edit:active, a.ibutton.edit:focus { background-position:-80px 0; }
-a.ibutton.publish,
-a.ibutton.publish:link,
-a.ibutton.publish:visited { background-position:-100px -20px; }
-a.ibutton.publish:hover, a.ibutton.publish:active, a.ibutton.publish:focus { background-position:-100px 0; }
-a.ibutton.blog,
-a.ibutton.blog:link,
-a.ibutton.blog:visited { background-position:-120px -20px; }
-a.ibutton.blog:hover, a.ibutton.blog:active, a.ibutton.blog:focus { background-position:-120px 0; }
+button.ibutton {
+    text-indent:-9999em;
+}
+.ibutton:hover, .ibutton:active, .ibutton:focus { background-position:0 0; }
+.ibutton.remove,
+.ibutton.remove:link,
+.ibutton.remove:visited { background-position:-20px -20px; }
+.ibutton.remove:hover, .ibutton.remove:active, .ibutton.remove:focus { background-position:-20px 0; }
+.ibutton.view,
+.ibutton.view:link,
+.ibutton.view:visited { background-position:-40px -20px; }
+.ibutton.view:hover, .ibutton.view:active, .ibutton.view:focus { background-position:-40px 0; }
+.ibutton.add.page,
+.ibutton.add.page:link,
+.ibutton.add.page:visited { background-position:-60px -20px; }
+.ibutton.add.page:hover, .ibutton.add.page:active, .ibutton.add.page:focus { background-position:-60px 0; }
+.ibutton.edit,
+.ibutton.edit:link,
+.ibutton.edit:visited { background-position:-80px -20px; }
+.ibutton.edit:hover, .ibutton.edit:active, .ibutton.edit:focus { background-position:-80px 0; }
+.ibutton.publish,
+.ibutton.publish:link,
+.ibutton.publish:visited { background-position:-100px -20px; }
+.ibutton.publish:hover, .ibutton.publish:active, .ibutton.publish:focus { background-position:-100px 0; }
+.ibutton.blog,
+.ibutton.blog:link,
+.ibutton.blog:visited { background-position:-120px -20px; }
+.ibutton.blog:hover, .ibutton.blog:active, .ibutton.blog:focus { background-position:-120px 0; }
 
 
 /* todo: (heskew) needs attention */
@@ -581,13 +596,13 @@ a.ibutton.blog:hover, a.ibutton.blog:active, a.ibutton.blog:focus { background-p
     margin-right:0;
 }
 #main .contentItems li:hover { background:#fafbed; }
-#main .contentItems li:hover a.ibutton { background-position:0 0; }
-#main .contentItems li:hover a.ibutton.remove { background-position:-20px 0; }
-#main .contentItems li:hover a.ibutton.view { background-position:-40px 0; }
-#main .contentItems li:hover a.ibutton.add.page { background-position:-60px 0; }
-#main .contentItems li:hover a.ibutton.edit { background-position:-80px 0; }
-#main .contentItems li:hover a.ibutton.publish { background-position:-100px 0; }
-#main .contentItems li:hover a.ibutton.blog { background-position:-120px 0; }
+#main .contentItems li:hover .ibutton { background-position:0 0; }
+#main .contentItems li:hover .ibutton.remove { background-position:-20px 0; }
+#main .contentItems li:hover .ibutton.view { background-position:-40px 0; }
+#main .contentItems li:hover .ibutton.add.page { background-position:-60px 0; }
+#main .contentItems li:hover .ibutton.edit { background-position:-80px 0; }
+#main .contentItems li:hover .ibutton.publish { background-position:-100px 0; }
+#main .contentItems li:hover .ibutton.blog { background-position:-120px 0; }
 
 
 /* (Items) Tables