Update

1 files changed, 672 insertions, 0 deletions

diff --git a/assets/logo/custom.css b/assets/logo/custom.css
new file mode 100644
index 0000000..0e0ec6f
--- /dev/null
+++ b/assets/logo/custom.css
@@ -0,0 +1,672 @@
+#admin-page {
+    margin-left: 32px;
+}
+
+.modal {
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+}
+
+nav.navbar {
+    background-color: rgba(0, 0, 0, .75) !important;
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
+    border-bottom: 1px solid rgba(255, 255, 255, .25);
+}
+
+body {
+    background-color: black !important;
+    color: white !important;
+}
+
+.hpd-item-card:hover {
+    background-color: rgba(255, 255, 255, .15) !important;
+}
+
+.hpd-item-card:active, .hpd-item-card:focus {
+    background-color: rgba(255, 255, 255, .2) !important;
+}
+
+.hpd-system {
+    transition: opacity 200ms;
+}
+
+.hpd-item-card {
+    outline-style: solid;
+    outline-width: 0;
+    transition: background-color 200ms, outline-width 200ms;
+}
+
+.hpd-item-card:hover {
+    outline-style: solid;
+    outline-width: 4px;
+}
+
+.hpd-item-card:active {
+    outline-style: solid;
+    outline-width: 6px;
+}
+
+.hpd-system:hover {
+    opacity: .9 !important;
+}
+
+.hpd-system:active, .hpd-system:focus {
+    opacity: .8 !important;
+}
+
+.hpd-link:hover {
+    background-color: rgba(255, 255, 255, .15) !important;
+}
+
+.hpd-link:active, .hpd-link:focus {
+    background-color: rgba(255, 255, 255, .2) !important;
+}
+
+.list-separator-mobile {
+    display: none;
+}
+
+@media (max-width: 991px) {
+    #hpd-cloudburst > div, #hpd-raindrops > div {
+        grid-template-columns: repeat(3, 1fr) !important;
+    }
+
+    .list-separator-desktop {
+        display: none;
+    }
+
+    span.list-separator-mobile {
+        display: inline;
+    }
+}
+
+@media (max-width: 768px) {
+    #hpd-cloudburst > div, #hpd-raindrops > div {
+        grid-template-columns: repeat(2, 1fr) !important;
+    }
+}
+
+@media (max-width: 575px) {
+    #hpd-cloudburst > div, #hpd-raindrops > div {
+        grid-template-columns: repeat(1, 1fr) !important;
+    }
+
+    .hpd-item-card img {
+        display: inline-block !important;
+        margin-right: 5px !important;
+        height: 32px !important;
+    }
+
+    #hpd-cloudburst > div, #hpd-raindrops > div {
+        grid-gap: 5px !important;
+    }
+
+    .hpd-item-card div {
+        display: inline-block !important;
+    }
+
+    .hpd-item-card div:nth-child(3)::before {
+        content: "(";
+        padding-left: 5px;
+        color: white !important;
+    }
+
+    .hpd-item-card div:nth-child(3)::after {
+        content: ")";
+        color: white !important;
+    }
+}
+
+.dropdown-menu {
+    background-color: #222;
+}
+
+.dropdown-item:hover {
+    background-color: rgba(255, 255, 255, .1);
+}
+
+.dropdown-item:active, .dropdown-item:focus {
+    background-color: rgba(255, 255, 255, .2);
+}
+
+.dropdown-item {
+    color: white !important;
+}
+
+.dropdown-icon {
+    filter: invert(1);
+}
+
+.dropdown-toggle .dropdown-icon {
+    opacity: .5;
+    transition: 200ms opacity;
+}
+
+.dropdown-toggle:hover .dropdown-icon, .dropdown-toggle:active .dropdown-icon, .dropdown-toggle:focus .dropdown-icon {
+    opacity: .75;
+}
+
+dd {
+    margin-left: 20px;
+}
+
+#system-info a {
+    color: white !important;
+}
+
+#system-info a:hover {
+    opacity: .75;
+}
+
+#system-info a:active, #system-info a:focus {
+    opacity: .5;
+}
+
+@media (max-width: 991px) {
+    #member-card {
+        grid-template-columns: repeat(3, 1fr) !important;
+    }
+
+    .species-name {
+        display: none;
+    }
+}
+
+.member-small-only {
+    display: none;
+}
+
+@media (max-width: 767px) {
+    #member-card {
+        grid-template-columns: 1fr !important;
+        text-align: left;
+    }
+
+    #member-icon-mobile {
+        display: inline-block !important;
+    }
+
+    #system-info {
+        grid-template-columns: 1fr !important;
+    }
+
+    #member-icon, #member-icon-outer {
+        display: none !important;
+    }
+
+    #member-relations {
+        grid-template-columns: 1fr !important;
+        text-align: left;
+    }
+
+    .member-small-separator {
+        display: none;
+    }
+
+    .member-small-only {
+        display: inline-block;
+    }
+}
+
+#page-content a {
+    color: #afd0ff;
+}
+
+#page-content .btn-outline-light:hover {
+    color: black !important;
+}
+
+#page-content a:hover {
+    opacity: .75;
+}
+
+#page-content a:active, #page-content a:focus {
+    opacity: .5;
+}
+
+.tooltip.show {
+    opacity: 1;
+}
+
+.tooltip-inner {
+    background: #151515;
+    box-shadow: 3px 4px 10px #ffffff26;
+}
+
+.alert {
+    filter: invert(1) hue-rotate(180deg);
+}
+
+.member-link {
+    color: white !important;
+    text-decoration: none !important;
+}
+
+.system-action {
+    border-radius: 10px;
+    color: white !important;
+    text-decoration: none !important;
+    cursor: pointer;
+    transition: background 200ms;
+}
+
+.system-action:hover {
+    background: rgba(255, 255, 255, .1);
+}
+
+.table-dark {
+    --bs-table-bg: #000000;
+}
+
+.comparison {
+    display: grid;
+    grid-template-columns: 3fr 1.5fr 2fr repeat(4, 1fr);
+}
+
+.comparison-header {
+    border-bottom: 2px solid rgba(255, 255, 255, .25);
+    font-weight: bold;
+}
+
+.comparison-item {
+    padding: 5px 10px;
+    text-align: center;
+}
+
+.comparison-item-clickable:hover {
+    background-color: rgba(255, 255, 255, .1);
+}
+
+.comparison-item-clickable:active, .comparison-item-clickable:focus {
+    background-color: rgba(255, 255, 255, .25);
+}
+
+@media (min-width: 1400px) {
+    .comparison-header-l0 {
+        display: inline;
+    }
+    .comparison-header-l1 {
+        display: none;
+    }
+    .comparison-header-l2 {
+        display: none;
+    }
+    .comparison-header-l3 {
+        display: none;
+    }
+    .comparison-header-l4 {
+        display: none;
+    }
+    .comparison-header-l5 {
+        display: none;
+    }
+    .comparison-name-full {
+        display: inline;
+    }
+    .comparison-name-small {
+        display: none;
+    }
+    .comparison-colors {
+        display: inline;
+    }
+    .comparison-relations-count {
+        display: none;
+    }
+    .comparison-relations-full {
+        display: inline;
+    }
+}
+
+@media (max-width: 1399px) {
+    .comparison-header-l0 {
+        display: none;
+    }
+    .comparison-header-l1 {
+        display: inline;
+    }
+    .comparison-header-l2 {
+        display: none;
+    }
+    .comparison-header-l3 {
+        display: none;
+    }
+    .comparison-header-l4 {
+        display: none;
+    }
+    .comparison-header-l5 {
+        display: none;
+    }
+    .comparison-name-full {
+        display: inline;
+    }
+    .comparison-name-small {
+        display: none;
+    }
+    .comparison-colors {
+        display: inline;
+    }
+    .comparison-relations-count {
+        display: none;
+    }
+    .comparison-relations-full {
+        display: inline;
+    }
+}
+
+@media (max-width: 1199px) {
+    .comparison-header-l0 {
+        display: none;
+    }
+    .comparison-header-l1 {
+        display: none;
+    }
+    .comparison-header-l2 {
+        display: initial;
+    }
+    .comparison-header-l3 {
+        display: none;
+    }
+    .comparison-header-l4 {
+        display: none;
+    }
+    .comparison-header-l5 {
+        display: none;
+    }
+    .comparison-name-full {
+        display: none;
+    }
+    .comparison-name-small {
+        display: inline;
+    }
+    .comparison-colors {
+        display: inline;
+    }
+    .comparison-relations-count {
+        display: inline;
+    }
+    .comparison-relations-full {
+        display: none;
+    }
+}
+
+@media (max-width: 991px) {
+    .comparison-header-l0 {
+        display: none;
+    }
+    .comparison-header-l1 {
+        display: none;
+    }
+    .comparison-header-l2 {
+        display: none;
+    }
+    .comparison-header-l3 {
+        display: initial;
+    }
+    .comparison-header-l4 {
+        display: none;
+    }
+    .comparison-header-l5 {
+        display: none;
+    }
+    .comparison-name-full {
+        display: none;
+    }
+    .comparison-name-small {
+        display: inline;
+    }
+    .comparison-colors {
+        display: none !important;
+    }
+    .comparison-relations-count {
+        display: inline;
+    }
+    .comparison-relations-full {
+        display: none;
+    }
+}
+
+@media (max-width: 767px) {
+    .comparison-header-l0 {
+        display: none;
+    }
+    .comparison-header-l1 {
+        display: none;
+    }
+    .comparison-header-l2 {
+        display: none;
+    }
+    .comparison-header-l3 {
+        display: none;
+    }
+    .comparison-header-l4 {
+        display: initial;
+    }
+    .comparison-header-l5 {
+        display: none;
+    }
+    .comparison-name-full {
+        display: none;
+    }
+    .comparison-name-small {
+        display: none;
+    }
+    .comparison-colors {
+        display: none !important;
+    }
+    .comparison-relations-count {
+        display: inline;
+    }
+    .comparison-relations-full {
+        display: none;
+    }
+}
+
+@media (max-width: 575px) {
+    .comparison-header-l0 {
+        display: none;
+    }
+    .comparison-header-l1 {
+        display: none;
+    }
+    .comparison-header-l2 {
+        display: none;
+    }
+    .comparison-header-l3 {
+        display: none;
+    }
+    .comparison-header-l4 {
+        display: none;
+    }
+    .comparison-header-l5 {
+        display: initial;
+    }
+    .comparison-name-full {
+        display: none;
+    }
+    .comparison-name-small {
+        display: none;
+    }
+    .comparison-colors {
+        display: none !important;
+    }
+    .comparison {
+        grid-template-columns: repeat(3, 2fr) repeat(4, 1fr) !important;
+    }
+    .comparison-relations-count {
+        display: inline;
+    }
+    .comparison-relations-full {
+        display: none;
+    }
+}
+
+.tree-first-separator {
+    height: 14px !important;
+    top: 0 !important;
+}
+
+.tree-l0-separator {
+    display: inline-block;
+    width: 20px;
+    margin-left: 35px;
+    border-bottom: 1px solid white;
+    border-left: 1px solid white;
+    height: 26px;
+    position: relative;
+    top: -12px;
+}
+
+.tree-l1 .tree-l0-separator {
+    border-bottom: none !important;
+}
+
+.tree-l1-separator {
+    display: inline-block;
+    width: 20px;
+    margin-left: 35px;
+    border-bottom: 1px solid white;
+    border-left: 1px solid white;
+    height: 26px;
+    position: relative;
+    top: -12px;
+    left: -10px;
+}
+
+.tree-l1 .tree-l0-separator {
+    width: 30px;
+}
+
+.tree-l1 .tree-inner {
+    position: relative;
+    left: -10px;
+}
+
+.tree-l1 .tree-l0-separator {
+    border-bottom: none !important;
+}
+
+.tree-l2-separator {
+    display: inline-block;
+    width: 20px;
+    margin-left: 35px;
+    border-bottom: 1px solid white;
+    border-left: 1px solid white;
+    height: 26px;
+    position: relative;
+    top: -12px;
+    left: -10px;
+}
+
+.tree-l2 .tree-l1-separator {
+    width: 30px;
+}
+
+.tree-l2 .tree-l0-separator {
+    width: 30px;
+}
+
+.tree-l2 .tree-inner {
+    position: relative;
+    left: -10px;
+}
+
+.tree-inner {
+    display: inline-block;
+}
+
+.navbar-collapse.collapse.show, .navbar-collapse.collapsing {
+    background: black;
+    margin: 7px -12px;
+    padding: 0 12px;
+    border-bottom: 1px solid rgba(255, 255, 255, .25);
+}
+
+.rainbow-item:hover {
+    opacity: .75;
+}
+
+.rainbow-item:active {
+    opacity: .5;
+}
+
+peh-muted {
+    --bs-text-opacity: 1;
+    color: #6c757d!important;
+}
+
+.dropdown-toggle::after {
+    margin-bottom: -3px;
+}
+
+.navbar-nav {
+    width: 100%;
+}
+
+.card {
+    background-color: #111;
+    border: 1px solid rgba(255, 255, 255, .125);
+}
+
+#member-banner-container > #member-banner > #system-info {
+    border-bottom-right-radius: 0 !important;
+    border-bottom-left-radius: 0 !important;
+}
+
+#member-details {
+    background: rgba(255, 255, 255, .1);
+    border: 1px solid transparent;
+    border-top: none;
+    padding: 10px 20px;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 10px;
+    display: grid;
+    grid-template-columns: repeat(5, 1fr);
+    text-align: center;
+}
+
+.navbar-collapse.show {
+    z-index: 99999;
+}
+
+@media (max-width: 991px) {
+    div#member-details.member-details-loggedIn {
+        grid-template-columns: repeat(3, 1fr) !important;
+        text-align: center;
+    }
+
+    #member-details {
+        grid-template-columns: 1fr !important;
+        text-align: left;
+    }
+}
+
+@media (max-width: 767px) {
+    div#member-details.member-details-loggedIn {
+        grid-template-columns: repeat(2, 1fr) !important;
+        text-align: left;
+    }
+}
+
+.linked-card {
+    opacity: 1 !important;
+    color: white !important;
+    text-decoration: none !important;
+}
+
+.linked-card:hover {
+    opacity: .75 !important;
+}
+
+.linked-card:active {
+    opacity: .5 !important;
+}
+
+.navbar-brand {
+    position: relative;
+    z-index: 9999;
+}
+
+html, body {
+    overflow-x: hidden;
+}
\ No newline at end of file