Make clone button work on new repo page

1c069eb8308b92aa8ddd6233b047714e9e77ed1e

Tucker McKnight <tucker@pangolin.lan> | Tue Dec 09 2025

Make clone button work on new repo page

Also tweak styling of top nav
js_templates/repo.ts:119
Before
118
119
120
121
122
123
                      </div>
                      <div class="row flex-grow-1 align-items-center">
                        <div class="col-md col-fluid py-3">
                          <button class="w-100 btn btn-info btn-lg">Clone</button>
                        </div>
                        <div class="col-md col-fluid py-3">
                          <button class="w-100 btn btn-outline-info shadow-none btn-lg">Setup Instructions</button>
After
118
119
120
121
122
123
                      </div>
                      <div class="row flex-grow-1 align-items-center">
                        <div class="col-md col-fluid py-3">
                          <button class="w-100 btn btn-info btn-lg" id="clone-popover-btn">Clone</button>
                        </div>
                        <div class="col-md col-fluid py-3">
                          <button class="w-100 btn btn-outline-info shadow-none btn-lg">Setup Instructions</button>
js_templates/repo.ts:146
Before
145
146
147



















148
149

          </div>
          <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
        </body>
      </html>
      `
After
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168

          </div>
          <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>

          <script>
            const createClonePopover = () => {
              const div = document.createElement('div')
              div.id = "clone-popover"
              div.innerHTML = "<label class='form-label'>HTTPS URL</label><div class='input-group d-flex flex-nowrap'><span class='clone overflow-hidden input-group-text'>${repo.cloneUrl}</span><button data-clone-url='${repo.cloneUrl}' class='btn btn-primary shadow-none text-white' id='clone-button'>Copy</button></div>"
              const popoverBtn = document.getElementById("clone-popover-btn")
              const bsPopover = new bootstrap.Popover(popoverBtn, {
                sanitize: false,
                html: true,
                content: div,
                title: 'Clone',
                placement: 'bottom',
                container: 'body',
              })
            }

            createClonePopover()
          </script>
        </body>
      </html>
      `
scss/design-board.scss:106
Before
105
106
107

108
109
110
111
112
113
114
}
.nav-item a {
  color: $blue;
⁣
}

.navbar-nav .nav-link.active {
  background-color: $blue;
  color: white;
}

.sample-bullet {
After
105
106
107
108
109
110
111
112
113
114
115
}
.nav-item a {
  color: $blue;
  padding-bottom: 4px;
}

.navbar-nav .nav-link.active {
  color: $blue;
  border-bottom: 2px solid $blue;
}

.sample-bullet {
scss/design-board.scss:139
Before
138
139









.branches, .branches:hover {
  border: 1px solid $body-color;
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
⁣
}
After
138
139
140
141
142
143
144
145
146
147
148
.branches, .branches:hover {
  border: 1px solid $body-color;
}

.dropdown-branches {
  list-style: none;
  padding: 0;
}

.popover {
  max-width: 100%;
}