From 8804212376b10f9242cad40582065b74ad5c3608 Mon Sep 17 00:00:00 2001 From: CasieBarie Date: Sun, 8 Sep 2024 15:10:55 +0200 Subject: [PATCH] UPDATE - 08-09-2024 --- assets/css/default.css | 46 ++++++++++++++++++++--------------- assets/css/projects.css | 2 +- assets/js/default.js | 17 +++++++++++++ discord/inosso.html | 21 ++++------------ discord/keesiebernie.html | 51 +++++++++++++++++++++++++++++---------- minecraft/keeslib.html | 19 +++++++-------- 6 files changed, 97 insertions(+), 59 deletions(-) diff --git a/assets/css/default.css b/assets/css/default.css index 56b38a9..1847972 100644 --- a/assets/css/default.css +++ b/assets/css/default.css @@ -20,7 +20,7 @@ /*UNCOMMENT FOR DEBUG*/ /*outline: 1px solid #f00 !important;*/ } -::-webkit-scrollbar {width: 1.3vh;} +::-webkit-scrollbar {width: 1vh; height: 1vh;} ::-webkit-scrollbar-track {display: none;} ::-webkit-scrollbar-thumb { background: var(--gray-color); @@ -153,8 +153,8 @@ body.fixed-position { .text { border-radius: 30px; - padding: 2em; - font-size: 1.2em; + padding: 1.3em; + font-size: 1.1em; backdrop-filter: blur(4px); box-shadow: 10px 10px 20px black; } @@ -180,7 +180,7 @@ h2 { } h3 { - font-size: clamp(1ex, 4vw, 3ex); + font-size: clamp(2ex, 3vw, 3ex); padding-bottom: .5em; text-decoration: underline var(--secondary-color); } @@ -263,37 +263,45 @@ a.shield img:hover {opacity: 0.7;} opacity: .8; } +.modal-image:hover, .modal:hover { + cursor: pointer; +} + .modal { display: none; position: fixed; - z-index: 200; + z-index: 50; + padding-top: 50px; left: 0; top: 0; width: 100%; height: 100%; - background-color: rgba(0, 0, 0, 0.9); overflow: hidden; + background-color: rgba(0, 0, 0, 0.9); } -.modal-content, #caption { +.modal-content { margin: auto; display: block; - width: 80%; - max-width: 700px; - transform: scale(1); - -webkit-transform: scale(1); - -moz-transform: scale(1); - -o-transform: scale(1); - animation: zoom 0.6s; - -webkit-animation: zoom 0.6s; - -moz-animation: zoom 0.6s; - -o-animation: zoom 0.6s; + max-height: 80%; + max-width: 80%; + object-fit: scale-down; } -#caption { +.modal-caption { + margin: auto; + display: block; + width: 80%; + max-width: 700px; text-align: center; color: #ccc; - height: 150px; +} + +.modal-content, .modal-caption { + animation: zoom .6s; + -webkit-animation: zoom .6s; + -moz-animation: zoom .6s; + -o-animation: zoom .6s; } @keyframes zoom { diff --git a/assets/css/projects.css b/assets/css/projects.css index 9118e42..e7136e6 100644 --- a/assets/css/projects.css +++ b/assets/css/projects.css @@ -1,7 +1,7 @@ .projects { width: 100%; display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 2em; } diff --git a/assets/js/default.js b/assets/js/default.js index 3b31b21..592d542 100644 --- a/assets/js/default.js +++ b/assets/js/default.js @@ -23,6 +23,23 @@ function loaded() { copy(); for(let i = 0; i < 10; i++) {$('#circles').append('
  • ');} + + $('.modal-image').each(function() { + const $image = $(this); + const $modal = $image.next('.modal'); + const $modalImg = $modal.find('.modal-content'); + const $caption = $modal.find('.modal-caption'); + $modalImg.attr('src', $image.attr('src')); + $caption.text($image.attr('alt')); + $image.on('click', function() { + $modal.show(); + toggle(); + }); + $modal.on('click', function() { + $modal.hide(); + toggle(); + }); + }); } function copy() { diff --git a/discord/inosso.html b/discord/inosso.html index 3a3ba1a..6d27cf2 100644 --- a/discord/inosso.html +++ b/discord/inosso.html @@ -9,11 +9,6 @@ -
    @@ -61,11 +56,11 @@

    Features

    - Music Preview -
    - @@ -74,11 +69,5 @@

    Features

    - \ No newline at end of file diff --git a/discord/keesiebernie.html b/discord/keesiebernie.html index a60ee1f..7e491fb 100644 --- a/discord/keesiebernie.html +++ b/discord/keesiebernie.html @@ -13,7 +13,6 @@ .collapsible { color: white; cursor: pointer; - padding: 18px; width: 100%; border: none; text-align: left; @@ -27,22 +26,43 @@ background: transparent; } - .collapsible:after { - content: '\002B'; + .collapsible-icon { font-weight: bold; float: right; - margin-left: 5px; + margin-right: 1em; + display: inline-block; + position: relative; } - .collapsible-active:after { - content: "\2212"; + .collapsible-icon::before, .collapsible-icon::after { + content: ""; + position: absolute; + width: 1em; + height: .16em; + top: calc( (1em / 2 ) - .08em ); + background-color: white; + transition: .3s all; + border-radius: 0.03em; + } + + .collapsible-icon::after { + transform: rotate(90deg); + } + + .collapsible-active .collapsible-icon::after { + transform: rotate(180deg); + } + + + .collapsible-active .collapsible-icon::before { + transform: rotate(90deg) scale(0); } .content { padding: 0 18px; max-height: 0; overflow: hidden; - transition: max-height .3s ease-out; + transition: all .3s ease-out; text-align: left; border-radius: 25px; margin-bottom: 5px; @@ -78,10 +98,10 @@

    KeesieBernie

    -
    -
    +
    +
    - +

    @@ -133,7 +153,14 @@

    6. Contact Information

    This document is intended to outline the basic rules and guidelines for using KeesieBernie. For any specific issues not covered here, please reach out to the appropriate contact listed above.

    - +
    +
    +
    + +
    +
    +
    +

    @@ -224,10 +251,8 @@

    9. Contact Information

    const content = this.nextElementSibling; if (content.style.maxHeight){ content.style.maxHeight = null; - content.style.border = ""; } else { content.style.maxHeight = content.scrollHeight + "px"; - content.style.border = "2px solid black"; } }); } diff --git a/minecraft/keeslib.html b/minecraft/keeslib.html index d911127..2abaf0a 100644 --- a/minecraft/keeslib.html +++ b/minecraft/keeslib.html @@ -156,10 +156,11 @@

    Methods

    -
    +

    Update Checker

    -

    This library also has a fancy Update Checker . The ultimate tool for ensuring your plugin users are always up-to-date with the latest features, bug fixes, and improvements.

    +

    This library also has a fancy Update Checker. The ultimate tool for ensuring your plugin users are always up-to-date with the latest features, bug fixes, and improvements.

    +

    Initialise the update checker using this and specify your Spigot resourceid:

    new keeslib.updateChecker(Integer recourceID)

    After that you can customize your update checker using these methods:

    @@ -178,9 +179,12 @@

    Update Checker

    After the customization you start the updatechecker by calling:

    .startChecking();
    - +
    + Music Preview +
    + +
    @@ -192,11 +196,6 @@

    Update Checker