Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Revamped my personal GitHub profile readme! 🎉 I’ve made a fully responsive website inside an SVG, loaded as an image, using HTML, inside markdown, inside a readme​.md. Not only is it interactive and supports light/dark mode, but it also includes a fallback for Firefox😂#github

terkelg's profile picture

Terkel

3,608 subscribers

395,569 görüntüleme • 2 yıl önce •via X (Twitter)

EğitimBilim & TeknolojiKomedi#github
LIVE

Anya Rossi• Live Now

Private livecam show

10 Yorum

Terkel Gjervig profil fotoğrafı
Terkel Gjervig2 yıl önce

The animated contribution graph reflects actual data and is updated twice daily with GitHub Actions.

Terkel Gjervig profil fotoğrafı
Terkel Gjervig2 yıl önce

It even works in the GitHub iOS app 🤷

Terkel Gjervig profil fotoğrafı
Terkel Gjervig2 yıl önce

I love undertaking these kinds of absurd projects as they are an exercise in finding creative solutions to technical limitations.

Terkel Gjervig profil fotoğrafı
Terkel Gjervig2 yıl önce

Take a peek at the project and grab the source code from my GitHub: Heads up, though – no promises it'll play nice with every browser or device out there!

Neil Pullman profil fotoğrafı
Neil Pullman2 yıl önce

webdev is over. I’m strictly readmedev in 2024

Terkel Gjervig profil fotoğrafı
Terkel Gjervig2 yıl önce

Haha 😂

andrew‏ profil fotoğrafı
andrew‏2 yıl önce

GitHub final boss

Terkel Gjervig profil fotoğrafı
Terkel Gjervig2 yıl önce

😂

EGOIST profil fotoğrafı
EGOIST2 yıl önce

When is this SVG based frontend framework gonna be released 🤤

Terkel Gjervig profil fotoğrafı
Terkel Gjervig2 yıl önce

Hold my beer ....

Benzer Videolar

Made entirely inside Wonder! Here's how we did it: We used the SVG generation model from QuiverAI for the lettering, added a shader effect from the shaders library, and turned it into an interactive poster.
0:34

Made entirely inside Wonder! Here's how we did it: We used the SVG generation model from QuiverAI for the lettering, added a shader effect from the shaders library, and turned it into an interactive poster.

Wonder

14,887 görüntüleme • 2 ay önce

I will be gone all day but I put together an air conditioning system for Bruiser. He also has a fully covered patio and a couch blanket fort cave with ice blocks inside it.
1:01

I will be gone all day but I put together an air conditioning system for Bruiser. He also has a fully covered patio and a couch blanket fort cave with ice blocks inside it.

Jennifer 🟥🔴🧙‍♀️🦉🐈‍⬛ 🦖

17,128 görüntüleme • 2 ay önce

Designers, stop manually designing your website for mobile devices. → Instead, go to Framer → Prepare your design on desktop only. → Select your layout and switch to Agent. → And enter the prompt below → Get a mobile and tablet view instantly → Tweak it inside the chat → And preview as a fully responsive site
0:27

Designers, stop manually designing your website for mobile devices. → Instead, go to Framer → Prepare your design on desktop only. → Select your layout and switch to Agent. → And enter the prompt below → Get a mobile and tablet view instantly → Tweak it inside the chat → And preview as a fully responsive site

Abraham John 🦄🦓

16,372 görüntüleme • 2 ay önce

3. Project Starline is now Google Beam Originally a 3D video chat booth, it has been rebranded as Google Beam and will soon launch inside an HP-branded device, using a light field display and six cameras to create a 3D image of the person you’re chatting with on a video call.
1:22

3. Project Starline is now Google Beam Originally a 3D video chat booth, it has been rebranded as Google Beam and will soon launch inside an HP-branded device, using a light field display and six cameras to create a 3D image of the person you’re chatting with on a video call.

Gina Acosta

36,811 görüntüleme • 1 yıl önce

SparseBox+ v0.1 is out now! Only for iOS 16.0 - 26.1. Download: I took Duy Tran's SparseBox and wrapped it in a much more proper UI! Also included are some extra QoL features. Please read the readme for an important disclaimer regarding StikDebug!
0:34

SparseBox+ v0.1 is out now! Only for iOS 16.0 - 26.1. Download: I took Duy Tran's SparseBox and wrapped it in a much more proper UI! Also included are some extra QoL features. Please read the readme for an important disclaimer regarding StikDebug!

lunginspector

40,669 görüntüleme • 8 ay önce

It’s not my birthday but it IS a special day! I’ve got a finished BOOK to show off to you, with: - an embarrassing photo of young me - a cheeky image of a playing card - and a very personal dedication
2:08

