Add 's' method to access theme props (#5163)

app/components/Sidebar/components/Header.tsx

@@ -1,6 +1,7 @@
 import { CollapsedIcon } from "outline-icons";
 import * as React from "react";
 import styled, { keyframes } from "styled-components";
+import { s } from "@shared/styles";
 import usePersistedState from "~/hooks/usePersistedState";
 import { undraggableOnDesktop } from "~/styles";
 
@@ -67,7 +68,7 @@ const Button = styled.button`
   font-size: 13px;
   font-weight: 600;
   user-select: none;
-  color: ${(props) => props.theme.textTertiary};
+  color: ${s("textTertiary")};
   letter-spacing: 0.03em;
   margin: 0;
   padding: 4px 2px 4px 12px;
@@ -81,7 +82,7 @@ const Button = styled.button`
 
   &:not(:disabled):hover,
   &:not(:disabled):active {
-    color: ${(props) => props.theme.textSecondary};
+    color: ${s("textSecondary")};
     cursor: var(--pointer);
   }
 `;