Fix lock icon on Safari

benhatsor · web-flow · commit 4e72aa3a0d5b · 2022-04-25T14:51:07.000+03:00
Dev
diff --git a/full.css b/full.css
@@ -1289,13 +1289,15 @@ body:not(.mobile) .sidebar .header .title .branch-icon:active {
   stroke: currentColor;
   stroke-width: 1.58px;
   stroke-dasharray: 20px;
-  stroke-dashoffset: -3.4px;
+  stroke-dashoffset: 8.4px;
   stroke-linecap: round;
+  transform: scaleX(-1);
+  transform-origin: center;
   will-change: transform;
 }
 
 .sidebar .repo .lock.locked #shackle {
-  stroke-dashoffset: -1.1px;
+  stroke-dashoffset: 6.1px;
   animation: lock-click .14s .124s var(--ease-function);
 }
 
@@ -1309,7 +1311,7 @@ body:not(.mobile) .sidebar .header .title .branch-icon:active {
 
 @keyframes lock-click {
   50% {
-    transform: translateY(0.5px);
+    transform: scaleX(-1) translateY(0.5px);
   }
 }
 
diff --git a/worker/client-channel.js b/worker/client-channel.js
@@ -4,7 +4,7 @@
 
 
 // update worker name when updating worker
-const WORKER_NAME = 'codeit-worker-v521';
+const WORKER_NAME = 'codeit-worker-v522';
 
 
 // internal paths

Original file line number	Diff line number	Diff line change
`@@ -1289,13 +1289,15 @@ body:not(.mobile) .sidebar .header .title .branch-icon:active {`
`1289`	`1289`	`stroke: currentColor;`
`1290`	`1290`	`stroke-width: 1.58px;`
`1291`	`1291`	`stroke-dasharray: 20px;`
`1292`		`- stroke-dashoffset: -3.4px;`
	`1292`	`+ stroke-dashoffset: 8.4px;`
`1293`	`1293`	`stroke-linecap: round;`
	`1294`	`+ transform: scaleX(-1);`
	`1295`	`+ transform-origin: center;`
`1294`	`1296`	`will-change: transform;`
`1295`	`1297`	`}`
`1296`	`1298`
`1297`	`1299`	`.sidebar .repo .lock.locked #shackle {`
`1298`		`- stroke-dashoffset: -1.1px;`
	`1300`	`+ stroke-dashoffset: 6.1px;`
`1299`	`1301`	`animation: lock-click .14s .124s var(--ease-function);`
`1300`	`1302`	`}`
`1301`	`1303`
`@@ -1309,7 +1311,7 @@ body:not(.mobile) .sidebar .header .title .branch-icon:active {`
`1309`	`1311`
`1310`	`1312`	`@keyframes lock-click {`
`1311`	`1313`	`50% {`
`1312`		`- transform: translateY(0.5px);`
	`1314`	`+ transform: scaleX(-1) translateY(0.5px);`
`1313`	`1315`	`}`
`1314`	`1316`	`}`
`1315`	`1317`