Compare commits

..

No commits in common. "278f32a2fa16eb7b96e54a79e5264df615b55de5" and "170eae1b097acdcadacd98860ae366e38ab1c246" have entirely different histories.

6 changed files with 14 additions and 56 deletions

View File

@ -270,10 +270,7 @@
</div> </div>
</div> </div>
<div <div class="expand-container">
v-if="showExpand"
class="expand-container"
>
<button <button
type="button" type="button"
class="expand" class="expand"
@ -301,30 +298,12 @@ import { formatDate } from '#/utils/format.js';
const expanded = ref(false); const expanded = ref(false);
const props = defineProps({ defineProps({
actor: { actor: {
type: Object, type: Object,
default: null, default: null,
}, },
}); });
// if the profile is empty, the expand button overlaps the header
const showExpand = [
'age',
'bust',
'cup',
'eyes',
'hairColor',
'hasPiercings',
'hasTattoos',
'height',
'hip',
'naturalBoobs',
'origin',
'residence',
'waist',
'weight',
].some((attribute) => !!props.actor[attribute]);
</script> </script>
<style> <style>
@ -585,7 +564,6 @@ const showExpand = [
display: none; display: none;
justify-content: center; justify-content: center;
position: absolute; position: absolute;
z-index: 1;
bottom: -.75rem; bottom: -.75rem;
} }
@ -638,15 +616,8 @@ const showExpand = [
} }
@media(--compact) { @media(--compact) {
.profile { .profile .avatar-container {
.avatar-container { display: none;
display: none;
}
&.with-avatar {
height: auto;
max-height: 18rem;
}
} }
.actor-content { .actor-content {

View File

@ -420,7 +420,6 @@ function blurSearch(event) {
.icon { .icon {
display: none; display: none;
height: 1rem;
padding: 0; padding: 0;
fill: var(--text-light); fill: var(--text-light);
} }
@ -515,5 +514,9 @@ function blurSearch(event) {
.logo { .logo {
margin-right: .75rem; margin-right: .75rem;
} }
.userpanel {
padding-left: 1rem;
}
} }
</style> </style>

View File

@ -70,14 +70,12 @@ function getPath(targetDomain) {
.stash { .stash {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow: hidden;
} }
.header { .header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
position: sticky;
top: 0;
z-index: 1;
padding: .5rem 1rem; padding: .5rem 1rem;
color: var(--text-light); color: var(--text-light);
background: var(--grey-dark-40); background: var(--grey-dark-40);
@ -120,11 +118,8 @@ function getPath(targetDomain) {
.domains { .domains {
display: flex; display: flex;
justify-content: center;
gap: .5rem; gap: .5rem;
padding: .5rem 1rem; padding: .5rem 1rem;
background: var(--background-base-10);
border-bottom: solid 1px var(--shadow-weak-40);
} }
.domain { .domain {

4
package-lock.json generated
View File

@ -1,11 +1,11 @@
{ {
"name": "traxxx-web", "name": "traxxx-web",
"version": "0.23.7", "version": "0.23.6",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"version": "0.23.7", "version": "0.23.6",
"dependencies": { "dependencies": {
"@brillout/json-serializer": "^0.5.8", "@brillout/json-serializer": "^0.5.8",
"@dicebear/collection": "^7.0.5", "@dicebear/collection": "^7.0.5",

View File

@ -77,5 +77,5 @@
"postcss-custom-media": "^10.0.2", "postcss-custom-media": "^10.0.2",
"postcss-nesting": "^12.0.2" "postcss-nesting": "^12.0.2"
}, },
"version": "0.23.7" "version": "0.23.6"
} }

View File

@ -35,10 +35,7 @@
<div class="content"> <div class="content">
<Bio :actor="actor" /> <Bio :actor="actor" />
<div <div class="photos nobar">
class="photos nobar"
:class="{ 'has-avatar': actor.avatar, 'has-photos': actor.avatar ? photos.length > 1 : photos.length > 0 }"
>
<img <img
v-for="photo in photos" v-for="photo in photos"
:key="`photo-${photo.id}`" :key="`photo-${photo.id}`"
@ -96,7 +93,7 @@ const photos = [
align-items: center; align-items: center;
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 2; z-index: 1;
color: var(--highlight-strong-30); color: var(--highlight-strong-30);
background: var(--grey-dark-40); background: var(--grey-dark-40);
} }
@ -133,10 +130,6 @@ const photos = [
border-bottom: solid 1px var(--shadow-weak-40); border-bottom: solid 1px var(--shadow-weak-40);
background: var(--background-base-10); background: var(--background-base-10);
overflow-x: auto; overflow-x: auto;
&:not(.has-photos) {
display: none;
}
} }
.photo { .photo {
@ -154,10 +147,6 @@ const photos = [
} }
@media(--compact) { @media(--compact) {
.photos.has-avatar {
display: flex;
}
.photo.avatar { .photo.avatar {
display: inline-block; display: inline-block;
} }