#dev 2021-11-10

2021-11-10 UTC
Seirdy, kogepan_, nertzy, gRegor, rockorager, [tw2113_Slack_], maxwelljosly, maxwelljoslyn[d], gerben, ranuzz, kogepan, [pfefferle], squarepants, noobranu and tetov-irc joined the channel
#
Murray[d]
➡ from the main channel: @chrisbergr by the strokes above do you mean the double border around the main content window? I look at this design and I feel like it's all feasible today, probably using very similar techniques to the past: repeating patterns, split images (so that edges are fixed, but the middle grows and repeats to fill in). It's just now a lot of the edging would be done directly with CSS properties like `border` and `outlin
Abhas[m] joined the channel
#
[chrisbergr]
No, I'm talking about the background lines above the headline
#
Murray[d]
Do you mean this bit (hopes the image works via the bridge):
#
[chrisbergr]
Yes, exactly
#
[chrisbergr]
The only thing one can do to make this fluid is to have a background image ridiculous wide to cover 8k widescreen.
#
[chrisbergr]
*in my imagination - Maybe you have a better solution
squarepants joined the channel
#
Murray[d]
Yeah, I can see this working a couple of ways. The simplest would be just to use an image as a background and let the size of the window dictate how much is visible. A more ridiculous way would be to generate it directly via something like Canvas (it's "just" a repeating diagonal line pattern, with a gradient over the top, an opacity mask, and some randomised speckling/noise). I'd opt for the first myself
#
Murray[d]
But you wouldn't *want* that design to end up wide enough for an 8K resolution screen. The content area (the bit with the paper like background) wouldn't ever want to be larger than say `40rem` or so, because it's just wrapping content. It's the rest of the design that you would flex out
#
Murray[d]
Otherwise you're text would be really wide 😄
#
Murray[d]
Personally, I'd just reveal more of the photos scattered around on wider viewports, but I imagine there are a bunch of other ways you can utilise that negative space
#
[chrisbergr]
😄 of course. You should have 8-12 words in a line, not more.
#
[chrisbergr]
The entire content area has a pattern with vertical lines. And grungy edges. Bringing this together with variable width is also difficult, because with a 4px wide pattern the content area must always be divisible by 4, so that there are no strange overlaps.
#
Murray[d]
Yep, that's tricky. I'd still do the grungy edges as images, just like back in the day; set them as image borders and they'll grow/shrink to fit. The background of the area (the mottled paper) would likely need to be an image that is wide enough for large screens and just clips out for smaller screens. True, the vertical lines are an issue... but I'd separate them out as a layer of their own. Position that between the background and the tex
#
Murray[d]
In fact, you may be able to layer the backgrounds directly on a single element, but I'd need to test that out 😄
#
Murray[d]
Oh and to get that faded look on the vertical lines, a clipping mask could be applied. Again, a single preset mask would work fine here, or you could randomise it with CSS math functions or JS. Not something I've ever done, but should work
#
[chrisbergr]
Maybe the grunge edges can be done with clipping mask, too. And then add the shadow/dark edge as shadow as seen here: https://codepen.io/thebabydino/pen/BRROzw
rockorager, akevinhuang, chenghiz_, gRegor, [fluffy], squarepants, [schmarty] and johs1 joined the channel
#
capjamesg[d]
What is nostalgia?
#
Loqi
It looks like we don't have a page for "nostalgia" yet. Would you like to create it? (Or just say "nostalgia is ____", a sentence describing the term)
#
capjamesg[d]
Nostalgia is when someone reflects on the past, a feeling that some IndieWeb community members show with regard to older, more user-friendly websites.
kogepan_, johs1 and rockorager joined the channel
#
@lukedary
@TheGreenGreek deserves all the WebMentions. Great talk about something really practical for devs trying to capture more information about their content engagement.
(twitter.com/_/status/1458502326717661190)
#
@lukedary
@TheGreenGreek deserves all the WebMentions. Great talk about something really practical for devs trying to capture more information about their content engagement. #ConnectTech @connect_js @eleven_ty
(twitter.com/_/status/1458503813174808588)
#
@toddlibby
Terrific talk by @TheGreenGreek on Eleventy and webmentions. A lot of great stuff! #ConnectTech
(twitter.com/_/status/1458506459097051137)
rockorager, justache, johs1, kogepan_, inertia, inertia_, alex11 and tetov-irc joined the channel
#
inertia
copying q&a from #indieweb-chat for posterity:
#
inertia
<inertia> hi i'm new to indieweb. if i wanted to setup my own site for POSSE, are there distributed/decentralized/p2p options for hosting content as an alternative to using my own server or VPS?
#
inertia
[15:02:17] <inertia> maybe something like ipfs?
#
inertia
[15:05:33] <+[KevinMarks]> Dat/Hypercore might be easier if you're into that idea, as it has a browser designed to help you do that to some extent
#
inertia
[15:06:24] <+[KevinMarks]> you can also host content statically on cloud sites like github and heroku
#
inertia
[15:07:01] <[tantek]1> what is IPFS
#
inertia
[15:07:22] <[tantek]1> inertia, some folks have tried hosting content on IPFS, with inconsistent results.
#
inertia
[15:07:01] <@Loqi> IPFS is short for InterPlanetary File System, potentially a static site storage method using content based addressing https://indieweb.org/IPFS
#
inertia
[15:07:40] <[tantek]1> more details/examples on that page
#
inertia
[15:08:49] <[tantek]1> also totally on topic if you want to continue discussing in #indieweb-dev
#
inertia
[15:12:19] <inertia> [KevinMarks] i'd considered hosting somewhere like github or heroku but i like p2p better in theory. hopefully results will improve with time. i'll look into Dat as well.
#
inertia
[15:10:21] <inertia> [tantek]1 joined #indieweb-chat, should i copy this chat thread over there or just ask the same question again?
#
inertia
[15:16:51] <[tantek]1> inertia, since this channel is unlogged, yeah the etiquette is that if you want to repost in #indieweb-dev that's ok
#
[tantek]1
I should have said, repost your own chats, but yes I intended my responses to be ok to repost also. I'd guess KevinMarks did too
#
[KevinMarks]
yes, thats fine
inertia joined the channel
#
inertia
[tantek]1 oh sorry!
rockorager joined the channel
#
[tantek]1
no worries, my bad for not being clear