It’s not my birthday but it IS a special day! I’ve got a finished BOOK to show off to you, with: - an embarrassing photo of young me - a cheeky image of a playing card - and a very personal dedication

Lucy Worsley

32,429 görüntüleme • 1 ay önce

Introducing React Native Enriched Markdown – a new React Native Enriched package by Gregory Moskaliuk! 🚀 It’s a fully native Markdown renderer for React Native that makes Markdown content feel like a first-class part of your app’s UI. ⚡ Purely native performance – lightning-fast parsing with md4c and 100% native text components ✨ Native text & image interactions (select, copy, translate, save, etc.) 📝 Smart rich-text copy (HTML/RTF) + “Copy as Markdown” option 🔗 GitHub link in the 🧵. If you find it useful, a ⭐would mean a lot!
0:57

Introducing React Native Enriched Markdown – a new React Native Enriched package by Gregory Moskaliuk! 🚀 It’s a fully native Markdown renderer for React Native that makes Markdown content feel like a first-class part of your app’s UI. ⚡ Purely native performance – lightning-fast parsing with md4c and 100% native text components ✨ Native text & image interactions (select, copy, translate, save, etc.) 📝 Smart rich-text copy (HTML/RTF) + “Copy as Markdown” option 🔗 GitHub link in the 🧵. If you find it useful, a ⭐would mean a lot!

Software Mansion

26,869 görüntüleme • 8 ay önce

The GitHub Copilot CLI is wild. I've never built an iOS app before, but I wanted something that would store my TODO's as GitHub Issues. A few minutes later built it and then talked me through getting it deployed to my phone - INCLUDING setting up oauth login 🤯
1:38

The GitHub Copilot CLI is wild. I've never built an iOS app before, but I wanted something that would store my TODO's as GitHub Issues. A few minutes later built it and then talked me through getting it deployed to my phone - INCLUDING setting up oauth login 🤯

Martin Woodward

120,377 görüntüleme • 8 ay önce

"Reading is my biggest hobby." President Xi Jinping is known as an avid reader. He not only has a deep personal passion for reading but also actively encourages people to embrace it as well. #XiJinping #XiQuotes #WorldBookDay
0:28

"Reading is my biggest hobby." President Xi Jinping is known as an avid reader. He not only has a deep personal passion for reading but also actively encourages people to embrace it as well. #XiJinping #XiQuotes #WorldBookDay

Xi's Moments

107,202 görüntüleme • 4 ay önce

This is my go-to squat routine. It supports the squat, but it’s also a full practice on its own. Everything happens inside the position. That’s where control, range, and options are built. Save it, practice it.
0:52

This is my go-to squat routine. It supports the squat, but it’s also a full practice on its own. Everything happens inside the position. That’s where control, range, and options are built. Save it, practice it.

Cardio Arena

106,247 görüntüleme • 8 ay önce

007/100 Buttons. This button was way more complex than I first thought. I love the page transition on the Truus site that Dennis Snellenberg and Jordan Gilroy worked on. So I wanted to use that drawing SVG Path idea somehow and fit it into a button. In best case with a mask effect. The idea was to have an SVG path in the background that fills the button. At the same time, this path should also be used as a mask to reveal the differently colored text. The SVG should also be replaceable and work with other SVGs. For the path animation, I can use the DrawSVGPlugin from GSAP. Sounds like a solid plan. I built the button so far, and it worked great in Chrome and Firefox. In Safari, nope. I used an SVG mask that I referenced through CSS. But Safari can’t handle that properly when the path inside the mask is animated, so the animation lags. There was no simple solution for that. At least I didn’t find something. So I had to rebuild the button in another way. What I found was that the SVG mask animation works in Safari when the mask is placed on the desired element inside the SVG. That’s where foreignObject comes in, it allows you to use normal HTML elements inside an SVG. Using that, I rebuilt the hover text inside the SVG. I then referenced the mask on the foreignObject with a bit of JavaScript. And it worked! The button’s structure looks more complicated than I wanted it to be, but that happens quite often when you need to make something work across different browsers 😃 Crafting 100 Buttons with Osmo ⏳ Total time: 96h
0:35

