insin

🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵
🔵🟡🟡🟡🔵🔵🟡🔵🔵🔵🟡🟡🔵🟡🔵🟡🔵
🔵🟡🔵🔵🔵🟡🔵🟡🔵🟡🔵🔵🔵🟡🔵🟡🔵
🔵🟡🟡🟡🔵🟡🟡🟡🔵🔵🟡🔵🔵🔵🟡🔵🔵
🔵🟡🔵🔵🔵🟡🔵🟡🔵🔵🔵🟡🔵🔵🟡🔵🔵
🔵🟡🟡🟡🔵🟡🔵🟡🔵🟡🟡🔵🔵🔵🟡🔵🔵
🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵

insin

An Astro <Tweet> component for hardcoding static Tweets

Dependencies

Tailwind

Setup

1. Add the following colours to your Tailwind config

insin

let $segments = document.querySelector('.ytd-transcript-search-panel-renderer #segments-container')
let sections = []
let parts = []

for (let $el of $segments.children) {
  if ($el.tagName == 'YTD-TRANSCRIPT-SECTION-HEADER-RENDERER') {
    if (parts.length > 0) {
			sections.push(parts.join(' '))
      parts = []
    }

insin

/* Nav item */
a[title="Shorts"],
/* Video shelf in Home and Subscriptions */
ytd-rich-shelf-renderer[is-shorts],
/* Video shelf in Search  */
ytd-reel-shelf-renderer {
  display: none !important;
}

@supports selector(:has(*)) {

insin

entities = $('#react-root')._reactRootContainer._internalRoot?.current?.memoizedState?.element?.props?.children?.props?.store?.getState()?.entities?.users?.entities   
users = {}
for (let user of Object.values(entities)) {
  users[user.screen_name] = user
}

insin

/* Hide... */
/* Views on list tweets */
[data-testid="tweet"][tabindex="0"] div[id^=id__][role=group] > div:nth-child(4):nth-last-child(2),
/* Views on focused tweet */
[data-testid="tweet"][tabindex="-1"] div[dir] + div[aria-hidden="true"]:nth-child(2):nth-last-child(2),
[data-testid="tweet"][tabindex="-1"] div[dir] + div[aria-hidden="true"]:nth-child(2):nth-last-child(2) + div[dir]:last-child,
/* Bookmark button on focused tweet */
[data-testid="tweet"][tabindex="-1"] div[id^=id__][role=group] > div:nth-child(4):nth-last-child(2),
/* Share button on all tweets */
div[id^=id__][role=group] > div:nth-child(5):last-child,

insin

---
export interface Props {
  title: string
  videoCode: string
}
let {title, videoCode} = Astro.props
let playButtonSvg = `<svg height="100%" version="1.1" viewBox="0 0 68 48" width="100%"><path d="M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z" fill="#f00"></path><path d="M 45,24 27,14 27,34" fill="#fff"></path></svg>`
let srcdoc = `<style>*{padding:0;margin:0;overflow:hidden}html,body{height:100%}img{position:absolute;width:100%;top:0;bottom:0;margin:auto}.button{position:absolute;left:50%;top:50%;width:68px;height:48px;margin-left:-34px;margin-top:-24px;}.top{position:absolute;top:18px;left:18px;right:18px;display:flex;flex-wrap:nowrap}.title{color:#fff;font-size:18px;white-space:nowrap;word-wrap:normal;text-shadow:0 0 2px rgba(0,0,0,.5);font-fam

insin

svg pattern + path[fill] {
  fill: inherit;
  d: path("M23.643 4.937c-.835.37-1.732.62-2.675.733.962-.576 1.7-1.49 2.048-2.578-.9.534-1.897.922-2.958 1.13-.85-.904-2.06-1.47-3.4-1.47-2.572 0-4.658 2.086-4.658 4.66 0 .364.042.718.12 1.06-3.873-.195-7.304-2.05-9.602-4.868-.4.69-.63 1.49-.63 2.342 0 1.616.823 3.043 2.072 3.878-.764-.025-1.482-.234-2.11-.583v.06c0 2.257 1.605 4.14 3.737 4.568-.392.106-.803.162-1.227.162-.3 0-.593-.028-.877-.082.593 1.85 2.313 3.198 4.352 3.234-1.595 1.25-3.604 1.995-5.786 1.995-.376 0-.747-.022-1.112-.065 2.062 1.323 4.51 2.093 7.14 2.093 8.57 0 13.255-7.098 13.255-13.254 0-.2-.005-.402-.014-.602.91-.658 1.7-1.477 2.323-2.41z");
}

insin

let $follows = document.querySelector('div[data-testid="primaryColumn"] section > h1 + div[aria-label] > div')
let handles = new Set()
let finishTimeout
let observer

function finish() {
  if (finishTimeout) {
    clearTimeout(finishTimeout)
  }
  finishTimeout = setTimeout(() => {

insin

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.deepOrange,
      ),
      home: Scaffold(