colibris: add style for ep_embedded_hyperlink plugin

src/static/skins/colibris/pad.css

@@ -17,6 +17,7 @@
 @import url("src/plugins/font_color.css");
 @import url("src/plugins/set_title_on_pad.css");
 @import url("src/plugins/tables2.css");
+@import url("src/plugins/embedded_hyperlinks.css");
 
 /* NEUTRAL COLOR */
 body,
@@ -47,7 +48,8 @@ body,
 .comment-changeFrom-value,
 .comment-changeTo-value,
 .reply-suggestion .reply-comment-suggest-from,
-.suggestion .comment-suggest-from
+.suggestion .comment-suggest-from,
+.hyperlink-dialog>.hyperlink-url
 { color: #495057 !important; }
 
 /* MENUS ICONS */
@@ -61,6 +63,9 @@ body,
 #tbl_btn_close,
 #save_title button,
 #yui-picker-panel .button-group .yui-button:last-child button,
+#newComment.sidebar-comment input[type=submit],
+.comment-changeTo-approve input[type=submit],
+.hyperlink-dialog>.hyperlink-save
 { 
   background-color: #64d29b; 
   color: white;
@@ -92,5 +97,6 @@ h1,
 .reply-suggestion p:not(.reply-comment-suggest-from-p),
 p[data-l10n-id="ep_comments_page.comment"],
 #newComment.sidebar-comment input[type=submit],
-.comment-changeTo-approve input[type=submit]
+.comment-changeTo-approve input[type=submit],
+.hyperlink-dialog>.hyperlink-save
 { font-family: OpenDyslexic, Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif !important;  }

src/static/skins/colibris/pad.js

@@ -1,4 +1,16 @@
 function customStart()
 {
   $('#pad_title').show();
+
+  $('.hyperlink-icon').on('click',function() {
+    $('.hyperlink-dialog').appendTo('body').css({'top': $('.hyperlink-icon').offset().top + 42, 'left': $('.hyperlink-icon').offset().left - 12});
+  });
+  $('.hyperlink-url').on("keyup", function(e)
+  {
+    if(e.keyCode == 13) // touche entrée
+    { 
+      $('.hyperlink-save').click();
+    }
+  });
+  $('.hyperlink-save').click(function() { $('.hyperlink-dialog').hide(); });
 }

src/static/skins/colibris/src/components/buttons.css

@@ -1,4 +1,5 @@
-.btn, #mycolorpickercancel, #mycolorpickersave, #save_title button, #yui-picker-panel .button-group .yui-button button{
+.btn, #mycolorpickercancel, #mycolorpickersave, #save_title button, #yui-picker-panel .button-group .yui-button button, .hyperlink-dialog>.hyperlink-save
+{
   margin-right: 10px;
   padding: 5px 20px;
   border-radius: 4px;
@@ -14,6 +15,6 @@
   left: 0;
 }
 
-.btn:hover, #mycolorpickercancel:hover, #mycolorpickersave:hover, #save_title button:hover {
+.btn:hover, #mycolorpickercancel:hover, #mycolorpickersave:hover, #save_title button:hover, .hyperlink-dialog>.hyperlink-save:hover {
   cursor: pointer;
 }

src/static/skins/colibris/src/components/form.css

@@ -1,4 +1,4 @@
-#input_title, #chatinput {
+#input_title, #chatinput, .hyperlink-dialog>.hyperlink-url {
   border: 1px solid #d2d2d2;
   height: 18px;
   border-radius: 3px;

src/static/skins/colibris/src/components/popup.css

@@ -1,6 +1,7 @@
 #users,
 #mycolorpicker,
-.popup {
+.popup,
+.hyperlink-dialog {
   border-radius: 3px;
   padding: 20px 20px;
   background: none;

src/static/skins/colibris/src/components/toolbar.css

@@ -94,6 +94,7 @@
     background-color: transparent;
     border: none !important;
     padding: 0 !important;
+    overflow-x: visible;
   }
   .toolbar ul.menu_left {
     padding-top: 2px !important;

src/static/skins/colibris/src/plugins/embedded_hyperlinks.css

@@ -0,0 +1,32 @@
+.hyperlink-icon > a > .buttonicon:before{
+  content:"\E83A";
+  top: 0px !important;
+  position: relative;
+}
+.hyperlink-dialog {
+  position: absolute;
+  top: 0;
+  z-index: 20;
+  list-style: none;
+
+}
+
+.hyperlink-dialog>.hyperlink-save{
+  height: 34px;
+  margin-top: 1px;
+  margin-right: 0;
+  margin-left: 2px;
+  color: transparent !important;
+  width: 50px;
+  overflow: hidden;
+}
+
+.hyperlink-dialog>.hyperlink-save:after{
+  content: "Ok";
+  color: white;
+  position: absolute;
+  top: 0;
+  left: 0;
+  padding: 8px 0;
+  width: 50px;
+}