diff --git a/composer.lock b/composer.lock index 88f9452..336ed9f 100644 --- a/composer.lock +++ b/composer.lock @@ -66,16 +66,16 @@ }, { "name": "chillerlan/php-qrcode", - "version": "4.4.2", + "version": "5.0.5", "source": { "type": "git", "url": "https://github.com/chillerlan/php-qrcode.git", - "reference": "345ed8e4ffb56e6b3fcd9f42e3970b9026fa6ce4" + "reference": "7b66282572fc14075c0507d74d9837dab25b38d6" }, "dist": { "type": "zip", - "url": "https://api.github.com/repos/chillerlan/php-qrcode/zipball/345ed8e4ffb56e6b3fcd9f42e3970b9026fa6ce4", - "reference": "345ed8e4ffb56e6b3fcd9f42e3970b9026fa6ce4", + "url": "https://api.github.com/repos/chillerlan/php-qrcode/zipball/7b66282572fc14075c0507d74d9837dab25b38d6", + "reference": "7b66282572fc14075c0507d74d9837dab25b38d6", "shasum": "" }, "require": { @@ -84,11 +84,15 @@ "php": "^7.4 || ^8.0" }, "require-dev": { - "phan/phan": "^5.4.5", + "chillerlan/php-authenticator": "^4.3.1 || ^5.2.1", + "ext-fileinfo": "*", + "phan/phan": "^5.5.2", + "phpcompatibility/php-compatibility": "10.x-dev", "phpmd/phpmd": "^2.15", "phpunit/phpunit": "^9.6", "setasign/fpdf": "^1.8.2", - "squizlabs/php_codesniffer": "^3.11" + "slevomat/coding-standard": "^8.23.0", + "squizlabs/php_codesniffer": "^4.0.0" }, "suggest": { "chillerlan/php-authenticator": "Yet another Google authenticator! Also creates URIs for mobile apps.", @@ -98,17 +102,26 @@ "type": "library", "autoload": { "psr-4": { - "chillerlan\\QRCode\\": "src/" + "chillerlan\\QRCode\\": "src" } }, "notification-url": "https://packagist.org/downloads/", "license": [ - "MIT" + "MIT", + "Apache-2.0" ], "authors": [ { "name": "Kazuhiko Arase", - "homepage": "https://github.com/kazuhikoarase" + "homepage": "https://github.com/kazuhikoarase/qrcode-generator" + }, + { + "name": "ZXing Authors", + "homepage": "https://github.com/zxing/zxing" + }, + { + "name": "Ashot Khanamiryan", + "homepage": "https://github.com/khanamiryan/php-qrcode-detector-decoder" }, { "name": "Smiley", @@ -120,26 +133,29 @@ "homepage": "https://github.com/chillerlan/php-qrcode/graphs/contributors" } ], - "description": "A QR code generator with a user friendly API. PHP 7.4+", + "description": "A QR Code generator and reader with a user-friendly API. PHP 7.4+", "homepage": "https://github.com/chillerlan/php-qrcode", "keywords": [ "phpqrcode", "qr", "qr code", + "qr-reader", "qrcode", - "qrcode-generator" + "qrcode-generator", + "qrcode-reader" ], "support": { + "docs": "https://php-qrcode.readthedocs.io", "issues": "https://github.com/chillerlan/php-qrcode/issues", - "source": "https://github.com/chillerlan/php-qrcode/tree/4.4.2" + "source": "https://github.com/chillerlan/php-qrcode" }, "funding": [ { "url": "https://ko-fi.com/codemasher", - "type": "ko_fi" + "type": "Ko-Fi" } ], - "time": "2024-11-15T15:36:24+00:00" + "time": "2025-11-23T23:51:44+00:00" }, { "name": "chillerlan/php-settings-container", @@ -1214,10 +1230,10 @@ "dist": { "type": "path", "url": "user/plugins/seans-qrcode", - "reference": "3e788bc8c3c0079257114a51b0c9f3b4d44dd7cf" + "reference": "d162de53f08a19e0b27335362a74788712f1d20e" }, "require": { - "chillerlan/php-qrcode": "^4.4.0", + "chillerlan/php-qrcode": "^4.4.0 || ^5.0.3", "ext-gd": "*", "ext-mbstring": "*", "php": "^8.0" diff --git a/frontend/assets/sass/styles.scss b/frontend/assets/sass/styles.scss index 7cb7c98..6ee2990 100644 --- a/frontend/assets/sass/styles.scss +++ b/frontend/assets/sass/styles.scss @@ -5,6 +5,14 @@ $raleway: "Raleway", system-ui, -apple-system, "Segoe UI", Raleway, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; $oswald: "Oswald", system-ui, -apple-system, "Segoe UI", Oswald, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; +// Theme variables (safe defaults) +$theme: "light" !default; +$primary: #112e51 !default; +// Accent color for light theme +$accent: $primary !default; +// Background color for light theme buttons +$light: #ffffff !default; + // Bootstrap Overrides $enable-negative-margins: true; $font-family-sans-serif: $raleway; @@ -81,3 +89,52 @@ $border-radius: 6px; } } } + +.login { + input.button { + font-weight: 600; + padding: 10px 25px; + margin-top: 15px !important; + + @if ($theme == "light") { + background: $accent !important; + } @else { + background: $light !important; + border-left: 7px solid $accent !important; + } + } +} + +.visually-hidden { + position: absolute !important; + width: 1px !important; + height: 1px !important; + padding: 0 !important; + margin: -1px !important; + overflow: hidden !important; + clip: rect(0, 0, 0, 0) !important; + white-space: nowrap !important; + border: 0 !important; +} + +.visually-hidden-focusable:active, +.visually-hidden-focusable:focus { + position: static !important; + width: auto !important; + height: auto !important; + margin: 0 !important; + overflow: visible !important; + clip: auto !important; + white-space: normal !important; +} +.customize-link-toggle { + transition: box-shadow 0.15s ease, outline 0.15s ease, background-color 0.15s ease; +} + +.customize-link-toggle:focus-visible, +.customize-link-toggle:focus { + outline: 3px solid $primary; + outline-offset: 2px; + box-shadow: 0 0 0 0.15rem rgba($primary, 0.5); + background-color: rgba($primary, 0.08); +} diff --git a/frontend/dist/styles.css b/frontend/dist/styles.css index 1cc6000..315a778 100644 --- a/frontend/dist/styles.css +++ b/frontend/dist/styles.css @@ -26,23 +26,23 @@ --bs-gray-700: #495057; --bs-gray-800: #343a40; --bs-gray-900: #212529; - --bs-primary: #0d6efd; + --bs-primary: #112e51; --bs-secondary: #6c757d; --bs-success: #198754; --bs-info: #0dcaf0; --bs-warning: #ffc107; --bs-danger: #dc3545; - --bs-light: #f8f9fa; + --bs-light: #ffffff; --bs-dark: #212529; - --bs-primary-rgb: 13, 110, 253; + --bs-primary-rgb: 17, 46, 81; --bs-secondary-rgb: 108, 117, 125; --bs-success-rgb: 25, 135, 84; --bs-info-rgb: 13, 202, 240; --bs-warning-rgb: 255, 193, 7; --bs-danger-rgb: 220, 53, 69; - --bs-light-rgb: 248, 249, 250; + --bs-light-rgb: 255, 255, 255; --bs-dark-rgb: 33, 37, 41; - --bs-primary-text-emphasis: rgb(5.2, 44, 101.2); + --bs-primary-text-emphasis: rgb(6.8, 18.4, 32.4); --bs-secondary-text-emphasis: rgb(43.2, 46.8, 50); --bs-success-text-emphasis: rgb(10, 54, 33.6); --bs-info-text-emphasis: rgb(5.2, 80.8, 96); @@ -50,7 +50,7 @@ --bs-danger-text-emphasis: rgb(88, 21.2, 27.6); --bs-light-text-emphasis: #495057; --bs-dark-text-emphasis: #495057; - --bs-primary-bg-subtle: rgb(206.6, 226, 254.6); + --bs-primary-bg-subtle: rgb(207.4, 213.2, 220.2); --bs-secondary-bg-subtle: rgb(225.6, 227.4, 229); --bs-success-bg-subtle: rgb(209, 231, 220.8); --bs-info-bg-subtle: rgb(206.6, 244.4, 252); @@ -58,7 +58,7 @@ --bs-danger-bg-subtle: rgb(248, 214.6, 217.8); --bs-light-bg-subtle: rgb(251.5, 252, 252.5); --bs-dark-bg-subtle: #ced4da; - --bs-primary-border-subtle: rgb(158.2, 197, 254.2); + --bs-primary-border-subtle: rgb(159.8, 171.4, 185.4); --bs-secondary-border-subtle: rgb(196.2, 199.8, 203); --bs-success-border-subtle: rgb(163, 207, 186.6); --bs-info-border-subtle: rgb(158.2, 233.8, 249); @@ -90,11 +90,11 @@ --bs-tertiary-bg: #f8f9fa; --bs-tertiary-bg-rgb: 248, 249, 250; --bs-heading-color: inherit; - --bs-link-color: #0d6efd; - --bs-link-color-rgb: 13, 110, 253; + --bs-link-color: #112e51; + --bs-link-color-rgb: 17, 46, 81; --bs-link-decoration: underline; - --bs-link-hover-color: rgb(10.4, 88, 202.4); - --bs-link-hover-color-rgb: 10, 88, 202; + --bs-link-hover-color: rgb(13.6, 36.8, 64.8); + --bs-link-hover-color-rgb: 14, 37, 65; --bs-code-color: #d63384; --bs-highlight-color: #212529; --bs-highlight-bg: rgb(255, 242.6, 205.4); @@ -115,7 +115,7 @@ --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); --bs-focus-ring-width: 0.25rem; --bs-focus-ring-opacity: 0.25; - --bs-focus-ring-color: rgba(13, 110, 253, 0.25); + --bs-focus-ring-color: rgba(17, 46, 81, 0.25); --bs-form-valid-color: #198754; --bs-form-valid-border-color: #198754; --bs-form-invalid-color: #dc3545; @@ -138,7 +138,7 @@ --bs-tertiary-color-rgb: 222, 226, 230; --bs-tertiary-bg: rgb(42.5, 47.5, 52.5); --bs-tertiary-bg-rgb: 43, 48, 53; - --bs-primary-text-emphasis: rgb(109.8, 168, 253.8); + --bs-primary-text-emphasis: rgb(112.2, 129.6, 150.6); --bs-secondary-text-emphasis: rgb(166.8, 172.2, 177); --bs-success-text-emphasis: rgb(117, 183, 152.4); --bs-info-text-emphasis: rgb(109.8, 223.2, 246); @@ -146,7 +146,7 @@ --bs-danger-text-emphasis: rgb(234, 133.8, 143.4); --bs-light-text-emphasis: #f8f9fa; --bs-dark-text-emphasis: #dee2e6; - --bs-primary-bg-subtle: rgb(2.6, 22, 50.6); + --bs-primary-bg-subtle: rgb(3.4, 9.2, 16.2); --bs-secondary-bg-subtle: rgb(21.6, 23.4, 25); --bs-success-bg-subtle: rgb(5, 27, 16.8); --bs-info-bg-subtle: rgb(2.6, 40.4, 48); @@ -154,7 +154,7 @@ --bs-danger-bg-subtle: rgb(44, 10.6, 13.8); --bs-light-bg-subtle: #343a40; --bs-dark-bg-subtle: #1a1d20; - --bs-primary-border-subtle: rgb(7.8, 66, 151.8); + --bs-primary-border-subtle: rgb(10.2, 27.6, 48.6); --bs-secondary-border-subtle: rgb(64.8, 70.2, 75); --bs-success-border-subtle: rgb(15, 81, 50.4); --bs-info-border-subtle: rgb(7.8, 121.2, 144); @@ -163,10 +163,10 @@ --bs-light-border-subtle: #495057; --bs-dark-border-subtle: #343a40; --bs-heading-color: inherit; - --bs-link-color: rgb(109.8, 168, 253.8); - --bs-link-hover-color: rgb(138.84, 185.4, 254.04); - --bs-link-color-rgb: 110, 168, 254; - --bs-link-hover-color-rgb: 139, 185, 254; + --bs-link-color: rgb(112.2, 129.6, 150.6); + --bs-link-hover-color: rgb(140.76, 154.68, 171.48); + --bs-link-color-rgb: 112, 130, 151; + --bs-link-hover-color-rgb: 141, 155, 171; --bs-code-color: rgb(230.4, 132.6, 181.2); --bs-highlight-color: #dee2e6; --bs-highlight-bg: rgb(102, 77.2, 2.8); @@ -513,8 +513,8 @@ legend { width: 100%; padding: 0; margin-bottom: 0.5rem; - font-size: calc(1.275rem + 0.3vw); line-height: inherit; + font-size: calc(1.275rem + 0.3vw); } @media (min-width: 1200px) { legend { @@ -543,6 +543,10 @@ legend + * { -webkit-appearance: textfield; outline-offset: -2px; } +[type=search]::-webkit-search-cancel-button { + cursor: pointer; + filter: grayscale(1); +} /* rtl:raw: [type="tel"], @@ -592,9 +596,9 @@ progress { } .display-1 { - font-size: calc(1.625rem + 4.5vw); font-weight: 300; line-height: 1.2; + font-size: calc(1.625rem + 4.5vw); } @media (min-width: 1200px) { .display-1 { @@ -603,9 +607,9 @@ progress { } .display-2 { - font-size: calc(1.575rem + 3.9vw); font-weight: 300; line-height: 1.2; + font-size: calc(1.575rem + 3.9vw); } @media (min-width: 1200px) { .display-2 { @@ -614,9 +618,9 @@ progress { } .display-3 { - font-size: calc(1.525rem + 3.3vw); font-weight: 300; line-height: 1.2; + font-size: calc(1.525rem + 3.3vw); } @media (min-width: 1200px) { .display-3 { @@ -625,9 +629,9 @@ progress { } .display-4 { - font-size: calc(1.475rem + 2.7vw); font-weight: 300; line-height: 1.2; + font-size: calc(1.475rem + 2.7vw); } @media (min-width: 1200px) { .display-4 { @@ -636,9 +640,9 @@ progress { } .display-5 { - font-size: calc(1.425rem + 2.1vw); font-weight: 300; line-height: 1.2; + font-size: calc(1.425rem + 2.1vw); } @media (min-width: 1200px) { .display-5 { @@ -647,9 +651,9 @@ progress { } .display-6 { - font-size: calc(1.375rem + 1.5vw); font-weight: 300; line-height: 1.2; + font-size: calc(1.375rem + 1.5vw); } @media (min-width: 1200px) { .display-6 { @@ -766,7 +770,7 @@ progress { } .col { - flex: 1 0 0%; + flex: 1 0 0; } .row-cols-auto > * { @@ -975,7 +979,7 @@ progress { @media (min-width: 576px) { .col-sm { - flex: 1 0 0%; + flex: 1 0 0; } .row-cols-sm-auto > * { flex: 0 0 auto; @@ -1144,7 +1148,7 @@ progress { } @media (min-width: 768px) { .col-md { - flex: 1 0 0%; + flex: 1 0 0; } .row-cols-md-auto > * { flex: 0 0 auto; @@ -1313,7 +1317,7 @@ progress { } @media (min-width: 992px) { .col-lg { - flex: 1 0 0%; + flex: 1 0 0; } .row-cols-lg-auto > * { flex: 0 0 auto; @@ -1482,7 +1486,7 @@ progress { } @media (min-width: 1200px) { .col-xl { - flex: 1 0 0%; + flex: 1 0 0; } .row-cols-xl-auto > * { flex: 0 0 auto; @@ -1651,7 +1655,7 @@ progress { } @media (min-width: 1400px) { .col-xxl { - flex: 1 0 0%; + flex: 1 0 0; } .row-cols-xxl-auto > * { flex: 0 0 auto; @@ -1878,9 +1882,9 @@ progress { .form-control:focus { color: var(--bs-body-color); background-color: #ebebeb; - border-color: rgb(134, 182.5, 254); + border-color: rgb(136, 150.5, 168); outline: 0; - box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); + box-shadow: 0 0 0 0.25rem rgba(17, 46, 81, 0.25); } .form-control::-webkit-date-and-time-value { min-width: 85px; @@ -2024,9 +2028,9 @@ textarea.form-control-lg { } } .form-select:focus { - border-color: rgb(134, 182.5, 254); + border-color: rgb(136, 150.5, 168); outline: 0; - box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); + box-shadow: 0 0 0 0.25rem rgba(17, 46, 81, 0.25); } .form-select[multiple], .form-select[size]:not([size="1"]) { padding-right: 0.75rem; @@ -2108,13 +2112,13 @@ textarea.form-control-lg { filter: brightness(90%); } .form-check-input:focus { - border-color: rgb(134, 182.5, 254); + border-color: rgb(136, 150.5, 168); outline: 0; - box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); + box-shadow: 0 0 0 0.25rem rgba(17, 46, 81, 0.25); } .form-check-input:checked { - background-color: #0d6efd; - border-color: #0d6efd; + background-color: #112e51; + border-color: #112e51; } .form-check-input:checked[type=checkbox] { --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); @@ -2123,8 +2127,8 @@ textarea.form-control-lg { --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e"); } .form-check-input[type=checkbox]:indeterminate { - background-color: #0d6efd; - border-color: #0d6efd; + background-color: #112e51; + border-color: #112e51; --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e"); } .form-check-input:disabled { @@ -2155,7 +2159,7 @@ textarea.form-control-lg { } } .form-switch .form-check-input:focus { - --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgb%28134, 182.5, 254%29'/%3e%3c/svg%3e"); + --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgb%28136, 150.5, 168%29'/%3e%3c/svg%3e"); } .form-switch .form-check-input:checked { background-position: right center; @@ -2201,10 +2205,10 @@ textarea.form-control-lg { outline: 0; } .form-range:focus::-webkit-slider-thumb { - box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); + box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(17, 46, 81, 0.25); } .form-range:focus::-moz-range-thumb { - box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); + box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(17, 46, 81, 0.25); } .form-range::-moz-focus-outer { border: 0; @@ -2214,7 +2218,7 @@ textarea.form-control-lg { height: 1rem; margin-top: -0.25rem; appearance: none; - background-color: #0d6efd; + background-color: #112e51; border: 0; border-radius: 1rem; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; @@ -2225,7 +2229,7 @@ textarea.form-control-lg { } } .form-range::-webkit-slider-thumb:active { - background-color: rgb(182.4, 211.5, 254.4); + background-color: rgb(183.6, 192.3, 202.8); } .form-range::-webkit-slider-runnable-track { width: 100%; @@ -2240,7 +2244,7 @@ textarea.form-control-lg { width: 1rem; height: 1rem; appearance: none; - background-color: #0d6efd; + background-color: #112e51; border: 0; border-radius: 1rem; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; @@ -2251,7 +2255,7 @@ textarea.form-control-lg { } } .form-range::-moz-range-thumb:active { - background-color: rgb(182.4, 211.5, 254.4); + background-color: rgb(183.6, 192.3, 202.8); } .form-range::-moz-range-track { width: 100%; @@ -2287,9 +2291,11 @@ textarea.form-control-lg { top: 0; left: 0; z-index: 2; + max-width: 100%; height: 100%; padding: 1rem 0.75rem; overflow: hidden; + color: rgba(var(--bs-body-color-rgb), 0.65); text-align: start; text-overflow: ellipsis; white-space: nowrap; @@ -2325,18 +2331,19 @@ textarea.form-control-lg { .form-floating > .form-select { padding-top: 1.625rem; padding-bottom: 0.625rem; + padding-left: 0.75rem; } .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control-plaintext ~ label, .form-floating > .form-select ~ label { - color: rgba(var(--bs-body-color-rgb), 0.65); transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); } -.form-floating > .form-control:focus ~ label::after, -.form-floating > .form-control:not(:placeholder-shown) ~ label::after, -.form-floating > .form-control-plaintext ~ label::after, -.form-floating > .form-select ~ label::after { +.form-floating > .form-control:-webkit-autofill ~ label { + transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); +} +.form-floating > textarea:focus ~ label::after, +.form-floating > textarea:not(:placeholder-shown) ~ label::after { position: absolute; inset: 1rem 0.375rem; z-index: -1; @@ -2345,9 +2352,8 @@ textarea.form-control-lg { background-color: #ebebeb; border-radius: var(--bs-border-radius); } -.form-floating > .form-control:-webkit-autofill ~ label { - color: rgba(var(--bs-body-color-rgb), 0.65); - transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); +.form-floating > textarea:disabled ~ label::after { + background-color: var(--bs-secondary-bg); } .form-floating > .form-control-plaintext ~ label { border-width: 0 0; @@ -2356,10 +2362,6 @@ textarea.form-control-lg { .form-floating > .form-control:disabled ~ label { color: #6c757d; } -.form-floating > :disabled ~ label::after, -.form-floating > .form-control:disabled ~ label::after { - background-color: var(--bs-secondary-bg); -} .input-group { position: relative; @@ -2442,7 +2444,7 @@ textarea.form-control-lg { border-bottom-right-radius: 0; } .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) { - margin-left: calc(0 * -1); + margin-left: calc(-1 * 0); border-top-left-radius: 0; border-bottom-left-radius: 0; } @@ -2484,7 +2486,7 @@ textarea.form-control-lg { .was-validated .form-control:valid, .form-control.is-valid { border-color: var(--bs-form-valid-border-color); padding-right: calc(1.5em + 0.75rem); - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); @@ -2503,7 +2505,7 @@ textarea.form-control-lg { border-color: var(--bs-form-valid-border-color); } .was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"] { - --bs-form-select-bg-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); + --bs-form-select-bg-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1'/%3e%3c/svg%3e"); padding-right: 4.125rem; background-position: right 0.75rem center, center right 2.25rem; background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); @@ -2713,19 +2715,19 @@ textarea.form-control-lg { .btn-primary { --bs-btn-color: #fff; - --bs-btn-bg: #0d6efd; - --bs-btn-border-color: #0d6efd; + --bs-btn-bg: #112e51; + --bs-btn-border-color: #112e51; --bs-btn-hover-color: #fff; - --bs-btn-hover-bg: rgb(11.05, 93.5, 215.05); - --bs-btn-hover-border-color: rgb(10.4, 88, 202.4); - --bs-btn-focus-shadow-rgb: 49, 132, 253; + --bs-btn-hover-bg: rgb(14.45, 39.1, 68.85); + --bs-btn-hover-border-color: rgb(13.6, 36.8, 64.8); + --bs-btn-focus-shadow-rgb: 53, 77, 107; --bs-btn-active-color: #fff; - --bs-btn-active-bg: rgb(10.4, 88, 202.4); - --bs-btn-active-border-color: rgb(9.75, 82.5, 189.75); + --bs-btn-active-bg: rgb(13.6, 36.8, 64.8); + --bs-btn-active-border-color: rgb(12.75, 34.5, 60.75); --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: #fff; - --bs-btn-disabled-bg: #0d6efd; - --bs-btn-disabled-border-color: #0d6efd; + --bs-btn-disabled-bg: #112e51; + --bs-btn-disabled-border-color: #112e51; } .btn-secondary { @@ -2815,19 +2817,19 @@ textarea.form-control-lg { .btn-light { --bs-btn-color: #000; - --bs-btn-bg: #f8f9fa; - --bs-btn-border-color: #f8f9fa; + --bs-btn-bg: #ffffff; + --bs-btn-border-color: #ffffff; --bs-btn-hover-color: #000; - --bs-btn-hover-bg: rgb(210.8, 211.65, 212.5); - --bs-btn-hover-border-color: rgb(198.4, 199.2, 200); - --bs-btn-focus-shadow-rgb: 211, 212, 213; + --bs-btn-hover-bg: rgb(216.75, 216.75, 216.75); + --bs-btn-hover-border-color: #cccccc; + --bs-btn-focus-shadow-rgb: 217, 217, 217; --bs-btn-active-color: #000; - --bs-btn-active-bg: rgb(198.4, 199.2, 200); - --bs-btn-active-border-color: rgb(186, 186.75, 187.5); + --bs-btn-active-bg: #cccccc; + --bs-btn-active-border-color: rgb(191.25, 191.25, 191.25); --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: #000; - --bs-btn-disabled-bg: #f8f9fa; - --bs-btn-disabled-border-color: #f8f9fa; + --bs-btn-disabled-bg: #ffffff; + --bs-btn-disabled-border-color: #ffffff; } .btn-dark { @@ -2848,19 +2850,19 @@ textarea.form-control-lg { } .btn-outline-primary { - --bs-btn-color: #0d6efd; - --bs-btn-border-color: #0d6efd; + --bs-btn-color: #112e51; + --bs-btn-border-color: #112e51; --bs-btn-hover-color: #fff; - --bs-btn-hover-bg: #0d6efd; - --bs-btn-hover-border-color: #0d6efd; - --bs-btn-focus-shadow-rgb: 13, 110, 253; + --bs-btn-hover-bg: #112e51; + --bs-btn-hover-border-color: #112e51; + --bs-btn-focus-shadow-rgb: 17, 46, 81; --bs-btn-active-color: #fff; - --bs-btn-active-bg: #0d6efd; - --bs-btn-active-border-color: #0d6efd; + --bs-btn-active-bg: #112e51; + --bs-btn-active-border-color: #112e51; --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); - --bs-btn-disabled-color: #0d6efd; + --bs-btn-disabled-color: #112e51; --bs-btn-disabled-bg: transparent; - --bs-btn-disabled-border-color: #0d6efd; + --bs-btn-disabled-border-color: #112e51; --bs-gradient: none; } @@ -2950,19 +2952,19 @@ textarea.form-control-lg { } .btn-outline-light { - --bs-btn-color: #f8f9fa; - --bs-btn-border-color: #f8f9fa; + --bs-btn-color: #ffffff; + --bs-btn-border-color: #ffffff; --bs-btn-hover-color: #000; - --bs-btn-hover-bg: #f8f9fa; - --bs-btn-hover-border-color: #f8f9fa; - --bs-btn-focus-shadow-rgb: 248, 249, 250; + --bs-btn-hover-bg: #ffffff; + --bs-btn-hover-border-color: #ffffff; + --bs-btn-focus-shadow-rgb: 255, 255, 255; --bs-btn-active-color: #000; - --bs-btn-active-bg: #f8f9fa; - --bs-btn-active-border-color: #f8f9fa; + --bs-btn-active-bg: #ffffff; + --bs-btn-active-border-color: #ffffff; --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); - --bs-btn-disabled-color: #f8f9fa; + --bs-btn-disabled-color: #ffffff; --bs-btn-disabled-bg: transparent; - --bs-btn-disabled-border-color: #f8f9fa; + --bs-btn-disabled-border-color: #ffffff; --bs-gradient: none; } @@ -2995,7 +2997,7 @@ textarea.form-control-lg { --bs-btn-disabled-color: #6c757d; --bs-btn-disabled-border-color: transparent; --bs-btn-box-shadow: 0 0 0 #000; - --bs-btn-focus-shadow-rgb: 49, 132, 253; + --bs-btn-focus-shadow-rgb: 53, 77, 107; text-decoration: underline; } .btn-link:focus-visible { @@ -3210,7 +3212,7 @@ textarea.form-control-lg { flex-flow: row wrap; } .card-group > .card { - flex: 1 0 0%; + flex: 1 0 0; margin-bottom: 0; } .card-group > .card + .card { @@ -3221,24 +3223,24 @@ textarea.form-control-lg { border-top-right-radius: 0; border-bottom-right-radius: 0; } - .card-group > .card:not(:last-child) .card-img-top, - .card-group > .card:not(:last-child) .card-header { + .card-group > .card:not(:last-child) > .card-img-top, + .card-group > .card:not(:last-child) > .card-header { border-top-right-radius: 0; } - .card-group > .card:not(:last-child) .card-img-bottom, - .card-group > .card:not(:last-child) .card-footer { + .card-group > .card:not(:last-child) > .card-img-bottom, + .card-group > .card:not(:last-child) > .card-footer { border-bottom-right-radius: 0; } .card-group > .card:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } - .card-group > .card:not(:first-child) .card-img-top, - .card-group > .card:not(:first-child) .card-header { + .card-group > .card:not(:first-child) > .card-img-top, + .card-group > .card:not(:first-child) > .card-header { border-top-left-radius: 0; } - .card-group > .card:not(:first-child) .card-img-bottom, - .card-group > .card:not(:first-child) .card-footer { + .card-group > .card:not(:first-child) > .card-img-bottom, + .card-group > .card:not(:first-child) > .card-footer { border-bottom-left-radius: 0; } } @@ -3255,12 +3257,12 @@ textarea.form-control-lg { --bs-accordion-btn-padding-y: 1rem; --bs-accordion-btn-color: var(--bs-body-color); --bs-accordion-btn-bg: var(--bs-accordion-bg); - --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e"); + --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); --bs-accordion-btn-icon-width: 1.25rem; --bs-accordion-btn-icon-transform: rotate(-180deg); --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out; - --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='rgb%285.2, 44, 101.2%29' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e"); - --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); + --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='rgb%286.8, 18.4, 32.4%29' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); + --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(17, 46, 81, 0.25); --bs-accordion-body-padding-x: 1.25rem; --bs-accordion-body-padding-y: 1rem; --bs-accordion-active-color: var(--bs-primary-text-emphasis); @@ -3369,16 +3371,15 @@ textarea.form-control-lg { .accordion-flush > .accordion-item:last-child { border-bottom: 0; } -.accordion-flush > .accordion-item > .accordion-header .accordion-button, .accordion-flush > .accordion-item > .accordion-header .accordion-button.collapsed { - border-radius: 0; -} -.accordion-flush > .accordion-item > .accordion-collapse { +.accordion-flush > .accordion-item > .accordion-collapse, +.accordion-flush > .accordion-item > .accordion-header .accordion-button, +.accordion-flush > .accordion-item > .accordion-header .accordion-button.collapsed { border-radius: 0; } [data-bs-theme=dark] .accordion-button::after { - --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='rgb%28109.8, 168, 253.8%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); - --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='rgb%28109.8, 168, 253.8%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); + --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='rgb%28112.2, 129.6, 150.6%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/%3e%3c/svg%3e"); + --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='rgb%28112.2, 129.6, 150.6%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/%3e%3c/svg%3e"); } .alert { @@ -3478,19 +3479,19 @@ textarea.form-control-lg { .btn-close { --bs-btn-close-color: #000; - --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e"); + --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e"); --bs-btn-close-opacity: 0.5; --bs-btn-close-hover-opacity: 0.75; - --bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); + --bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(17, 46, 81, 0.25); --bs-btn-close-focus-opacity: 1; --bs-btn-close-disabled-opacity: 0.25; - --bs-btn-close-white-filter: invert(1) grayscale(100%) brightness(200%); box-sizing: content-box; width: 1em; height: 1em; padding: 0.25em 0.25em; color: var(--bs-btn-close-color); background: transparent var(--bs-btn-close-bg) center/1em auto no-repeat; + filter: var(--bs-btn-close-filter); border: 0; border-radius: 6px; opacity: var(--bs-btn-close-opacity); @@ -3512,11 +3513,16 @@ textarea.form-control-lg { } .btn-close-white { - filter: var(--bs-btn-close-white-filter); + --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%); } -[data-bs-theme=dark] .btn-close { - filter: var(--bs-btn-close-white-filter); +:root, +[data-bs-theme=light] { + --bs-btn-close-filter: ; +} + +[data-bs-theme=dark] { + --bs-btn-close-filter: invert(1) grayscale(100%) brightness(200%); } .clearfix::after { @@ -3570,8 +3576,8 @@ textarea.form-control-lg { text-decoration-color: RGBA(var(--bs-primary-rgb), var(--bs-link-underline-opacity, 1)) !important; } .link-primary:hover, .link-primary:focus { - color: RGBA(10, 88, 202, var(--bs-link-opacity, 1)) !important; - text-decoration-color: RGBA(10, 88, 202, var(--bs-link-underline-opacity, 1)) !important; + color: RGBA(14, 37, 65, var(--bs-link-opacity, 1)) !important; + text-decoration-color: RGBA(14, 37, 65, var(--bs-link-underline-opacity, 1)) !important; } .link-secondary { @@ -3624,8 +3630,8 @@ textarea.form-control-lg { text-decoration-color: RGBA(var(--bs-light-rgb), var(--bs-link-underline-opacity, 1)) !important; } .link-light:hover, .link-light:focus { - color: RGBA(249, 250, 251, var(--bs-link-opacity, 1)) !important; - text-decoration-color: RGBA(249, 250, 251, var(--bs-link-underline-opacity, 1)) !important; + color: RGBA(255, 255, 255, var(--bs-link-opacity, 1)) !important; + text-decoration-color: RGBA(255, 255, 255, var(--bs-link-underline-opacity, 1)) !important; } .link-dark { @@ -3826,6 +3832,10 @@ textarea.form-control-lg { .visually-hidden-focusable:not(:focus):not(:focus-within):not(caption) { position: absolute !important; } +.visually-hidden *, +.visually-hidden-focusable:not(:focus):not(:focus-within) * { + overflow: hidden !important; +} .stretched-link::after { position: absolute; @@ -9359,4 +9369,45 @@ textarea.form-control-lg { width: 100%; border-radius: 6px !important; } +} +.login input.button { + font-weight: 600; + padding: 10px 25px; + margin-top: 15px !important; + background: #112e51 !important; +} + +.visually-hidden { + position: absolute !important; + width: 1px !important; + height: 1px !important; + padding: 0 !important; + margin: -1px !important; + overflow: hidden !important; + clip: rect(0, 0, 0, 0) !important; + white-space: nowrap !important; + border: 0 !important; +} + +.visually-hidden-focusable:active, +.visually-hidden-focusable:focus { + position: static !important; + width: auto !important; + height: auto !important; + margin: 0 !important; + overflow: visible !important; + clip: auto !important; + white-space: normal !important; +} + +.customize-link-toggle { + transition: box-shadow 0.15s ease, outline 0.15s ease, background-color 0.15s ease; +} + +.customize-link-toggle:focus-visible, +.customize-link-toggle:focus { + outline: 3px solid #112e51; + outline-offset: 2px; + box-shadow: 0 0 0 0.15rem rgba(17, 46, 81, 0.5); + background-color: rgba(17, 46, 81, 0.08); } \ No newline at end of file diff --git a/frontend/footer.php b/frontend/footer.php index 17f2ec6..a67e8ce 100644 --- a/frontend/footer.php +++ b/frontend/footer.php @@ -45,13 +45,18 @@ function copyTextToClipboard(text) { copyBtn.addEventListener('click', function(event) { copyTextToClipboard(event.target.dataset.shorturl); }); + + // Move focus to copy button when result screen is shown + window.addEventListener('load', function () { + copyBtn.focus(); + }); } const closeShortenedLinkScreenButton = document.querySelector('button#close-shortened-screen'); if (closeShortenedLinkScreenButton) { closeShortenedLinkScreenButton.addEventListener('click', function(event) { - window.location.href=window.location.href; + window.location.href = window.location.href; }); } diff --git a/frontend/header.php b/frontend/header.php index 034b65e..9ede818 100644 --- a/frontend/header.php +++ b/frontend/header.php @@ -9,7 +9,7 @@ - +