Change custom cooldown checkbox to icon.

src/General/css/style.css

@@ -1106,8 +1106,9 @@ input[name="Default Volume"] {
   display: none !important;
 }
 #qr select,
-#dump-button,
 #url-button,
+#custom-cooldown-button,
+#dump-button,
 .remove,
 .captcha-img {
   cursor: pointer;
@@ -1162,7 +1163,7 @@ input[name="Default Volume"] {
   -webkit-flex-direction: row;
   flex-direction: row;
 }
-#dump-button {
+#url-button, #custom-cooldown-button, #dump-button {
   width: 10%;
   margin: 0;
   margin-right: 4px;
@@ -1170,13 +1171,8 @@ input[name="Default Volume"] {
   padding: 1px 0px 2px;
   opacity: 0.6;
 }
-#url-button {
+#custom-cooldown-button.disabled {
-  width: 10%;
+  opacity: 0.27;
-  margin: 0;
-  margin-right: 4px;
-  font: 13px sans-serif;
-  padding: 1px 0px 2px;
-  opacity: 0.6;
 }
 .persona .field {
   -webkit-flex: 1;
@@ -1321,10 +1317,7 @@ input#qr-filename:not(.edit) {
 #file-n-submit {
   height: 23px;
 }
-#file-n-submit.custom-cooldown {
+#file-n-submit:not(.custom-cooldown) #custom-cooldown-button {
-    height: 43px;
-}
-#file-n-submit:not(.custom-cooldown) #custom-cooldown-label {
     display: none;
 }
 #qr input[type="file"] {

src/General/html/Features/QuickReply.html

@@ -29,6 +29,7 @@
       <span id=qr-extras-container>
         <a id=qr-filerm href=javascript:; title='Remove file'><i class="fa fa-times-circle"></i></a>
         <a id=url-button title='Post from url'><i class="fa fa-link"></i></a>
+        <a href="javascript:;" id="custom-cooldown-button" title="Toggle custom cooldown" class="disabled"><i class="fa fa-clock-o"></i></a>
         <a id=dump-button title='Dump list'><i class="fa fa-plus-square"></i></a>
       </span>
     </span>
@@ -36,7 +37,6 @@
       <input type=checkbox id=qr-file-spoiler title='Spoiler image'>
     </label>
     <input type=submit>
-    <label id="custom-cooldown-label"><input type=checkbox data-name=customCooldown>Enable Custom Cooldown</label>
   </div>
   <input type=file multiple>
 </form>

src/Posting/QR.coffee

@@ -167,10 +167,9 @@ QR =
       QR.unhide()
 
   toggleCustomCooldown: ->
-    if @checked
+    enabled = $.hasClass @, 'disabled'
-      QR.cooldown.customCooldown = true
+    QR.cooldown.customCooldown = enabled
-    else
+    @classList.toggle 'disabled', !enabled
-      QR.cooldown.customCooldown = false
 
   error: (err) ->
     QR.open()
@@ -491,7 +490,7 @@ QR =
     setNode 'spoilerPar',    '#qr-spoiler-label'
     setNode 'status',        '[type=submit]'
     setNode 'fileInput',     '[type=file]'
-    setNode 'customCooldown', '[data-name=customCooldown]'
+    setNode 'customCooldown', '#custom-cooldown-button'
 
     rules = $('ul.rules').textContent.trim()
     match_min = rules.match(/.+smaller than (\d+)x(\d+).+/)
@@ -529,10 +528,7 @@ QR =
     else
       nodes.spoiler.parentElement.hidden = true
 
-    if parseInt(Conf['customCooldown']) > 0
+    QR.nodes.fileSubmit.classList.toggle 'custom-cooldown', (parseInt(Conf['customCooldown'], 10) > 0)
-      $.addClass QR.nodes.fileSubmit, 'custom-cooldown'
-    else
-      $.rmClass QR.nodes.fileSubmit, 'custom-cooldown'
 
     if g.BOARD.ID is 'f' and g.VIEW isnt 'thread'
       nodes.flashTag = $.el 'select',
@@ -564,8 +560,7 @@ QR =
     $.on nodes.fileExtras, 'click',  (e) -> e.stopPropagation()
     $.on nodes.spoiler,    'change', -> QR.selected.nodes.spoiler.click()
     $.on nodes.fileInput,  'change', QR.handleFiles
-    if parseInt(Conf['customCooldown']) > 0
+    $.on nodes.customCooldown, 'click', QR.toggleCustomCooldown
-      $.on nodes.customCooldown,'change', QR.toggleCustomCooldown
 
     # save selected post's data
     items = ['thread', 'name', 'email', 'sub', 'com', 'filename']