Fossil

Check-in [2bc2f7249c]
Login

Check-in [2bc2f7249c]

Many hyperlinks are disabled.
Use anonymous login to enable hyperlinks.

Overview
Comment:Use equal horizontal spacing for normal and "flipped" Copy Buttons (where the latter are positioned after the text to be copied). The idea is for the buttons to be tied to "their" text without spaces in between, resulting in a somewhat narrower spacing to emphasize the connection, but to have normal HTML whitespace on the other side.
Downloads: Tarball | ZIP archive
Timelines: family | ancestors | descendants | both | copybtn.js-responsive
Files: files | file ages | folders
SHA3-256: 2bc2f7249c6469637ab377ad1cdc7b3bc6672b8d1576ff7ef6771f9fbc8c5d74
User & Date: florian 2025-08-12 15:27:00.000
Context
2025-08-15
04:50
Merge the revamped Copy Buttons. ... (check-in: 63712b631c user: florian tags: trunk)
2025-08-12
15:27
Use equal horizontal spacing for normal and "flipped" Copy Buttons (where the latter are positioned after the text to be copied). The idea is for the buttons to be tied to "their" text without spaces in between, resulting in a somewhat narrower spacing to emphasize the connection, but to have normal HTML whitespace on the other side. ... (Closed-Leaf check-in: 2bc2f7249c user: florian tags: copybtn.js-responsive)
15:20
Add some higher-specificity CSS declarations to prevent dark-mode skins from overriding the relevant styles of the Copy Button layout, so users don't need to sync their skin customizations with the changes on this branch. ... (check-in: b7f2c9f329 user: florian tags: copybtn.js-responsive)
Changes
Unified Diff Ignore Whitespace Patch
Changes to src/default.css.
︙︙
1155
1156
1157
1158
1159
1160
1161
1162
1163
1164
1165
1166
1167
1168
1169
1170

  user-select: none;
  cursor: pointer;
}
button.copy-button-flipped,
button.copy-button-flipped:hover,
button.copy-button-flipped:focus,
button.copy-button-flipped:active {
/*Note: .16em is suitable for element grouping.*/
  margin: -2px 0 0 .16em;
}
button.copy-button span {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;








<
|








1155
1156
1157
1158
1159
1160
1161

1162
1163
1164
1165
1166
1167
1168
1169

  user-select: none;
  cursor: pointer;
}
button.copy-button-flipped,
button.copy-button-flipped:hover,
button.copy-button-flipped:focus,
button.copy-button-flipped:active {

  margin: -2px 0 0 .24em;
}
button.copy-button span {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
︙︙
Changes to src/fossil.page.wikiedit.js.
︙︙
1234
1235
1236
1237
1238
1239
1240
1241
1242
1243
1244
1245
1246
1247
1248

          encodeURIComponent(a.filename)
        ].join(''),
        "raw/"+a.src
      ].forEach(function(url){
        const imgUrl = D.append(D.addClass(D.span(), 'monospace'), url);
        const urlCopy = D.button();
        const li = D.li(ul);
        D.append(li, urlCopy, " ", imgUrl);
        F.copyButton(urlCopy, {copyFromElement: imgUrl});
      });
    });
    return this;
  };

  /** Updates the in-tab title/edit status information */








|








1234
1235
1236
1237
1238
1239
1240
1241
1242
1243
1244
1245
1246
1247
1248

          encodeURIComponent(a.filename)
        ].join(''),
        "raw/"+a.src
      ].forEach(function(url){
        const imgUrl = D.append(D.addClass(D.span(), 'monospace'), url);
        const urlCopy = D.button();
        const li = D.li(ul);
        D.append(li, urlCopy, imgUrl);
        F.copyButton(urlCopy, {copyFromElement: imgUrl});
      });
    });
    return this;
  };

  /** Updates the in-tab title/edit status information */
︙︙