007/100 Buttons. This button was way more complex than I first thought. I love the page transition on the Truus site that Dennis Snellenberg and Jordan Gilroy worked on. So I wanted to use that drawing SVG Path idea somehow and fit it into a button. In best case with a mask effect. The idea was to have an SVG path in the background that fills the button. At the same time, this path should also be used as a mask to reveal the differently colored text. The SVG should also be replaceable and work with other SVGs. For the path animation, I can use the DrawSVGPlugin from GSAP. Sounds like a solid plan. I built the button so far, and it worked great in Chrome and Firefox. In Safari, nope. I used an SVG mask that I referenced through CSS. But Safari can’t handle that properly when the path inside the mask is animated, so the animation lags. There was no simple solution for that. At least I didn’t find something. So I had to rebuild the button in another way. What I found was that the SVG mask animation works in Safari when the mask is placed on the desired element inside the SVG. That’s where foreignObject comes in, it allows you to use normal HTML elements inside an SVG. Using that, I rebuilt the hover text inside the SVG. I then referenced the mask on the foreignObject with a bit of JavaScript. And it worked! The button’s structure looks more complicated than I wanted it to be, but that happens quite often when you need to make something work across different browsers 😃 Crafting 100 Buttons with Osmo ⏳ Total time: 96h

Eduard Bodak

67,623 görüntüleme • 4 ay önce

It's an engineering marvel that they RAISED the field by 14 inches with the entire irrigation and drainage system inside the "box" over the old bottom. But the supports inside the box and grass top make it seem like you're not walking on a "box" at all.
2:02

It's an engineering marvel that they RAISED the field by 14 inches with the entire irrigation and drainage system inside the "box" over the old bottom. But the supports inside the box and grass top make it seem like you're not walking on a "box" at all.

Jackson Felts

88,813 görüntüleme • 3 ay önce

Firstly, it was not a bomb. The pamphlets inside are still fully intact. This was purely for propaganda, and it has worked perfectly. Secondly, calling the PCB a “tiny and unknown party” is completely false. Here is a video of just a singular camp from an organ of the PCB.
6:01

Firstly, it was not a bomb. The pamphlets inside are still fully intact. This was purely for propaganda, and it has worked perfectly. Secondly, calling the PCB a “tiny and unknown party” is completely false. Here is a video of just a singular camp from an organ of the PCB.

Chunqiao Publications

87,596 görüntüleme • 1 yıl önce

I completely redesigned my portfolio using a custom canvas. UI work is displayed using HTML embeds so you can zoom in for lossless quality and designs automatically reflect current dark or light mode. You can embed most mediums. A ton of detail went into this to make it work.
1:01

I completely redesigned my portfolio using a custom canvas. UI work is displayed using HTML embeds so you can zoom in for lossless quality and designs automatically reflect current dark or light mode. You can embed most mediums. A ton of detail went into this to make it work.

Gavin McFarland

49,567 görüntüleme • 1 ay önce

It was a ride to have it finished, but the SLIDE REEL IS HERE, and ummm... quite with something more actually because I made for it a whole stand as the one we insert it into, with the lantern inside of it! 🔥 ⬇️Photos and additional info below! Annapurna Interactive Mobius Digital Games #OuterWilds
1:17

It was a ride to have it finished, but the SLIDE REEL IS HERE, and ummm... quite with something more actually because I made for it a whole stand as the one we insert it into, with the lantern inside of it! 🔥 ⬇️Photos and additional info below! Annapurna Interactive Mobius Digital Games #OuterWilds

Mallow 🪐

172,118 görüntüleme • 2 yıl önce

Open Design 0.8.0 now works inside Cursor Composer 2.5. Composer 2.5 is built for this: long tasks, tool use, and iteration in one run. So we asked Composer to control Open Design through chat and build an animated HTML website. What happened 2.5 minutes later is insane: - landing page - smooth motion via GSAP gsap-skills - responsive HTML - ready to iterate Here is a quick demo:
0:39

Open Design 0.8.0 now works inside Cursor Composer 2.5. Composer 2.5 is built for this: long tasks, tool use, and iteration in one run. So we asked Composer to control Open Design through chat and build an animated HTML website. What happened 2.5 minutes later is insane: - landing page - smooth motion via GSAP gsap-skills - responsive HTML - ready to iterate Here is a quick demo:

Open Design

16,926 görüntüleme • 3 ay önce

Ramnagar Ganesh pandal: 786 kg laddu is not a coincidence. 786 is an Islamic numeral. A Muslim group can brand a Hindu deity’s prasad with it and it is called “harmony.” Ask the same people the reverse: can a Ganesh murti be installed inside a masjid as “harmony”? Secularism that works only one way is not secularism. It is a rulebook.
2:16

Ramnagar Ganesh pandal: 786 kg laddu is not a coincidence. 786 is an Islamic numeral. A Muslim group can brand a Hindu deity’s prasad with it and it is called “harmony.” Ask the same people the reverse: can a Ganesh murti be installed inside a masjid as “harmony”? Secularism that works only one way is not secularism. It is a rulebook.

Advocate Neelam Bhargava Ram

19,067 görüntüleme • 5 gün önce