forgejo/templates/repo/clone_buttons.tmpl
Gusted 3fbaa79c6e
Don't let repo clone URL overflow (#19517)
- Apparently `<input>` elements differ from other elements have a size
attribute that act as a `min-width` CSS property, this causes a overflow
on mobile. By setting this size to `1` it doesn't try to force a
min-width and nicely shrink down.
2022-04-26 19:22:11 -04:00

24 lines
1.1 KiB
Handlebars

<!-- there is always at least one button (by context/repo.go) -->
{{if $.CloneButtonShowHTTPS}}
<button class="ui basic clone button no-transition" id="repo-clone-https" data-link="{{$.CloneButtonOriginLink.HTTPS}}">
{{if UseHTTPS}}HTTPS{{else}}HTTP{{end}}
</button>
{{end}}
{{if $.CloneButtonShowSSH}}
<button class="ui basic clone button no-transition" id="repo-clone-ssh" data-link="{{$.CloneButtonOriginLink.SSH}}">
SSH
</button>
{{end}}
<!-- the value will be updated by initRepoCloneLink, the code below is used to avoid UI flicking -->
<input id="repo-clone-url" value="" size="1" readonly>
<script>
(() => {
const proto = localStorage.getItem('repo-clone-protocol') || 'https';
const btn = document.getElementById(`repo-clone-${proto}`);
// it's ok if we don't find the btn here, initRepoCloneLink will take care of it
document.getElementById('repo-clone-url').value = btn ? btn.getAttribute('data-link') : '';
})();
</script>
<button class="ui basic icon button tooltip" id="clipboard-btn" data-content="{{.i18n.Tr "copy_url"}}" data-clipboard-target="#repo-clone-url">
{{svg "octicon-paste"}}
</button>