Mercurial Mercurial > comt / changeset
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | raw | zip | gz | bz2 | help
Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
better design for 'add comment' button
authorgibus
Thu, 08 Sep 2011 16:31:16 +0200
changeset 380 b308cc50a49e
parent 379 295b1c9d8f59
child 381 641430ef426c
better design for 'add comment' button
src/cm/media/css/site/text_view_frame.css file | annotate | diff | comparison | revisions
src/cm/templates/site/text_view_comments.html file | annotate | diff | comparison | revisions
src/cm/templates/site/text_view_frame.html file | annotate | diff | comparison | revisions 
--- a/src/cm/media/css/site/text_view_frame.css	Thu Sep 08 15:55:55 2011 +0200
+++ b/src/cm/media/css/site/text_view_frame.css	Thu Sep 08 16:31:16 2011 +0200
@@ -171,20 +171,26 @@
   cursor:pointer;
   padding: 3px 5px;
   background-color: #fece46;
-  -moz-box-shadow: 2px 3px 3px #888;
-  -webkit-box-shadow: 2px 3px 3px #888;
-  box-shadow: 2px 3px 3px #888;
-  -moz-border-radius: 5px;
-  border-radius: 5px;
   color:#050;
   font: bold 70% 'trebuchet ms',helvetica,sans-serif;
-  border: 1px solid;
-  border-color: #696 #363 #363 #696;
   filter:progid:DXImageTransform.Microsoft.Gradient
   (GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffeeddaa');
+  -webkit-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+  -moz-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+  box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25);
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px;
 }
 
 #add_comment_btn:hover {
   color:#030;
 }
 
+#add_comment_btn span:active {
+  position: relative;
+  top: 3px;
+  -webkit-box-shadow: inset 0px -3px 1px rgba(255, 255, 255, 1), inset 0 0px 3px rgba(0, 0, 0, 0.9);
+  -moz-box-shadow: inset 0px -3px 1px rgba(255, 255, 255, 1), inset 0 0px 3px rgba(0, 0, 0, 0.9);
+  box-shadow: inset 0px -3px 1px rgba(255, 255, 255, 1), inset 0 0px 3px rgba(0, 0, 0, 0.9);
+}
--- a/src/cm/templates/site/text_view_comments.html	Thu Sep 08 15:55:55 2011 +0200
+++ b/src/cm/templates/site/text_view_comments.html	Thu Sep 08 16:31:16 2011 +0200
@@ -107,7 +107,7 @@
 <script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/site/c_text_view_comments_to_frame.js"></script>
 <script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/site/c_text_view_comments.js"></script> 
 {% else %}
-<script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/client/c_client-min.js?1315490105"></script> 
+<script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/client/c_client-min.js?1315492251"></script> 
 {% endif %}
 
 
--- a/src/cm/templates/site/text_view_frame.html	Thu Sep 08 15:55:55 2011 +0200
+++ b/src/cm/templates/site/text_view_frame.html	Thu Sep 08 16:31:16 2011 +0200
@@ -36,7 +36,7 @@
     <script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/client/f_printDialog.js"></script>
     <script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/site/f_text_view_frame.js"></script>
 {% else %}
-    <script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/client/f_client-min.js?1315490105"></script> 
+    <script type="text/javascript" src="{{ CM_MEDIA_PREFIX }}js/client/f_client-min.js?1315492251"></script> 
 {% endif %}
     <style type="text/css">
         /*
@@ -60,10 +60,10 @@
 </head>
 <BODY>
 
-    <DIV id="add_comment_btn" class="initially_hidden" title="{% blocktrans %}add a comment{% endblocktrans %}"> 
+    <span style="display: inline-block" id="add_comment_btn" class="initially_hidden" title="{% blocktrans %}add a comment{% endblocktrans %}"> 
     <img style="vertical-align: middle;" src="{{ CM_MEDIA_PREFIX }}img/add_plus.png" alt="{% blocktrans %}add a comment{% endblocktrans %}"/>
     <span>{% blocktrans %}comment{% endblocktrans %}</span>
-    </DIV>
+    </span>
 	<!-- cf.http://layout.jquery-dev.net/download/example.html -->
 	<!-- TODO check height 600 ... -->
 	<DIV id="outer-north" class="ui-layout-north">
comt