1
/*
2
 *  This file is part of CoCalc: Copyright © 2020 Sagemath, Inc.
3
 *  License: MS-RSL – see LICENSE.md for details
4
 */
5

6
import { Icon } from "@cocalc/frontend/components";
7
import { SiteName } from "@cocalc/frontend/customize";
8
import { get_browser } from "@cocalc/frontend/feature";
9
import { type CSSProperties } from "react";
10

11
const WARNING_STYLE = {
12
  position: "fixed",
13
  left: 12,
14
  backgroundColor: "red",
15
  color: "#fff",
16
  top: 20,
17
  opacity: 0.9,
18
  borderRadius: 4,
19
  padding: 5,
20
  marginTop: "1em",
21
  zIndex: 100000,
22
  boxShadow: "8px 8px 4px #888",
23
  width: "70%",
24
} as CSSProperties;
25

26
export function CookieWarning() {
27
  return (
28
    <div style={WARNING_STYLE}>
29
      <Icon name="warning" /> You <em>must</em> enable cookies to use{" "}
30
      <SiteName />.
31
    </div>
32
  );
33
}
34

35
const STORAGE_WARNING_STYLE = {
36
  ...WARNING_STYLE,
37
  top: 55,
38
} as CSSProperties;
39

40
export function LocalStorageWarning() {
41
  return (
42
    <div style={STORAGE_WARNING_STYLE}>
43
      <Icon name="warning" /> You <em>must</em> enable local storage to use{" "}
44
      <SiteName />
45
      {get_browser() === "safari"
46
        ? " (on Safari you must disable private browsing mode)"
47
        : undefined}
48
      .
49
    </div>
50
  );
51
}
52

53