From 0cb549448db0740f4d538a6ada69f429b9832f91 Mon Sep 17 00:00:00 2001 From: Kasper Mikiewicz Date: Wed, 14 Feb 2018 12:51:14 +0100 Subject: [PATCH] feat: style version input --- docs/cheatsheet/web/index.html | 8 ++++---- docs/cheatsheet/web/script.js | 4 ++-- docs/cheatsheet/web/style.css | 12 ++++++++++++ 3 files changed, 18 insertions(+), 6 deletions(-) diff --git a/docs/cheatsheet/web/index.html b/docs/cheatsheet/web/index.html index d8c04ad8..8daae5af 100644 --- a/docs/cheatsheet/web/index.html +++ b/docs/cheatsheet/web/index.html @@ -14,7 +14,7 @@
@@ -29,10 +29,10 @@
Socket
-
+
diff --git a/docs/cheatsheet/web/script.js b/docs/cheatsheet/web/script.js index 550d6307..e9eb8a19 100644 --- a/docs/cheatsheet/web/script.js +++ b/docs/cheatsheet/web/script.js @@ -57,9 +57,9 @@ const $options = document.querySelectorAll(`[data-version] option`) const version = window.location.host.match(/^[0-9a-z\.]+/) const $selectedOption = document.querySelector(`option[value="${version}"]`) - const selectedOptionIndex = Array.prototype.indexOf.call($options, $selectedOption); + const selectedOptionIndex = Array.prototype.indexOf.call($options, $selectedOption) - $select.selectedIndex = selectedOptionIndex + $select.selectedIndex = selectedOptionIndex >= 0 ? selectedOptionIndex : 0 $select.addEventListener('change', event => { const version = event.target.value diff --git a/docs/cheatsheet/web/style.css b/docs/cheatsheet/web/style.css index 71753866..4d544fb9 100644 --- a/docs/cheatsheet/web/style.css +++ b/docs/cheatsheet/web/style.css @@ -79,6 +79,9 @@ td pre[class*="language-"] { } .c-header__tab + * { margin-left: 32px; + } + .c-header__tab--right { + margin-left: auto; } .c-header__tab a { color: #666; @@ -191,6 +194,15 @@ td pre[class*="language-"] { background: #7a9a99; } +[data-version] { + border: none; + padding: 8px; + border-radius: 4px; + background: #187eef; + color: #fff; + font-weight: bold; +} + /* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript */ /** * prism.js default theme for JavaScript, CSS and HTML