diff --git a/static/css/styles.css b/static/css/styles.css index fc04b91..3209240 100644 --- a/static/css/styles.css +++ b/static/css/styles.css @@ -65,3 +65,14 @@ form { form button { margin-top: 0.5em; } + +table pre .spaced { + padding: 0.5em; +} + +table td .clipped { + overflow-x: clip; + white-space: nowrap; + text-overflow: ellipsis; + max-width: 30ch; +} diff --git a/static/js/shorten.js b/static/js/shorten.js index b531ec3..2bbd4e2 100644 --- a/static/js/shorten.js +++ b/static/js/shorten.js @@ -16,11 +16,13 @@ const populateRedirects = async (redirKey) => { h( "td", {}, - h("a", { href: "/" + redirect.path }, [h("pre", {}, [redirect.path])]) + h("a", { href: "/" + redirect.path }, [ + h("pre", { className: "spaced" }, [redirect.path]), + ]) ), h( "td", - {}, + { className: "clipped" }, h("a", { href: redirect.target_location }, [redirect.target_location]) ), h("td", {}, [redirect.redirect_code]),