feat: tweak theme, move discord link (#2)
Security Scan and Upload / Security & DefectDojo Upload (push) Successful in 1m52s

### Explanation

_No response_

### Issue

Closes #1

### Attestations

- [ ] I have read and agree to the [Code of Conduct](https://docs.nhcarrigan.com/community/coc/)
- [ ] I have read and agree to the [Community Guidelines](https://docs.nhcarrigan.com/community/guide/).
- [ ] My contribution complies with the [Contributor Covenant](https://docs.nhcarrigan.com/dev/covenant/).

### Dependencies

- [ ] I have pinned the dependencies to a specific patch version.

### Style

- [ ] I have run the linter and resolved any errors.
- [ ] My pull request uses an appropriate title, matching the conventional commit standards.
- [ ] My scope of feat/fix/chore/etc. correctly matches the nature of changes in my pull request.

### Tests

- [ ] My contribution adds new code, and I have added tests to cover it.
- [ ] My contribution modifies existing code, and I have updated the tests to reflect these changes.
- [ ] All new and existing tests pass locally with my changes.
- [ ] Code coverage remains at or above the configured threshold.

### Documentation

_No response_

### Versioning

_No response_

Reviewed-on: #2
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
This commit was merged in pull request #2.
This commit is contained in:
2026-02-03 12:53:17 -08:00
committed by Naomi Carrigan
parent 9c4e64af09
commit 9eb2dcc482
3 changed files with 355 additions and 34 deletions
+353 -7
View File
@@ -118,7 +118,17 @@
.ui.card, .ui.card,
.ui.message, .ui.message,
.repository-summary, .repository-summary,
.activity-container { .activity-container,
.home,
.dashboard,
.user.dashboard,
.user.home,
.dashboard-navbar,
.feeds,
.feed,
.news,
.activity,
.heatmap {
color: var(--witch-purple); color: var(--witch-purple);
} }
@@ -134,6 +144,26 @@
p, li, label { p, li, label {
color: var(--witch-purple); color: var(--witch-purple);
} }
/* Dashboard and Home specific elements */
.dashboard .ui.header,
.home .ui.header,
.dashboard .description,
.home .description,
.dashboard-repos .name,
.dashboard-orgs .name,
.feeds .title,
.feeds .content,
.activity-bar-graph,
.activity-bar-graph text,
.activity-bar-graph .activity-bar-graph-label,
.contribution-calendar text,
.heatmap-day,
.milestone-list .content,
.issue-list .title,
.issue-list .desc {
color: var(--witch-purple) !important;
}
/* Table cells - but not in code views */ /* Table cells - but not in code views */
td:not(.lines-code td):not(.lines-num td), td:not(.lines-code td):not(.lines-num td),
@@ -193,14 +223,48 @@
/* Main Content - with margins for fixed nav/footer */ /* Main Content - with margins for fixed nav/footer */
body { body {
padding-top: 52px !important; padding-top: 52px !important;
padding-bottom: 75px !important; padding-bottom: 120px !important; /* Extra padding for footer clearance */
} }
.page-content, .home, .full.height { .page-content, .full.height {
background: transparent !important; background: transparent !important;
padding-top: 10px !important; padding-top: 10px !important;
padding-bottom: 10px !important; margin-bottom: 150px !important; /* Clear the footer with extra space */
min-height: calc(100vh - 145px) !important; min-height: calc(100vh - 127px) !important; /* 52px top + 75px footer */
}
/* Home page with custom hero section */
.page-content.home {
background: rgba(255, 255, 255, 0.85) !important;
backdrop-filter: blur(10px) !important;
border-radius: 15px !important;
margin: 20px 20px 150px 20px !important; /* Large bottom margin to clear footer */
padding: 30px 30px 30px 30px !important; /* No bottom padding extension */
box-shadow: 0 0 50px rgba(168, 87, 126, 0.15) !important;
}
/* Home page inner content wrapper */
.page-content.home .tw-mb-8,
.page-content.home > div:first-child {
background: transparent !important;
margin-bottom: 30px !important;
}
/* Ensure last element in home page has spacing */
.page-content.home > div:last-child,
.page-content.home .tw-px-8:last-child {
margin-bottom: 60px !important;
}
/* Dashboard page wrapper */
.page-content.dashboard,
.page-content.user.dashboard {
background: rgba(255, 255, 255, 0.85) !important;
backdrop-filter: blur(10px) !important;
border-radius: 15px !important;
margin: 20px 20px 150px 20px !important; /* Large bottom margin to clear footer */
padding: 30px 30px 30px 30px !important; /* No bottom padding extension */
box-shadow: 0 0 50px rgba(168, 87, 126, 0.15) !important;
} }
/* Main container backgrounds - TRANSLUCENT so background shows */ /* Main container backgrounds - TRANSLUCENT so background shows */
@@ -210,19 +274,80 @@
border-radius: 10px !important; border-radius: 10px !important;
padding: 20px !important; padding: 20px !important;
margin-top: 10px !important; margin-top: 10px !important;
margin-bottom: 10px !important; margin-bottom: 30px !important; /* Increased bottom margin */
box-shadow: 0 0 40px rgba(168, 87, 126, 0.15) !important; box-shadow: 0 0 40px rgba(168, 87, 126, 0.15) !important;
} }
/* Last container on page needs extra space */
.ui.container:last-child {
margin-bottom: 50px !important;
}
/* Grid columns should be transparent */ /* Grid columns should be transparent */
.ui.grid > .column, .ui.grid > .row > .column { .ui.grid > .column, .ui.grid > .row > .column {
background: transparent !important; background: transparent !important;
} }
/* Dashboard and Home specific background fixes */
.dashboard .ui.container,
.home .ui.container,
.user.dashboard .ui.container {
background: rgba(255, 255, 255, 0.85) !important;
backdrop-filter: blur(10px) !important;
}
/* Dashboard main content area */
.user.dashboard .ui.container,
.user.dashboard > .ui.container > .ui.stackable.grid {
background: transparent !important;
}
/* Dashboard content wrapper that needs background */
.user.dashboard .ui.container .column {
background: rgba(255, 255, 255, 0.9) !important;
backdrop-filter: blur(8px) !important;
border-radius: 10px !important;
padding: 20px !important;
margin: 5px !important;
}
/* Dashboard feed and activity sections */
.dashboard .feeds,
.home .news,
.dashboard .ui.segment,
.home .ui.segment,
.activity-feed-box {
background: rgba(255, 255, 255, 0.9) !important;
backdrop-filter: blur(8px) !important;
border-radius: 10px !important;
padding: 15px !important;
margin: 10px 0 !important;
box-shadow: 0 0 20px rgba(168, 87, 126, 0.1) !important;
}
/* Repository/user pages */ /* Repository/user pages */
.repository, .user { .repository, .user {
background: transparent !important; background: transparent !important;
} }
/* Dashboard and Home main wrappers need backgrounds */
.dashboard, .home,
.user.dashboard > .ui.container,
.dashboard > .ui.container {
position: relative;
}
/* Create background containers for dashboard/home */
.dashboard > .ui.container > .ui.grid,
.home > .ui.container > .ui.grid,
.dashboard .column.fluid,
.home .column.fluid {
background: rgba(255, 255, 255, 0.85) !important;
backdrop-filter: blur(10px) !important;
border-radius: 10px !important;
padding: 20px !important;
box-shadow: 0 0 30px rgba(168, 87, 126, 0.12) !important;
}
/* Header/Navigation - FIXED at top */ /* Header/Navigation - FIXED at top */
#navbar, .ui.top.secondary.menu.navbar { #navbar, .ui.top.secondary.menu.navbar {
@@ -257,6 +382,33 @@
#navbar .item i, #navbar .item svg, #navbar .item .icon { #navbar .item i, #navbar .item svg, #navbar .item .icon {
color: var(--witch-moon) !important; color: var(--witch-moon) !important;
} }
/* Special styling for Discord link in nav */
#navbar .discord-link,
#navbar a[href*="discord"],
#navbar a[href*="chat.nhcarrigan.com"] {
background: rgba(212, 165, 199, 0.2) !important;
border-radius: 8px !important;
padding: 8px 16px !important;
margin: 0 5px !important;
transition: all 0.3s ease !important;
}
#navbar .discord-link:hover,
#navbar a[href*="discord"]:hover,
#navbar a[href*="chat.nhcarrigan.com"]:hover {
background: rgba(212, 165, 199, 0.5) !important;
transform: translateY(-1px) !important;
box-shadow: 0 2px 10px rgba(168, 87, 126, 0.3) !important;
}
/* Discord icon if you use one */
#navbar .discord-link i,
#navbar a[href*="discord"] i,
#navbar a[href*="chat.nhcarrigan.com"] i {
color: var(--witch-lavender) !important;
margin-right: 5px !important;
}
/* Repository header */ /* Repository header */
.repository.header { .repository.header {
@@ -307,6 +459,20 @@
0 0 40px rgba(68, 39, 90, 0.05) !important; 0 0 40px rgba(68, 39, 90, 0.05) !important;
transition: all 0.3s ease; transition: all 0.3s ease;
} }
/* Dashboard specific cards and boxes */
.dashboard .ui.repository.list,
.dashboard .ui.user.list,
.dashboard .box,
.home .ui.repository.list,
.activity.tab,
.repositories.tab {
background: rgba(255, 255, 255, 0.9) !important;
backdrop-filter: blur(8px) !important;
border-radius: 8px !important;
padding: 15px !important;
margin: 10px 0 !important;
}
.ui.card:hover, .dashboard-card:hover { .ui.card:hover, .dashboard-card:hover {
transform: translateY(-2px); transform: translateY(-2px);
@@ -789,6 +955,7 @@
footer *, .page-footer * { footer *, .page-footer * {
color: var(--witch-moon) !important; color: var(--witch-moon) !important;
} }
footer a, .page-footer a { footer a, .page-footer a {
color: var(--witch-mauve) !important; color: var(--witch-mauve) !important;
@@ -937,4 +1104,183 @@
.ui.breadcrumb .divider { .ui.breadcrumb .divider {
color: var(--witch-mauve) !important; color: var(--witch-mauve) !important;
} }
/* Home page hero section */
.page-content.home .center,
.page-content.home .hero {
color: var(--witch-purple) !important;
}
.page-content.home .hero h1,
.page-content.home .hero h2 {
color: var(--witch-plum) !important;
}
.page-content.home .hero p,
.page-content.home .hero li {
color: var(--witch-purple) !important;
}
/* Ensure all home page text is visible */
.page-content.home p,
.page-content.home ul,
.page-content.home li,
.page-content.home h1,
.page-content.home h2 {
color: var(--witch-purple) !important;
}
/* Home page content wrapper needs bottom spacing */
.page-content.home .tw-mb-8 {
margin-bottom: 60px !important;
}
.page-content.home .center {
margin-bottom: 40px !important;
}
.page-content.home .hero {
margin-bottom: 40px !important;
}
/* Ensure home page has minimum height and proper spacing */
.page-content.home {
min-height: calc(100vh - 127px) !important;
margin-bottom: 150px !important; /* Clear footer without internal padding */
}
/* Universal bottom spacing for all page content */
.page-content > *:last-child {
margin-bottom: 40px !important;
}
/* Ensure no content is hidden behind footer */
.page-content {
margin-bottom: 150px !important;
}
/* Home page specific list spacing */
.page-content.home ul {
margin-bottom: 30px !important;
}
.page-content.home ul:last-child {
margin-bottom: 60px !important;
}
/* Force bottom clearance with pseudo-element */
.page-content::after {
content: "";
display: block;
height: 100px;
clear: both;
}
.page-content.home::after,
.page-content.dashboard::after {
height: 120px;
}
/* Tooltips and Hover Text */
.tooltip, .ui.tooltip, .ui.popup,
[data-tooltip]::after,
[data-tooltip]::before,
.tippy-box {
background: rgba(43, 27, 61, 0.95) !important;
color: var(--witch-moon) !important;
border: 1px solid var(--witch-mauve) !important;
box-shadow: 0 4px 20px rgba(168, 87, 126, 0.3) !important;
}
/* Tooltip arrows */
.tooltip::before, .ui.tooltip::before,
.ui.popup::before,
.tippy-arrow {
background: rgba(43, 27, 61, 0.95) !important;
border-color: var(--witch-mauve) !important;
}
/* Ensure tooltip text is visible */
.tooltip *, .ui.tooltip *,
.ui.popup *, .tippy-content,
[data-tooltip]::after {
color: var(--witch-moon) !important;
}
/* Hover states for elements with tooltips */
[data-tooltip]:hover::after,
[data-tooltip]:hover::before {
background: rgba(43, 27, 61, 0.95) !important;
color: var(--witch-moon) !important;
}
/* Title attributes on hover */
[title]:hover::after {
background: rgba(43, 27, 61, 0.95) !important;
color: var(--witch-moon) !important;
padding: 6px 10px !important;
border-radius: 6px !important;
border: 1px solid var(--witch-mauve) !important;
}
/* Semantic UI specific tooltip */
.ui.inverted.popup,
.ui.inverted.tooltip {
background: rgba(43, 27, 61, 0.98) !important;
color: var(--witch-moon) !important;
box-shadow: 0 6px 25px rgba(168, 87, 126, 0.4) !important;
}
.ui.inverted.popup::before {
background: rgba(43, 27, 61, 0.98) !important;
}
/* Dropdown hover items should also be readable */
.ui.dropdown .menu .item:hover {
background: var(--witch-lavender) !important;
color: var(--witch-purple) !important;
}
/* Hover cards and info boxes */
.hover-card, .hover-box,
.user-card, .repo-card,
.hover-info, .info-popup {
background: rgba(255, 255, 255, 0.98) !important;
color: var(--witch-purple) !important;
border: 2px solid var(--witch-mauve) !important;
box-shadow: 0 8px 30px rgba(168, 87, 126, 0.3) !important;
}
.hover-card *, .hover-box *,
.user-card *, .repo-card * {
color: var(--witch-purple) !important;
}
.hover-card a, .hover-box a,
.user-card a, .repo-card a {
color: var(--witch-rose) !important;
}
/* Gitea specific tooltips */
.tippy-box[data-theme="tooltip"] {
background: rgba(43, 27, 61, 0.95) !important;
color: var(--witch-moon) !important;
}
.tippy-box[data-theme="tooltip"] .tippy-content {
color: var(--witch-moon) !important;
}
/* Activity heatmap tooltips */
.activity-heatmap .tooltip,
.heatmap .tooltip,
.contribution-tooltip {
background: rgba(43, 27, 61, 0.95) !important;
color: var(--witch-moon) !important;
border: 1px solid var(--witch-rose) !important;
padding: 8px 12px !important;
border-radius: 6px !important;
}
/* Footer dropdown styling removed - no longer needed */
-26
View File
@@ -1,37 +1,11 @@
<footer class="page-footer" role="group" aria-label="{{ctx.Locale.Tr "aria.footer"}}"> <footer class="page-footer" role="group" aria-label="{{ctx.Locale.Tr "aria.footer"}}">
<p>&copy; <a href="https://nhcarrigan.com" target="_blank">Naomi Carrigan</a></p> <p>&copy; <a href="https://nhcarrigan.com" target="_blank">Naomi Carrigan</a></p>
<button id="show-socials-button" type="button">
<i class="fa-solid fa-share-nodes"></i> Connect with Us
</button>
<a href="https://buy.stripe.com/cN24iTfqu1j6b3afZ2" target="_blank" rel="noreferrer"> <a href="https://buy.stripe.com/cN24iTfqu1j6b3afZ2" target="_blank" rel="noreferrer">
<img src="https://cdn.nhcarrigan.com/donate.png" alt="Donate" style="width: 70px; height: 70px;"> <img src="https://cdn.nhcarrigan.com/donate.png" alt="Donate" style="width: 70px; height: 70px;">
</a> </a>
<div id="tree-nation-offset-website"></div> <div id="tree-nation-offset-website"></div>
<div id="social-list">
<div class="social-list-item">
<a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer">
<i class="fa-brands fa-discord"></i><span>Join our Discord~!</span>
</a>
</div>
</div>
</footer> </footer>
<script>
// Use a self-invoking function or check for DOM presence to avoid scope issues
(function() {
const showSocialsButton = document.querySelector("#show-socials-button");
const socialList = document.querySelector("#social-list");
if (showSocialsButton && socialList) {
showSocialsButton.addEventListener("click", () => {
const isVisible = socialList.style.display === "block";
socialList.style.display = isVisible ? "none" : "block";
showSocialsButton.setAttribute("aria-expanded", !isVisible);
});
}
})();
</script>
<script src="https://widgets.tree-nation.com/js/widgets/v1/widgets.min.js?v=1.0"></script> <script src="https://widgets.tree-nation.com/js/widgets/v1/widgets.min.js?v=1.0"></script>
<script> <script>
// TreeNation Logic // TreeNation Logic
+2 -1
View File
@@ -1 +1,2 @@
<a class="item" href="{{AppSubUrl}}/nhcarrigan">Public Repositories</a> <a class="item" href="{{AppSubUrl}}/nhcarrigan">Public Repositories</a>
<a class="item" href="https://chat.nhcarrigan.com"><i class="fa-brands fa-discord"></i> Discord</a>