Compare commits

..

3 Commits

Author SHA1 Message Date
9429957f6c OrcasHub: Replace footer
Some checks failed
CodeQL Advanced / Analyze (javascript-typescript) (push) Failing after 23s
2025-04-11 17:35:17 -07:00
2a939429f0 OrcasHub: Update header links 2025-04-11 17:35:17 -07:00
2a642a0fd4 OrcasHub: Disable dark theme 2025-04-11 16:59:11 -07:00
4 changed files with 167 additions and 37 deletions

View File

@ -107,6 +107,88 @@ nav {
background-image: none !important;
}
/* Update footer styles */
footer {
background-color: #1f2937 !important;
@media (min-width: 768px) {
.inner-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
.inner-grid-second-row {
margin-top: 0 !important;
}
}
@media (min-width: 640px) {
.outer-container {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
}
@media (min-width: 1024px) {
.outer-container {
padding-left: 2rem;
padding-right: 2rem;
padding-top: 4rem;
padding-bottom: 4rem;
}
.outer-grid {
grid-column: span 4 / span 4;
}
}
.outer-container {
padding-left: 1rem;
padding-right: 1rem;
padding-top: 3rem;
padding-bottom: 3rem;
max-width: 80rem;
margin: 0 auto;
}
.outer-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
.inner-grid-second-row {
margin-top: 3rem;
}
h3 {
font-weight: 500;
font-size: 1rem;
line-height: 1.5rem;
color: #ffffff;
}
ul {
padding-left: 0 !important;
}
li {
list-style: none;
margin-left: 0 !important;
}
a {
color: #d1d5db !important;
font-size: 1rem;
line-height: 1.5rem;
text-decoration: none;
}
a:hover {
color: #ffffff;
}
}
li {
margin-left: 10px;
}

View File

@ -1,33 +1,81 @@
<template lang="pug">
v-footer(aria-label='Footer')
v-dialog(v-model='showFollowMe' destroy-on-close max-width='700px' :fullscreen='$vuetify.breakpoint.xsOnly')
FollowMe(@close='showFollowMe=false' is-dialog)
v-btn.ml-1(v-for='link in footerLinks'
:key='link.label' color='primary' text
:href='link.href' :to='link.to' :target="link.href && '_blank'") {{link.label}}
v-menu(v-if='settings.enable_federation && trusted_sources?.length' max-height=550
offset-y bottom transition="slide-y-transition")
template(v-slot:activator="{ on, attrs }")
v-btn.ml-1(v-bind='attrs' v-on='on' color='primary' text) {{ settings.trusted_sources_label || $t('admin.trusted_sources_label_default')}}
v-list(subheaders two-lines max-width=550)
v-list-item(v-for='instance in trusted_sources'
:key='instance.ap_id'
target='_blank'
:href='instance?.object?.url ?? instance?.ap_id'
two-line)
v-list-item-avatar
v-img(:src='instance?.object?.icon?.url ?? `${instance.url}/favicon.ico`')
v-list-item-content
v-list-item-title {{ instance?.object?.name ?? instance?.object?.preferredUsername }}
v-list-item-subtitle {{ instance?.object?.summary ?? instance?.instance?.data?.metadata?.nodeDescription }}
v-btn.ml-1(v-if='settings.enable_federation' color='primary' text rel='me' @click.prevent='showFollowMe=true') {{$t('event.interact_with_me')}}
v-spacer
v-btn(color='primary' text href='https://gancio.org' target='_blank' rel="noopener") Gancio <small>{{settings.version}}</small>
<template>
<footer>
<div class="outer-container">
<div class="outer-grid">
<div class="inner-grid">
<div>
<h3>Classifieds</h3>
<ul>
<li>
<a href="/classified/for-sale">For Sale</a>
</li>
<li>
<a href="/classified/for-free">For Free</a>
</li>
<li>
<a href="/classified/want-to-buy">Looking For</a>
</li>
<li>
<a href="/classified/want-to-borrow">Want to Borrow</a>
</li>
<li>
<a href="/classified/new">New Post</a>
</li>
</ul>
</div>
<div class="inner-grid-second-row">
<h3>Housing</h3>
<ul>
<li>
<a href="/housing">For Rent</a>
</li>
<li>
<a href="/housing">Requests</a>
</li>
<li>
<a href="/housing/new">New Post</a>
</li>
</ul>
</div>
</div>
<div class="inner-grid">
<div>
<h3>San Juan Islands</h3>
<ul>
<li>
<a href="https://groups.orcashub.org" target="_blank">Groups</a>
</li>
<li>
<a href="/events">Events</a>
</li>
<li>
<a href="https://sanjuans.online/" target="_blank"
>San Juans Online</a
>
</li>
</ul>
</div>
<div class="inner-grid-second-row">
<h3>About</h3>
<ul>
<li>
<a href="/faq">FAQ</a>
</li>
<li>
<a href="/terms-of-service">Terms of Service</a>
</li>
<li>
<a href="/privacy-policy">Privacy Policy</a>
</li>
<li>
<a href="/donate">Donate</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</footer>
</template>
<script>
import { mapState } from 'vuex'

View File

@ -2,19 +2,19 @@
<div class="d-flex pa-4 navbar">
<ul>
<li>
<a href="/">Home</a>
<a href="https://orcashub.org">Home</a>
</li>
<li>
<a href="/classified/for-sale">Classifieds</a>
<a href="https://orcashub.org/classified/for-sale">Classifieds</a>
</li>
<li class="active">
<a href="/events">Events</a>
<a href="/">Events</a>
</li>
<li>
<a href="https://groups.orcashub.org">Groups</a>
</li>
<li>
<a href="/community-resources">Resources</a>
<a href="https://orcashub.org/community-resources">Resources</a>
</li>
</ul>
@ -42,7 +42,7 @@
<v-list-item-title>Classifieds</v-list-item-title>
</v-list-item>
<v-list-item class="active">
<v-list-item class="active" nux to="/">
<v-list-item-title>Events</v-list-item-title>
</v-list-item>

View File

@ -28,7 +28,7 @@ export const state = () => ({
trusted_sources_label: '',
footerLinks: [],
hide_thumbs: false,
'theme.is_dark': true,
'theme.is_dark': false,
hide_calendar: false
},
filter: {
@ -46,7 +46,7 @@ export const getters = {
return (![true, false].includes(state.localSettings['hide_thumbs'])) ? state.settings.hide_thumbs : state.localSettings.hide_thumbs
},
is_dark (state) {
return (![true, false].includes(state.localSettings['theme.is_dark'])) ? state.settings['theme.is_dark'] : state.localSettings['theme.is_dark']
return false
}
}