Skip to content

Instantly share code, notes, and snippets.

View Stvad's full-sized avatar

Vlad Sitalo Stvad

124 followers · 18 following
View GitHub Profile
@Stvad
Stvad / index.html
Created May 2, 2022 23:42
<script src="https://hypothes.is/embed.js" async></script><div><style fetched-from-link="true">:host,[data-color-mode=light][data-light-theme=light],[data-color-mode=dark][data-dark-theme=light]{/*! */}:host,[data-color-mode=light][data-light-theme=light],[data-color-mode=dark][data-dark-theme=light]{--color-canvas-default-transparent: rgba(255,255,255,0);--color-page-header-bg: #f6f8fa;--color-marketing-icon-primary: #218bff;--color-marketing-icon-secondary: #54aeff;--color-diff-blob-addition-num-text: #24292f;--color-diff-blob-addition-fg: #24292f;--color-diff-blob-addition-num-bg: #CCFFD8;--color-diff-blob-addition-line-bg: #E6FFEC;--color-diff-blob-addition-word-bg: #ABF2BC;--color-diff-blob-deletion-num-text: #24292f;--color-diff-blob-deletion-fg: #24292f;--color-diff-blob-deletion-num-bg: #FFD7D5;--color-diff-blob-deletion-line-bg: #FFEBE9;--color-diff-blob-deletion-word-bg: rgba(255,129,130,0.4);--color-diff-blob-hunk-num-bg: rgba(84,174,255,0.4);--color-diff-blob-expander-icon: #57606a;--color-diff-bl
@Stvad
Stvad / index.html
Created May 1, 2022 02:08
<script src="https://hypothes.is/embed.js" async></script><div><style></style><style>:export{themeFilter:invert(93%) hue-rotate(180deg)}.excalidraw .ToolIcon{display:inline-flex;align-items:center;position:relative;font-family:Cascadia;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:var(--space-factor);-webkit-user-select:none;user-select:none;background-color:var(--button-gray-1)}.excalidraw .ToolIcon:hover{background-color:var(--button-gray-2)}.excalidraw .ToolIcon:active{background-color:var(--button-gray-3)}.excalidraw .ToolIcon--plain{background-color:transparent}.excalidraw .ToolIcon--plain .ToolIcon__icon{width:2rem;height:2rem}.excalidraw .ToolIcon__icon{width:2.5rem;height:2.5rem;color:var(--icon-fill-color);display:flex;justify-content:center;align-items:center;border-radius:var(--space-factor)}.excalidraw .ToolIcon__icon svg{position:relative;height:1em;fill:var(--icon-fill-color);color:var(--icon-fill-color)}.excalidraw .ToolIcon__icon+.ToolIcon__label{-webkit-margin-start:0;m
@Stvad
Stvad / index.html
Created May 1, 2022 02:08
<script src="https://hypothes.is/embed.js" async></script><div><style></style><style>:export{themeFilter:invert(93%) hue-rotate(180deg)}.excalidraw .ToolIcon{display:inline-flex;align-items:center;position:relative;font-family:Cascadia;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:var(--space-factor);-webkit-user-select:none;user-select:none;background-color:var(--button-gray-1)}.excalidraw .ToolIcon:hover{background-color:var(--button-gray-2)}.excalidraw .ToolIcon:active{background-color:var(--button-gray-3)}.excalidraw .ToolIcon--plain{background-color:transparent}.excalidraw .ToolIcon--plain .ToolIcon__icon{width:2rem;height:2rem}.excalidraw .ToolIcon__icon{width:2.5rem;height:2.5rem;color:var(--icon-fill-color);display:flex;justify-content:center;align-items:center;border-radius:var(--space-factor)}.excalidraw .ToolIcon__icon svg{position:relative;height:1em;fill:var(--icon-fill-color);color:var(--icon-fill-color)}.excalidraw .ToolIcon__icon+.ToolIcon__label{-webkit-margin-start:0;m
@Stvad
Stvad / README.md
Last active April 26, 2022 23:54
iPad better web annotation bookmarklet

Bookmarklet that improves web annotation experience on iPad

It combines a https://hypothes.is setup with UX improvements for iPad.

Watch the video

Usage

  1. Run the bookmarklet.
  2. Double tap screen with a finger to enter annotation mode.
@Stvad
Stvad / index.html
Created April 25, 2022 18:45
This file has been truncated, but you can view the full file.
<script src="https://hypothes.is/embed.js" async></script><div><style>#solvvyWidget { position: fixed; bottom: 0px; right: 0px; transform: translate(0px, 0px); transition: transform 200ms ease 0s, opacity 200ms ease 0s; margin-bottom: 0px; border-top-left-radius: 8px; border-bottom-left-radius: 8px;}@media only screen and (max-width: 600px), only screen and (max-height: 670px) { #solvvyWidget { width: 100%; height: 100%; margin-bottom: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }}</style><style data-emotion="css"></style><style>#consilienceApp {
all: initial;
background-color: white;
height: 100%;
position: fixed;
right: 10px;
top: 0;
width: 375px;
z-index: 2147483647;
font-size: 16px;
@Stvad
Stvad / index.html
Created April 24, 2022 19:15
This file has been truncated, but you can view the full file.
<script src="https://hypothes.is/embed.js" async></script><div><style>.ͼ1.cm-editor.cm-focused {outline: 1px dotted #212121;}
.ͼ1.cm-editor {position: relative !important; box-sizing: border-box; display: flex !important; flex-direction: column;}
.ͼ1 .cm-scroller {display: flex !important; align-items: flex-start !important; font-family: monospace; line-height: 1.4; height: 100%; overflow-x: auto; position: relative; z-index: 0;}
.ͼ1 .cm-content {margin: 0; flex-grow: 2; min-height: 100%; display: block; white-space: pre; word-wrap: normal; box-sizing: border-box; padding: 4px 0; outline: none;}
.ͼ1 .cm-lineWrapping {white-space: pre-wrap; word-break: break-word; overflow-wrap: anywhere;}
.ͼ2 .cm-content {caret-color: black;}
.ͼ3 .cm-content {caret-color: white;}
.ͼ1 .cm-line {display: block; padding: 0 2px 0 4px;}
.ͼ1 .cm-selectionLayer {z-index: -1; contain: size style;}
.ͼ1 .cm-selectionBackground {position: absolute;}
@Stvad
Stvad / index.html
Created April 23, 2022 02:00
This file has been truncated, but you can view the full file.
<script src="https://hypothes.is/embed.js" async></script><div><style>.p-trouble_loading,.p-trouble_loading_overlay{z-index:9999;opacity:0;display:none;transition:transform .5s ease-out,opacity .5s ease-out}.p-trouble_loading_overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;background:#d9d9d9}.p-trouble_loading{position:absolute;top:50%;left:50%;width:100%;max-width:35rem;min-height:15rem;max-height:27.5rem;overflow:auto;background:#fff;padding:1.5rem;user-select:text;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;pointer-events:auto;border:1px solid rgba(0,0,0,.05);border-radius:8px;font-size:1rem;font-family:Slack-Lato,appleLogo,sans-serif;transform:scale(1) translateX(-50%) translateY(-50%);transition-duration:.33s;transition-delay:.25s;box-shadow:0 0 16px 8px rgba(0,0,0,.05)}.p-trouble_loading a{text-decoration:none;color:#0073c6}.p-trouble_loading a:hover{text-decoration:underline}.p-trouble_loading h1{font-size:1.5rem;margin:0 0 .25rem 0}.p-trouble_loa
@Stvad
Stvad / index.html
Created April 23, 2022 01:57
This file has been truncated, but you can view the full file.
<script src="https://hypothes.is/embed.js" async></script><div><style>.ͼ1.cm-editor.cm-focused {outline: 1px dotted #212121;}
.ͼ1.cm-editor {position: relative !important; box-sizing: border-box; display: flex !important; flex-direction: column;}
.ͼ1 .cm-scroller {display: flex !important; align-items: flex-start !important; font-family: monospace; line-height: 1.4; height: 100%; overflow-x: auto; position: relative; z-index: 0;}
.ͼ1 .cm-content {margin: 0; flex-grow: 2; min-height: 100%; display: block; white-space: pre; word-wrap: normal; box-sizing: border-box; padding: 4px 0; outline: none;}
.ͼ1 .cm-lineWrapping {white-space: pre-wrap; word-break: break-word; overflow-wrap: anywhere;}
.ͼ2 .cm-content {caret-color: black;}
.ͼ3 .cm-content {caret-color: white;}
.ͼ1 .cm-line {display: block; padding: 0 2px 0 4px;}
.ͼ1 .cm-selectionLayer {z-index: -1; contain: size style;}
.ͼ1 .cm-selectionBackground {position: absolute;}
@Stvad
Stvad / index.html
Created April 23, 2022 01:48
This file has been truncated, but you can view the full file.
<script src="https://hypothes.is/embed.js" async></script><div><style>.ͼ1.cm-editor.cm-focused {outline: 1px dotted #212121;}
.ͼ1.cm-editor {position: relative !important; box-sizing: border-box; display: flex !important; flex-direction: column;}
.ͼ1 .cm-scroller {display: flex !important; align-items: flex-start !important; font-family: monospace; line-height: 1.4; height: 100%; overflow-x: auto; position: relative; z-index: 0;}
.ͼ1 .cm-content {margin: 0; flex-grow: 2; min-height: 100%; display: block; white-space: pre; word-wrap: normal; box-sizing: border-box; padding: 4px 0; outline: none;}
.ͼ1 .cm-lineWrapping {white-space: pre-wrap; word-break: break-word; overflow-wrap: anywhere;}
.ͼ2 .cm-content {caret-color: black;}
.ͼ3 .cm-content {caret-color: white;}
.ͼ1 .cm-line {display: block; padding: 0 2px 0 4px;}
.ͼ1 .cm-selectionLayer {z-index: -1; contain: size style;}
.ͼ1 .cm-selectionBackground {position: absolute;}
@Stvad
Stvad / index.html
Created April 23, 2022 01:17
This file has been truncated, but you can view the full file.
<script src="https://hypothes.is/embed.js" async></script><div><style xmlns="http://www.w3.org/1999/xhtml">.ͼ1.cm-editor.cm-focused {outline: 1px dotted #212121;}
.ͼ1.cm-editor {position: relative !important; box-sizing: border-box; display: flex !important; flex-direction: column;}
.ͼ1 .cm-scroller {display: flex !important; align-items: flex-start !important; font-family: monospace; line-height: 1.4; height: 100%; overflow-x: auto; position: relative; z-index: 0;}
.ͼ1 .cm-content {margin: 0; flex-grow: 2; min-height: 100%; display: block; white-space: pre; word-wrap: normal; box-sizing: border-box; padding: 4px 0; outline: none;}
.ͼ1 .cm-lineWrapping {white-space: pre-wrap; word-break: break-word; overflow-wrap: anywhere;}
.ͼ2 .cm-content {caret-color: black;}
.ͼ3 .cm-content {caret-color: white;}
.ͼ1 .cm-line {display: block; padding: 0 2px 0 4px;}
.ͼ1 .cm-selectionLayer {z-index: -1; contain: size style;}
.ͼ1 .cm-selectionBackground {position: absolute;}