mirror of
https://github.com/omnivore-app/omnivore.git
synced 2026-03-11 08:54:26 +00:00
stub in grid feed card wireframe
This commit is contained in:
parent
0a9d06efb1
commit
e8873ad5f4
2 changed files with 65 additions and 35 deletions
|
|
@ -39,18 +39,19 @@ struct GridCardNavigationLink: View {
|
|||
|
||||
@ObservedObject var viewModel: HomeFeedViewModel
|
||||
var body: some View {
|
||||
NavigationLink(
|
||||
destination: LinkItemDetailView(viewModel: LinkItemDetailViewModel(item: item)),
|
||||
tag: item,
|
||||
selection: $selectedLinkItem
|
||||
) {
|
||||
EmptyView()
|
||||
ZStack {
|
||||
NavigationLink(
|
||||
destination: LinkItemDetailView(viewModel: LinkItemDetailViewModel(item: item)),
|
||||
tag: item,
|
||||
selection: $selectedLinkItem
|
||||
) {
|
||||
GridCard(item: item)
|
||||
}
|
||||
// .opacity(0)
|
||||
// .buttonStyle(PlainButtonStyle())
|
||||
.onAppear {
|
||||
viewModel.itemAppeared(item: item, searchQuery: searchQuery, dataService: dataService)
|
||||
}
|
||||
}
|
||||
.opacity(0)
|
||||
.buttonStyle(PlainButtonStyle())
|
||||
.onAppear {
|
||||
viewModel.itemAppeared(item: item, searchQuery: searchQuery, dataService: dataService)
|
||||
}
|
||||
GridCard(item: item)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -57,42 +57,71 @@ public struct GridCard: View {
|
|||
}
|
||||
|
||||
public var body: some View {
|
||||
HStack(alignment: .top, spacing: 6) {
|
||||
VStack(alignment: .leading, spacing: 6) {
|
||||
Text(item.title)
|
||||
.font(.appSubheadline)
|
||||
.foregroundColor(.appGrayTextContrast)
|
||||
.lineLimit(2)
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
VStack(alignment: .leading, spacing: 16) {
|
||||
// Progress Bar
|
||||
ProgressView(value: Double.random(in: 0 ... 1))
|
||||
.foregroundColor(.appYellow48)
|
||||
.frame(maxWidth: .infinity, alignment: .leading)
|
||||
|
||||
if let author = item.author {
|
||||
Text("By \(author)")
|
||||
.font(.appCaption)
|
||||
.foregroundColor(.appGrayText)
|
||||
// Title, Subtitle, Menu Button
|
||||
VStack(alignment: .leading, spacing: 6) {
|
||||
HStack {
|
||||
Text(item.title)
|
||||
.font(.appSubheadline)
|
||||
.foregroundColor(.appGrayTextContrast)
|
||||
.lineLimit(1)
|
||||
Spacer()
|
||||
Button(
|
||||
action: { print("grid button tapped") },
|
||||
label: { Image.profile }
|
||||
)
|
||||
}
|
||||
|
||||
if let publisherURL = item.publisherHostname {
|
||||
Text(publisherURL)
|
||||
.font(.appCaption)
|
||||
.foregroundColor(.appGrayText)
|
||||
.underline()
|
||||
.lineLimit(1)
|
||||
HStack {
|
||||
if let author = item.author {
|
||||
Text("by \(author)")
|
||||
.font(.appCaption)
|
||||
.foregroundColor(.appGrayText)
|
||||
.lineLimit(1)
|
||||
}
|
||||
|
||||
if let publisherURL = item.publisherHostname {
|
||||
Text(publisherURL)
|
||||
.font(.appCaption)
|
||||
.foregroundColor(.appGrayText)
|
||||
.underline()
|
||||
.lineLimit(1)
|
||||
}
|
||||
|
||||
Spacer()
|
||||
}
|
||||
}
|
||||
.frame(maxWidth: .infinity)
|
||||
.multilineTextAlignment(.leading)
|
||||
.padding(0)
|
||||
.frame(height: 40)
|
||||
|
||||
// Description, Image
|
||||
HStack {
|
||||
Text(item.description ?? "No description")
|
||||
.font(.appSubheadline)
|
||||
.foregroundColor(.appGrayTextContrast)
|
||||
.lineLimit(nil)
|
||||
|
||||
Spacer()
|
||||
|
||||
Group {
|
||||
if let imageURL = item.imageURL {
|
||||
AsyncImage(url: imageURL, isResizable: true)
|
||||
.aspectRatio(1, contentMode: .fill)
|
||||
.frame(width: 80, height: 80)
|
||||
.frame(width: 135, height: 90)
|
||||
.cornerRadius(6)
|
||||
}
|
||||
}
|
||||
.frame(height: 140)
|
||||
|
||||
// Labels
|
||||
HStack {
|
||||
Text("Label 1")
|
||||
Text("Label 2")
|
||||
Spacer()
|
||||
}
|
||||
}
|
||||
.frame(maxWidth: .infinity, minHeight: 100, idealHeight: 100, maxHeight: 100)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue