From 5a44351c4d1b47e8abf5fa2b806db331cc41e776 Mon Sep 17 00:00:00 2001 From: Guuq <50501321+Guuq@users.noreply.github.com> Date: Wed, 13 Nov 2019 19:12:36 +0100 Subject: [PATCH] 13-11 #3 --- css.css | 19 ++++++--- index.html | 85 +++++++++++++++++++++---------------- js.js | 2 +- resources/css/navbar.css | 2 +- resources/css/shortcuts.css | 16 +++---- resources/js/shortcuts.js | 20 +++++---- 6 files changed, 81 insertions(+), 63 deletions(-) diff --git a/css.css b/css.css index fb1f3d6..b61ea0e 100644 --- a/css.css +++ b/css.css @@ -1,5 +1,5 @@ /* Main CSS */ -aside { +section { float: left; height: 95vh; display: inline-block; @@ -43,9 +43,11 @@ svg { .time { display: inline-block; font-size: 8rem; + margin: 0; } #date { font-size: 2rem; + margin: 0; } /* Footer */ footer { @@ -83,14 +85,19 @@ footer a:hover { /* Support for mobile devices */ @media screen and (min-width:0px) and (max-width:1000px) { aside { - width: 96%!important; + width: 100%!important; + } + svg { + display: none; + } + .time { + font-size: 5rem!important; } footer { - width: 98%!important; - display: block!important; - margin: 0!important; + float: left; + width: 100%; } footer div { - margin-top: 2rem!important; + margin: 5rem 0 0 3rem!important; } } diff --git a/index.html b/index.html index ec25d18..9bc8b4e 100644 --- a/index.html +++ b/index.html @@ -22,49 +22,52 @@ - + + @@ -77,7 +80,8 @@

LINKS

@@ -89,6 +93,14 @@
  • Reddit
  • +
    +

    TOOLS

    + +
    @@ -97,13 +109,14 @@ + diff --git a/js.js b/js.js index c2f1073..bd1570c 100644 --- a/js.js +++ b/js.js @@ -33,7 +33,7 @@ function showSearch(e) { } else { openSearch(); - d("googleSearchBar").value = e.key + d("googleSearchBar").value + d("googleSearchBar").value = d("googleSearchBar").value + e.key } } diff --git a/resources/css/navbar.css b/resources/css/navbar.css index 4e25b4f..eab35d9 100644 --- a/resources/css/navbar.css +++ b/resources/css/navbar.css @@ -42,7 +42,7 @@ display: block!important; } .navigation button:hover { - color: #4c8a80!important; + color: gray!important; } /* Switch */ diff --git a/resources/css/shortcuts.css b/resources/css/shortcuts.css index 440315b..bf75c0b 100644 --- a/resources/css/shortcuts.css +++ b/resources/css/shortcuts.css @@ -6,7 +6,7 @@ } } /* Shortcuts */ -aside span button { +section span button { margin: 0 0 1rem 1rem; width: 12rem; padding: 1rem; @@ -18,25 +18,21 @@ aside span button { cursor: pointer; transition: background-color .5s, border .5s; } -aside span button:hover { +section span button:hover { background-color: #3d3e47; border-color: #3d3e47; } -aside span button:hover .removeShortcut { +section span button:hover .removeShortcut { display: inline; } -aside span button:focus { +section span button:focus { outline: none; } -aside span img { +section span img { width: 3rem; + margin-right: 1rem; height: 3rem; } -aside span p { - display: inline-block; - margin-left: 1rem; - margin-bottom: 0!important; -} /* Shortcut creation menu */ .hidden { diff --git a/resources/js/shortcuts.js b/resources/js/shortcuts.js index 1a6b6d7..eec70c3 100644 --- a/resources/js/shortcuts.js +++ b/resources/js/shortcuts.js @@ -44,15 +44,17 @@ function createShortcut(shortcutObj) { } var obj = JSON.stringify(data) ls.setItem("shortcuts", obj) - var shortcut = $("",{href:shortcutLink,target:'_blank'}); - var shortcutDiv = $('
    ',{class:"shortcutImgBox"}); - var shortcutImage = $("",{src:'/resources/img/shortcut.png',class:'shortcutImg',alt:""}); - var shortcutText = c("p") - shortcutText.innerHTML = shortcutName // Can't use jquery (I think) - shortcutText.className = "shortcutText" - $("#shortcuts").append(shortcut); - $(shortcut).append(shortcutDiv); - $(shortcutDiv).append(shortcutImage, shortcutText); + var shortcut = c("a") + shortcut.href = shortcutLink + shortcut.alt = " " + shortcut.target = "_blank" + shortcut.innerHTML = shortcutName + var shortcutButton = c("button") + var shortcutImage = c("img") + shortcutImage.src = "/resources/img/shortcut.png" + $("#shortcuts").append(shortcutButton); + $(shortcutButton).append(shortcut); + $(shortcut).prepend(shortcutImage); $(".inputMenu").val('') closeMenu(); }