trent_larson
/
crowd-funder-for-time-pwa
4
1
Fork 2
Code Issues Pull Requests 21 Releases 5 Wiki Activity
Browse Source

Merge pull request 'feat: disable zoom and fix iOS viewport issues' (#206) from ios-disable-zoom into master 

Reviewed-on: https://gitea.anomalistdesign.com/trent_larson/crowd-funder-for-time-pwa/pulls/206
meeting-members-admission-improvements
Jose Olarte 3 4 weeks ago
parent
d9f9460be7 5256681089
commit
b0d13b3cd4
9 changed files with 55 additions and 22 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      index.html
  2. 18
      src/assets/styles/tailwind.css
  3. 7
      src/components/ActivityListItem.vue
  4. 2
      src/components/ContactListItem.vue
  5. 11
      src/views/ClaimView.vue
  6. 2
      src/views/DIDView.vue
  7. 4
      src/views/DiscoverView.vue
  8. 21
      src/views/ProjectViewView.vue
  9. 8
      src/views/ProjectsView.vue

4
index.html
View File

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, user-scalable=no, interactive-widget=overlays-content" />
<!-- CORS headers removed to allow images from any domain -->
@ -13,4 +13,4 @@
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>
</html>

18
src/assets/styles/tailwind.css
View File

@ -7,6 +7,24 @@
html {
font-family: 'Work Sans', ui-sans-serif, system-ui, sans-serif !important;
}
/* Fix iOS viewport height changes when keyboard appears/disappears */
html, body {
height: 100%;
height: 100vh;
height: 100dvh; /* Dynamic viewport height for better mobile support */
overflow: hidden; /* Disable all scrolling on html and body */
position: fixed; /* Force fixed positioning to prevent viewport changes */
width: 100%;
top: 0;
left: 0;
}
#app {
height: 100vh;
height: 100dvh;
overflow-y: auto;
}
}
@layer components {

7
src/components/ActivityListItem.vue
View File

@ -78,8 +78,11 @@
</div>
<!-- Description -->
<p class="font-medium">
<a class="cursor-pointer" @click="emitLoadClaim(record.jwtId)">
<p class="font-medium overflow-hidden">
<a
class="block cursor-pointer overflow-hidden text-ellipsis"
@click="emitLoadClaim(record.jwtId)"
>
<vue-markdown
:source="truncatedDescription"
class="markdown-content"

2
src/components/ContactListItem.vue
View File

@ -46,7 +46,7 @@
<span class="text-xs truncate">{{ contact.did }}</span>
</div>
<div class="text-sm">
<div class="text-sm truncate">
{{ contact.notes }}
</div>
</div>

11
src/views/ClaimView.vue
View File

@ -88,19 +88,22 @@
</button>
</div>
</div>
<div class="text-sm">
<div data-testId="description">
<div class="text-sm overflow-hidden">
<div
data-testId="description"
class="overflow-hidden text-ellipsis"
>
<font-awesome icon="message" class="fa-fw text-slate-400" />
<vue-markdown
:source="claimDescription"
class="markdown-content"
/>
</div>
<div>
<div class="overflow-hidden text-ellipsis">
<font-awesome icon="user" class="fa-fw text-slate-400" />
{{ didInfo(veriClaim.issuer) }}
</div>
<div>
<div class="overflow-hidden text-ellipsis">
<font-awesome icon="calendar" class="fa-fw text-slate-400" />
Recorded
{{ formattedIssueDate }}

2
src/views/DIDView.vue
View File

@ -34,7 +34,7 @@
class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4"
>
<div>
<h2 class="text-xl font-semibold">
<h2 class="text-xl font-semibold overflow-hidden text-ellipsis">
{{ contactFromDid?.name || "(no name)" }}
<router-link
:to="{ name: 'contact-edit', params: { did: contactFromDid?.did } }"

4
src/views/DiscoverView.vue
View File

@ -282,8 +282,8 @@
/>
</div>
<div class="grow">
<h2 class="text-base font-semibold">
<div class="grow overflow-hidden">
<h2 class="text-base font-semibold truncate">
{{ project.name || unnamedProject }}
</h2>
<div class="text-sm">

21
src/views/ProjectViewView.vue
View File

@ -28,7 +28,7 @@
<font-awesome icon="question" class="block text-center w-[1em]" />
</router-link>
</div>
<h2 class="text-center text-lg font-normal">
<h2 class="text-center text-lg font-normal overflow-hidden text-ellipsis">
{{ name }}
<button
v-if="activeDid === issuer || activeDid === agentDid"
@ -157,7 +157,7 @@
</div>
<div class="text-sm text-slate-500">
<div v-if="!expanded">
<div v-if="!expanded" class="overflow-hidden text-ellipsis">
<vue-markdown
:source="truncatedDesc"
class="mb-4 markdown-content"
@ -169,7 +169,7 @@
>... Read More</a
>
</div>
<div v-else>
<div v-else class="overflow-hidden text-ellipsis">
<vue-markdown :source="description" class="mb-4 markdown-content" />
<a
v-if="description.length >= truncateLength"
@ -308,7 +308,10 @@
/>{{ offer.amount }}
</span>
</div>
<div v-if="offer.objectDescription" class="text-slate-500">
<div
v-if="offer.objectDescription"
class="text-slate-500 overflow-hidden text-ellipsis"
>
<font-awesome icon="comment" class="fa-fw text-slate-400" />
{{ offer.objectDescription }}
</div>
@ -450,7 +453,10 @@
<font-awesome icon="calendar" class="fa-fw text-slate-400" />
{{ give.issuedAt?.substring(0, 10) }}
</div>
<div v-if="give.description" class="text-slate-500">
<div
v-if="give.description"
class="text-slate-500 overflow-hidden text-ellipsis"
>
<font-awesome icon="comment" class="fa-fw text-slate-400" />
{{ give.description }}
</div>
@ -557,7 +563,10 @@
<font-awesome icon="calendar" class="fa-fw text-slate-400" />
{{ give.issuedAt?.substring(0, 10) }}
</div>
<div v-if="give.description" class="text-slate-500">
<div
v-if="give.description"
class="text-slate-500 overflow-hidden text-ellipsis"
>
<font-awesome icon="comment" class="fa-fw text-slate-400" />
{{ give.description }}
</div>

8
src/views/ProjectsView.vue
View File

@ -118,8 +118,8 @@
/>
</div>
<div>
<div>
<div class="overflow-hidden">
<div class="text-sm truncate">
To
{{
offer.fulfillsPlanHandleId
@ -132,7 +132,7 @@
)
}}
</div>
<div>
<div class="truncate">
{{ offer.objectDescription }}
</div>
@ -254,7 +254,7 @@
</div>
<div class="grow overflow-hidden">
<h2 class="text-base font-semibold">
<h2 class="text-base font-semibold truncate">
{{ project.name || unnamedProject }}
</h2>
<div class="text-sm truncate">

Write Preview
Loading…
Cancel
Save