add warning message

graphql · Nov 18, 2022 · 1f18051 · 1f18051
1 parent 87e20ff
commit 1f18051
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/packages/graphiql/src/components/GraphiQL.tsx b/packages/graphiql/src/components/GraphiQL.tsx
@@ -756,7 +756,10 @@ export function GraphiQLInterface(props: GraphiQLInterfaceProps) {
                 Persist headers
               </div>
               <div className="graphiql-dialog-section-caption">
-                Save headers upon reloading.
+                Save headers upon reloading.{' '}
+                <span className="graphiql-warning-text">
+                  Only enable if you trust this device.
+                </span>
               </div>
             </div>
             <ButtonGroup>

diff --git a/packages/graphiql/src/style.css b/packages/graphiql/src/style.css
@@ -310,6 +310,11 @@ reach-portal .graphiql-dialog-section-caption {
   color: hsla(var(--color-neutral), var(--alpha-secondary));
 }
 
+reach-portal .graphiql-warning-text {
+  color: hsl(var(--color-warning));
+  font-weight: var(--font-weight-medium);
+}
+
 reach-portal .graphiql-table {
   border-collapse: collapse;
   width: 100%;