neocgit

a more 'modern' version of cgit
Log | Files | Refs | Submodules | README | LICENSE | git clone https://git.ne02ptzero.me/git/neocgit

commit caa714c1800a5020ffb15c24365537ff561a1c92
parent ec5e64da4240995f589f7de91b77bf7a1b2914a8
Author: Ne02ptzero <louis@ne02ptzero.me>
Date:   Wed,  4 Jul 2018 16:03:12 +0200

FIX: Repo-url style, now pixel perfect

Signed-off-by: Ne02ptzero <louis@ne02ptzero.me>

Diffstat:
Mcgit.css | 65++++++++++++++++++++++++++++++++++++++++-------------------------
Mui-shared.c | 54++++++++++++++++++++++++++++--------------------------
2 files changed, 68 insertions(+), 51 deletions(-)

diff --git a/cgit.css b/cgit.css @@ -34,6 +34,15 @@ div#cgit table { font-size: 14px; } +select:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 #000; +} + +option:not(:checked) { + color: black; /* prevent <option>s from becoming transparent as well */ +} + .hidden { display: none; } @@ -233,17 +242,20 @@ div#cgit table { font-size: 1rem; } -.summary-header input { - width: 250px; - text-align: center; +.summary-header .repo-url-container { border: 1px solid #e5e5e5; - padding: 6px 15px; - font-size: 14px; - margin-left: -5px; + width: auto; + margin-left: auto; + margin-right: auto; + display: inline-block; + border-radius: 3px; + padding: 0; + overflow: hidden; + height: 28px; } .summary-header .repo-url { - display: inline-block; + display: inline; list-style: none; padding: 0; margin: 0; @@ -253,41 +265,44 @@ div#cgit table { .summary-header .repo-url li { display: inline-block; margin: 0; + height: 100%; } -.summary-header .repo-url li select { - background: #FFFFFF; - border: 1px solid #e5e5e5; - width: 100%; - padding: 5px 14px 5px 10px; - border-radius: 3px; - border-bottom-right-radius: 0; - border-top-right-radius: 0; +.summary-header .repo-url input { + width: 250px; + text-align: center; + padding: 6px 15px; + font-size: 14px; + line-height: 1em; + border: 0; +} + +.summary-header .repo-url .select select { + background: transparent; + border: 0; -moz-appearance: none; /* Firefox */ -webkit-appearance: none; /* Safari and Chrome */ appearance: none; text-align: left; font-size: 14px; + padding: 0px 25px 0 10px; } .summary-header .repo-url .select-arrow { - padding-top: 7px; - position: absolute; - margin-left: -20px; + margin-left: -25px; + padding-right: 10px; + padding: 6px 10px 6px 0; + border-right: 1px solid #e5e5e5; } .summary-header .repo-url li .copy { text-align: center; - border: 1px solid #e5e5e5; - border-radius: 3px; - padding: 5px 15px 5px; - border-bottom-left-radius: 0; - border-top-left-radius: 0; + padding: 6px 15px 6px; color: #7e7c7c !important; - margin: 0; - margin-left: -5px; + vertical-align: middle; transition-duration: 0.3s; transition-property: all; + border-left: 1px solid #e5e5e5; } .summary-header .repo-url li .copy:hover { diff --git a/ui-shared.c b/ui-shared.c @@ -854,32 +854,34 @@ static void add_clone_urls(void (*fn)(const char *), char *txt, char *suffix) strbuf_addf(url_list[i], "/%s", suffix); } - _html("<ul class='repo-url'>") { - _html("<li>") { - _html("<select>") { - for (i = 0; url_list[i] != NULL; i++) - htmlf("<option " - "onclick=\"document.getElementById('clone-url-value')" - ".value='%s'\">%s</option>", - url_list[i]->buf, get_clone_type(url_list[i]->buf)); - } _html("</select>"); - } _html("</li>"); - html("<li class='select-arrow'><i class='fa fa-caret-down'></i></li>"); - - _html("<li>") { - htmlf("<input onclick='this.select()', type='text' " - "class='input-copy' id='clone-url-value' value='%s' readonly />", - url_list[0]->buf); - } _html("</li>"); - - _html("<li>") { - html("<span class='copy' " - "onclick=\"document.getElementById('clone-url-value').select();" - "document.execCommand('copy')\">" - "<i class='fa fa-copy'></i></span>"); - } _html("</li>"); - - } _html("</ul>"); + _html("<div class='repo-url-container'>") { + _html("<ul class='repo-url'>") { + _html("<li class='select'>") { + _html("<select>") { + for (i = 0; url_list[i] != NULL; i++) + htmlf("<option " + "onclick=\"document.getElementById('clone-url-value')" + ".value='%s'\">%s</option>", + url_list[i]->buf, get_clone_type(url_list[i]->buf)); + } _html("</select>"); + } html("</li>"); + html("<li class='select-arrow'><i class='fa fa-caret-down'></i></li>"); + + _html("<li>") { + htmlf("<input onclick='this.select()', type='text' " + "class='input-copy' id='clone-url-value' value='%s' readonly />", + url_list[0]->buf); + } html("</li>"); + + _html("<li>") { + html("<div class='copy' " + "onclick=\"document.getElementById('clone-url-value').select();" + "document.execCommand('copy')\">" + "<i class='fa fa-copy'></i></div>"); + } html("</li>"); + + } _html("</ul>"); + } _html("</div>"); strbuf_list_free(url_list); }