@bleedingdev/modern-js-main-doc 3.2.0-ultramodern.0

package/src/pages/index.module.scss

@@ -0,0 +1,349 @@
+/**
+ * CSS files with the .module.css suffix will be treated as CSS modules
+ * and scoped locally.
+ */
+
+/* === Header Start === */
+.header {
+  display: flex;
+  justify-content: center;
+  background-size: cover;
+  background-position: center bottom;
+  background-origin: border-box;
+}
+
+.heroBanner {
+  display: flex;
+  width: 80vw;
+  max-width: 1200px;
+  flex-direction: column;
+  justify-content: flex-start;
+  position: relative;
+  box-sizing: border-box;
+  align-items: center;
+  text-align: center;
+  padding-top: 12vh;
+  padding-bottom: 16vh;
+}
+
+.announcement {
+  display: inline-flex;
+  align-items: center;
+  gap: 10px;
+  padding: 6px 18px 6px 6px;
+  border-radius: 999px;
+  background: linear-gradient(
+    150.85deg,
+    rgba(124, 178, 250, 0.15) 3%,
+    rgba(124, 178, 250, 0.08) 97.17%
+  );
+  border: 1px solid rgba(124, 178, 250, 0.4);
+  cursor: pointer;
+  transition: all 0.3s ease;
+  text-decoration: none;
+  margin-bottom: 1.5rem;
+  position: relative;
+  z-index: 1;
+
+  &:hover {
+    background: linear-gradient(
+      150.85deg,
+      rgba(124, 178, 250, 0.25) 3%,
+      rgba(124, 178, 250, 0.15) 97.17%
+    );
+    border-color: rgba(124, 178, 250, 0.55);
+    text-decoration: none;
+  }
+}
+
+:global(.dark) .announcement {
+  background: linear-gradient(
+    150.85deg,
+    rgba(124, 178, 250, 0.18) 3%,
+    rgba(124, 178, 250, 0.08) 97.17%
+  );
+  border-color: rgba(124, 178, 250, 0.25);
+
+  &:hover {
+    background: linear-gradient(
+      150.85deg,
+      rgba(124, 178, 250, 0.28) 3%,
+      rgba(124, 178, 250, 0.14) 97.17%
+    );
+    border-color: rgba(124, 178, 250, 0.4);
+  }
+}
+
+.announcementLabel {
+  display: inline-flex;
+  align-items: center;
+  padding: 2px 10px;
+  border-radius: 999px;
+  background: var(--edenx-home-hero-name-background);
+  font-size: 12px;
+  font-weight: 700;
+  color: #fff;
+  letter-spacing: 0.5px;
+  line-height: 1.6;
+}
+
+.announcementText {
+  font-size: 14px;
+  font-weight: 500;
+  color: rgba(0, 0, 0, 0.75);
+}
+
+:global(.dark) .announcementText {
+  color: rgba(255, 255, 255, 0.85);
+}
+
+.announcementArrow {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.45);
+  transition: transform 0.3s ease;
+
+  .announcement:hover & {
+    transform: translateX(2px);
+  }
+}
+
+:global(.dark) .announcementArrow {
+  color: rgba(255, 255, 255, 0.5);
+}
+
+.title {
+  font-style: normal;
+  font-weight: bold;
+  font-size: 3.75rem;
+  line-height: 1.6;
+}
+
+.mainTitle {
+  font-size: 125%;
+}
+
+.mask {
+  position: absolute;
+  background-image: conic-gradient(
+    from 180deg at 50%50%,
+    var(--edenx-primary-color) 0deg,
+    180deg,
+    hsl(198deg, 100%, 50%) 0deg
+  );
+  max-width: 500px;
+  width: 100%;
+  height: 450px;
+  border-radius: 100%;
+  mixblendmode: normal;
+  filter: blur(80px);
+  opacity: 0.1;
+  top: 100px;
+  left: 50%;
+  z-index: 0;
+  transform: translateX(-50%);
+  pointer-events: none;
+}
+
+:global(.dark) .mask {
+  opacity: 0.15;
+}
+
+.titleGradient {
+  background: var(--edenx-home-hero-name-background);
+  background-clip: text;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+
+.buttons {
+  display: flex;
+  justify-content: center;
+  margin-top: 2.4rem;
+}
+
+.slogan {
+  font-size: 40%;
+  font-weight: normal;
+  opacity: 0.7;
+  margin-top: 1.2rem;
+}
+
+.leftButton,
+.rightButton {
+  width: 142px;
+  font-weight: bold;
+
+  &:hover {
+    opacity: 0.7;
+    text-decoration: none;
+  }
+
+  &:active {
+    opacity: 0.4;
+  }
+}
+
+.leftButton {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  line-height: 48px;
+  height: 48px;
+  background: var(--edenx-home-hero-name-background);
+  box-shadow: 0px 1px 8px rgba(133, 250, 202, 0.34);
+  border-radius: 39px;
+  color: #fff;
+  cursor: pointer;
+  opacity: 0.9;
+  transition: opacity 0.3s ease;
+
+  &:hover {
+    color: #fff;
+  }
+}
+
+.rightButton {
+  display: flex;
+  height: 49px;
+  justify-content: center;
+  align-items: center;
+  border: 1px solid var(--edenx-primary-color);
+  box-sizing: border-box;
+  border-radius: 39px;
+  margin-left: 32px;
+  cursor: pointer;
+  color: var(--edenx-primary-color);
+  transition: all 0.3s ease;
+}
+
+@media (max-width: 1600px) {
+  .logo {
+    width: 420px;
+  }
+
+  .title {
+    font-size: 3.6rem;
+  }
+}
+
+@media screen and (max-width: 768px) {
+  .heroBanner {
+    align-items: center;
+  }
+  .title {
+    font-size: 7vw;
+    text-align: center;
+  }
+  .announcement {
+    padding: 4px 14px 4px 4px;
+    gap: 8px;
+    margin-bottom: 1rem;
+  }
+  .announcementText {
+    font-size: 12px;
+  }
+  .buttons {
+    width: 65%;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    margin-top: 50px;
+  }
+  .leftButton,
+  .rightButton {
+    width: 100%;
+  }
+  .rightButton {
+    margin-left: 0;
+    margin-top: 32px;
+  }
+  .singleImg {
+    max-width: 100%;
+  }
+}
+
+@media screen and (max-width: 540px) {
+  .title {
+    font-size: 8vw;
+  }
+}
+
+/* === Header End === */
+
+.cardContainer {
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 16px;
+}
+
+// .homepage-main {
+//   background-color: #0d0d0d;
+// }
+
+.flowContainer {
+  position: relative;
+  width: 1021px;
+  max-width: 100%;
+  margin: 0 auto;
+  height: 1261px;
+  overflow-y: hidden;
+}
+
+.flowLine {
+  position: absolute;
+  width: 95px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.flowLineMobile {
+  left: 30px;
+  width: 37.5px;
+}
+
+.singleImgWrap {
+  display: flex;
+  justify-content: center;
+  width: 100%;
+  margin-top: 48px;
+  border: 1px solid #6f6f6f;
+  border-radius: 8px;
+}
+
+.singleImg {
+  max-width: 910px;
+  object-fit: contain;
+}
+
+.singleImgCard {
+  margin-bottom: 16px;
+  transition: all 0.3s ease;
+}
+
+.singleImgCard:hover {
+  background: rgba(78, 202, 255, 0.2);
+  transition: all 0.3s ease;
+}
+
+@media screen and (max-width: 700px) {
+  .section-title {
+    font-size: 1rem;
+    font-size: 4vw;
+    margin-top: 1rem;
+    margin-bottom: 1rem;
+  }
+  .singleImg {
+    max-width: 100%;
+  }
+}
+
+@media screen and (max-width: 1100px) {
+  .flowContainer {
+    height: auto;
+    overflow: visible;
+  }
+}
+
+:global(.rspress-logo) {
+  width: auto !important;
+}

package/src/pages/index.tsx

@@ -0,0 +1,133 @@
+import { Head, useLocation } from '@rspress/core/runtime';
+import clsx from 'clsx';
+import { useEffect } from 'react';
+import ContentCard from '../components/ContentCard';
+import { FeatureLayout } from '../components/FeatureLayout';
+import Footer from '../components/Footer';
+import SecondaryTitle from '../components/SecondaryTitle';
+import { useI18n, useUrl } from '../i18n';
+import styles from './index.module.scss';
+
+const HomepageHeader = () => {
+  const t = useI18n();
+  return (
+    <div className={styles.header}>
+      <header className={clsx('hero hero--primary', styles.heroBanner)}>
+        <div className={styles.mask} />
+        <a
+          href={useUrl('/community/blog/v3-release-note')}
+          className={styles.announcement}
+        >
+          <span className={styles.announcementLabel}>
+            {t('announcementLabel')}
+          </span>
+          <span className={styles.announcementText}>
+            {t('announcementText')}
+          </span>
+          <span className={styles.announcementArrow}>→</span>
+        </a>
+        <h1 className={styles.title}>
+          <span className={clsx([styles.titleGradient, styles.mainTitle])}>
+            Modern.js 3.0
+          </span>
+          <div>{t('slogan')}</div>
+        </h1>
+        <div className={styles.buttons}>
+          <a
+            href={useUrl('/guides/get-started/introduction')}
+            className={styles.leftButton}
+          >
+            {t('introduction')}
+          </a>
+          <a
+            href={useUrl('/guides/get-started/quick-start')}
+            className={styles.rightButton}
+          >
+            {t('quickStart')}
+          </a>
+        </div>
+      </header>
+    </div>
+  );
+};
+
+export default function Home() {
+  const t = useI18n();
+  const { pathname } = useLocation();
+  useEffect(() => {
+    window.MODERN_THEME = 'dark';
+    return () => {
+      window.MODERN_THEME = undefined;
+    };
+  }, [pathname]);
+
+  const features = [
+    {
+      id: 'feature1',
+      title: t('feature1'),
+      href: useUrl('/guides/concept/builder'),
+      desc: t('featureDesc1'),
+    },
+    {
+      id: 'feature2',
+      title: t('feature2'),
+      href: useUrl('/guides/advanced-features/bff/index'),
+      desc: t('featureDesc2'),
+    },
+    {
+      id: 'feature3',
+      title: t('feature3'),
+      href: useUrl('/guides/basic-features/routes/routes'),
+      desc: t('featureDesc3'),
+    },
+    {
+      id: 'feature4',
+      title: t('feature4'),
+      href: useUrl('/guides/basic-features/render/ssr'),
+      desc: t('featureDesc4'),
+    },
+    {
+      id: 'feature5',
+      title: t('feature5'),
+      href: useUrl('/guides/basic-features/css/css'),
+      desc: t('featureDesc5'),
+    },
+    {
+      id: 'feature6',
+      title: t('feature6'),
+      href: useUrl('/configure/app/usage'),
+      desc: t('featureDesc6'),
+    },
+  ];
+
+  return (
+    <div>
+      <Head>
+        <html className="dark" />
+        <script>window.MODERN_THEME = 'dark';</script>
+        <style type="text/css">{`
+          .rspress-doc-appearance {
+            display: none!important;
+          }
+        `}</style>
+      </Head>
+      <HomepageHeader />
+      <main className={styles['homepage-main']}>
+        <FeatureLayout>
+          <div className={styles.cardContainer}>
+            {features.map(card => (
+              <ContentCard
+                key={card.id}
+                title={card.title}
+                desc={card.desc}
+                href={card.href}
+              />
+            ))}
+          </div>
+        </FeatureLayout>
+
+        <Footer />
+      </main>
+    </div>
+  );
+}

package/src/sandbox/csr-auth/src/routes/Auth-tsx.txt

@@ -0,0 +1,74 @@
+import { Navigate, useLocation, useNavigate } from '@modern-js/runtime/router';
+import React from 'react';
+import { fakeAuthProvider } from './fakeAuth';
+
+interface AuthContextType {
+  user: any;
+  signin: (user: string, callback: VoidFunction) => void;
+  signout: (callback: VoidFunction) => void;
+}
+
+const AuthContext = React.createContext<AuthContextType>(null!);
+
+export function AuthProvider({ children }: { children: React.ReactNode }) {
+  const [user, setUser] = React.useState<any>(null);
+
+  const signin = (newUser: string, callback: VoidFunction) =>
+    fakeAuthProvider.signin(() => {
+      setUser(newUser);
+      callback();
+    });
+
+  const signout = (callback: VoidFunction) =>
+    fakeAuthProvider.signout(() => {
+      setUser(null);
+      callback();
+    });
+
+  const value = { user, signin, signout };
+
+  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
+}
+
+export function useAuth() {
+  return React.useContext(AuthContext);
+}
+
+export function AuthStatus() {
+  const auth = useAuth();
+  console.log('auth', auth);
+  const navigate = useNavigate();
+
+  if (!auth.user) {
+    return <p>You are not logged in.</p>;
+  }
+
+  return (
+    <p>
+      Welcome {auth.user}!{' '}
+      <button
+        type="button"
+        onClick={() => {
+          auth.signout(() => navigate('/'));
+        }}
+      >
+        Sign out
+      </button>
+    </p>
+  );
+}
+
+export function RequireAuth({ children }: { children: JSX.Element }) {
+  const auth = useAuth();
+  const location = useLocation();
+
+  if (!auth.user) {
+    // Redirect them to the /login page, but save the current location they were
+    // trying to go to when they were redirected. This allows us to send them
+    // along to that page after they login, which is a nicer user experience
+    // than dropping them off on the home page.
+    return <Navigate to="/login" state={{ from: location }} replace />;
+  }
+
+  return children;
+}

package/src/sandbox/csr-auth/src/routes/fakeAuth-ts.txt

@@ -0,0 +1,16 @@
+/**
+ * This represents some generic auth provider API, like Firebase.
+ */
+const fakeAuthProvider = {
+  isAuthenticated: false,
+  signin(callback: VoidFunction) {
+    fakeAuthProvider.isAuthenticated = true;
+    setTimeout(callback, 100); // fake async
+  },
+  signout(callback: VoidFunction) {
+    fakeAuthProvider.isAuthenticated = false;
+    setTimeout(callback, 100);
+  },
+};
+
+export { fakeAuthProvider };

package/src/sandbox/csr-auth/src/routes/layout-tsx.txt

@@ -0,0 +1,21 @@
+import { Link, Outlet } from '@modern-js/runtime/router';
+import { AuthProvider, AuthStatus } from './Auth';
+
+export default function Layout() {
+  return (
+    <AuthProvider>
+      <AuthStatus />
+
+      <ul>
+        <li>
+          <Link to="/">Public Page</Link>
+        </li>
+        <li>
+          <Link to="/protected">Protected Page</Link>
+        </li>
+      </ul>
+
+      <Outlet />
+    </AuthProvider>
+  );
+}

package/src/sandbox/csr-auth/src/routes/login/page-tsx.txt

@@ -0,0 +1,40 @@
+import { useLocation, useNavigate } from '@modern-js/runtime/router';
+import { useAuth } from '../Auth';
+
+export default function Login() {
+  const navigate = useNavigate();
+  const location = useLocation();
+  const auth = useAuth();
+
+  const from = location.state?.from?.pathname || '/';
+
+  function handleSubmit(event: React.FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+
+    const formData = new FormData(event.currentTarget);
+    const username = formData.get('username') as string;
+
+    auth.signin(username, () => {
+      // Send them back to the page they tried to visit when they were
+      // redirected to the login page. Use { replace: true } so we don't create
+      // another entry in the history stack for the login page.  This means that
+      // when they get to the protected page and click the back button, they
+      // won't end up back on the login page, which is also really nice for the
+      // user experience.
+      navigate(from, { replace: true });
+    });
+  }
+
+  return (
+    <div>
+      <p>You must log in to view the page at {from}</p>
+
+      <form onSubmit={handleSubmit}>
+        <label>
+          Username: <input name="username" type="text" />
+        </label>{' '}
+        <button type="submit">Login</button>
+      </form>
+    </div>
+  );
+}

package/src/sandbox/csr-auth/src/routes/page-tsx.txt

@@ -0,0 +1,17 @@
+import { Helmet } from '@modern-js/runtime/head';
+import './index.css';
+
+const PublicPage = (): JSX.Element => (
+  <div className="container-box">
+    <Helmet>
+      <link
+        rel="icon"
+        type="image/x-icon"
+        href="https://lf3-static.bytednsdoc.com/obj/eden-cn/uhbfnupenuhf/favicon.ico"
+      />
+    </Helmet>
+    <h3>Public</h3>
+  </div>
+);
+
+export default PublicPage;

package/src/sandbox/csr-auth/src/routes/protected/page-tsx.txt

@@ -0,0 +1,11 @@
+import { RequireAuth } from '../Auth';
+
+export default function ProtectedPage() {
+  return (
+    <div className="container-box">
+      <RequireAuth>
+        <h3>Protected</h3>
+      </RequireAuth>
+    </div>
+  );
+}

package/static/img/features/ai.svg

@@ -0,0 +1 @@
+<svg height='100px' width='100px'  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 60 60" version="1.1" x="0px" y="0px"><title>012 - Computer Thoughts</title><desc>Created with Sketch.</desc><g stroke="none" stroke-width="1" fill-rule="evenodd"><g fill-rule="nonzero"><path d="M0.36,33.859 C-0.0644455646,34.4700348 -0.114638064,35.2661705 0.229706222,35.9256738 C0.574050508,36.5851771 1.256013,36.999035 2,37 L3.5,37 C3.84480965,37.6090457 4.01763407,38.3003434 4,39 C4.00832504,39.5708401 3.89551058,40.1369574 3.669,40.661 C3.44824771,41.1785027 3.46468621,41.7666357 3.714,42.271 C3.96338828,42.7714899 4.42007781,43.137134 4.963,43.271 L5.579,43.421 C5.14242368,43.7839315 4.88992898,44.3222693 4.89,44.89 C4.88443005,45.6177159 5.29869331,46.2834962 5.954,46.6 C6.09022168,46.6659754 6.23964257,46.7001678 6.391,46.7 C6.47390786,46.7005316 6.54841728,46.7507147 6.58007291,46.8273431 C6.61172853,46.9039715 6.59436038,46.9921097 6.536,47.051 L5.536,48.051 C4.63859869,48.9528838 4.14792073,50.1818065 4.17736489,51.4537564 C4.20680905,52.7257063 4.75382719,53.9306076 5.692,54.79 C6.5850442,55.5883037 7.74633528,56.0203954 8.944,56 L16.66,56 C17.5757531,56.0018118 18.3740304,56.6235628 18.6,57.511 L19.029,59.241 C19.1397719,59.6870872 19.5403652,60.0002183 20,60 L49,60 C49.5522847,60 50,59.5522847 50,59 L50,48.922 C49.9896216,48.3582781 50.2246235,47.8178468 50.644,47.441 C59.3937487,39.8795169 62.3564822,27.5854205 58.0116633,16.8682997 C53.6668444,6.1511789 42.9793391,-0.608985674 31.4341999,0.0572645803 C19.8890606,0.723514834 10.0501485,8.66822387 6.967,19.814 C6.73213687,20.6750315 6.88167151,21.5955813 7.377,22.338 C7.49978882,22.5265547 7.56670111,22.7460131 7.57,22.971 C7.56981616,23.2019959 7.49821275,23.4272846 7.365,23.616 L0.36,33.859 Z M9.053,21.246 C8.87131435,20.9835158 8.8135842,20.6546731 8.895,20.346 C11.7439001,10.020168 20.8533359,2.65586434 31.5468792,2.03363446 C42.2404225,1.41140458 52.1425093,7.66947646 56.1697956,17.5952008 C60.1970819,27.5209251 57.4549085,38.9093084 49.351,45.914 L49.346,45.914 C48.1525251,46.9462055 46.8648887,47.8642239 45.5,48.656 C45.1091084,48.882748 44.9188594,49.3434704 45.0358789,49.7799534 C45.1528985,50.2164363 45.5481037,50.5202005 46,50.521 C46.1756138,50.5215641 46.3482044,50.4753098 46.5,50.387 C47.013,50.087 47.5,49.754 48,49.423 L48,58 L20.782,58 L20.539,57.021 C20.4434042,56.6623167 20.2983456,56.3186861 20.108,56 L28.528,56 C31.6526075,56.0126664 34.5122323,54.2465416 35.9,51.447 C36.1468713,50.9527051 35.9462949,50.3518713 35.452,50.105 C34.9577051,49.8581287 34.3568713,50.0587051 34.11,50.553 C33.059452,52.6729515 30.8939547,54.0101907 28.528,54 L17,54 C16.964,54 16.934,54.017 16.9,54.02 C16.819,54.015 16.742,54 16.66,54 L8.944,54 C8.24792803,54.0210532 7.56949661,53.7789603 7.044,53.322 C6.50509389,52.8323355 6.18964109,52.1437525 6.17075919,51.4158551 C6.15187728,50.6879578 6.43120571,49.983946 6.944,49.467 L7.944,48.467 C8.4905816,47.9237635 8.71422939,47.1347696 8.53401629,46.3855163 C8.35380319,45.6362629 7.79583012,45.0352673 7.062,44.8 C7.59086127,44.3301842 7.81619984,43.6062167 7.64739352,42.9192484 C7.47858719,42.23228 6.94337578,41.6951998 6.257,41.524 L5.548,41.352 C5.85389443,40.6059538 6.00757186,39.8062872 6,39 C6.00368008,38.3201389 5.89487824,37.6443512 5.678,37 L5.76,37 C6.28990234,37.0020592 6.79762077,37.2129797 7.173,37.587 L7.293,37.707 C7.68537889,38.0859722 8.30908478,38.0805524 8.69481858,37.6948186 C9.08055237,37.3090848 9.08597221,36.6853789 8.707,36.293 L8.587,36.173 C7.83583306,35.425083 6.82000884,35.0035896 5.76,35 L4,35 L2,34.995 L9.012,24.751 C9.37563739,24.2286835 9.57038906,23.6074326 9.57,22.971 C9.56690983,22.3582808 9.38742373,21.7594152 9.053,21.246 Z"></path><path d="M30,33 L38,33 C39.6568542,33 41,31.6568542 41,30 L41,22 C41,20.3431458 39.6568542,19 38,19 L30,19 C28.3431458,19 27,20.3431458 27,22 L27,30 C27,31.6568542 28.3431458,33 30,33 Z M29,22 C29,21.4477153 29.4477153,21 30,21 L38,21 C38.5522847,21 39,21.4477153 39,22 L39,30 C39,30.5522847 38.5522847,31 38,31 L30,31 C29.4477153,31 29,30.5522847 29,30 L29,22 Z"></path><path d="M19,33 C18.4477153,33 18,33.4477153 18,34 C18,34.5522847 18.4477153,35 19,35 L22.142,35 C22.5061725,36.4002987 23.5997013,37.4938275 25,37.858 L25,41 C25,41.5522847 25.4477153,42 26,42 C26.5522847,42 27,41.5522847 27,41 L27,38 L29,38 L29,41 C29,41.5522847 29.4477153,42 30,42 C30.5522847,42 31,41.5522847 31,41 L31,38 L33,38 L33,41 C33,41.5522847 33.4477153,42 34,42 C34.5522847,42 35,41.5522847 35,41 L35,38 L37,38 L37,41 C37,41.5522847 37.4477153,42 38,42 C38.5522847,42 39,41.5522847 39,41 L39,38 L41,38 L41,41 C41,41.5522847 41.4477153,42 42,42 C42.5522847,42 43,41.5522847 43,41 L43,37.858 C44.4002987,37.4938275 45.4938275,36.4002987 45.858,35 L49,35 C49.5522847,35 50,34.5522847 50,34 C50,33.4477153 49.5522847,33 49,33 L46,33 L46,31 L49,31 C49.5522847,31 50,30.5522847 50,30 C50,29.4477153 49.5522847,29 49,29 L46,29 L46,27 L49,27 C49.5522847,27 50,26.5522847 50,26 C50,25.4477153 49.5522847,25 49,25 L46,25 L46,23 L49,23 C49.5522847,23 50,22.5522847 50,22 C50,21.4477153 49.5522847,21 49,21 L46,21 L46,19 L49,19 C49.5522847,19 50,18.5522847 50,18 C50,17.4477153 49.5522847,17 49,17 L45.858,17 C45.4938275,15.5997013 44.4002987,14.5061725 43,14.142 L43,11 C43,10.4477153 42.5522847,10 42,10 C41.4477153,10 41,10.4477153 41,11 L41,14 L39,14 L39,11 C39,10.4477153 38.5522847,10 38,10 C37.4477153,10 37,10.4477153 37,11 L37,14 L35,14 L35,11 C35,10.4477153 34.5522847,10 34,10 C33.4477153,10 33,10.4477153 33,11 L33,14 L31,14 L31,11 C31,10.4477153 30.5522847,10 30,10 C29.4477153,10 29,10.4477153 29,11 L29,14 L27,14 L27,11 C27,10.4477153 26.5522847,10 26,10 C25.4477153,10 25,10.4477153 25,11 L25,14.142 C23.5997013,14.5061725 22.5061725,15.5997013 22.142,17 L19,17 C18.4477153,17 18,17.4477153 18,18 C18,18.5522847 18.4477153,19 19,19 L22,19 L22,21 L19,21 C18.4477153,21 18,21.4477153 18,22 C18,22.5522847 18.4477153,23 19,23 L22,23 L22,25 L19,25 C18.4477153,25 18,25.4477153 18,26 C18,26.5522847 18.4477153,27 19,27 L22,27 L22,29 L19,29 C18.4477153,29 18,29.4477153 18,30 C18,30.5522847 18.4477153,31 19,31 L22,31 L22,33 L19,33 Z M26,16 L42,16 C43.1045695,16 44,16.8954305 44,18 L44,34 C44,35.1045695 43.1045695,36 42,36 L26,36 C24.8954305,36 24,35.1045695 24,34 L24,18 C24,16.8954305 24.8954305,16 26,16 Z"></path><path d="M32,25 L33,25 C33.5522847,25 34,24.5522847 34,24 C34,23.4477153 33.5522847,23 33,23 L32,23 C31.4477153,23 31,23.4477153 31,24 C31,24.5522847 31.4477153,25 32,25 Z"></path><path d="M35,29 L36,29 C36.5522847,29 37,28.5522847 37,28 C37,27.4477153 36.5522847,27 36,27 L35,27 C34.4477153,27 34,27.4477153 34,28 C34,28.5522847 34.4477153,29 35,29 Z"></path></g></g></svg>

package/static/img/features/api.svg

@@ -0,0 +1 @@
+<svg height='100px' width='100px'  fill="#000000" xmlns="http://www.w3.org/2000/svg" data-name="Слой 1" viewBox="0 0 128 128" x="0px" y="0px"><title>ic_api_gears</title><path d="M86,86a15.76,15.76,0,1,0,22.29,0A15.77,15.77,0,0,0,86,86ZM105.5,105.5a11.75,11.75,0,0,1-16.63,0,11.76,11.76,0,1,1,16.63,0Z"></path><path d="M126.65,99.51a2,2,0,0,0-1.25-1l-3.16-.85q0-.5,0-1l3.16-.85a2,2,0,0,0,1.25-1c.31-.58,1.82-3.57,1.2-5.89s-3.43-4.15-4-4.5a2,2,0,0,0-1.57-.23l-3.15.85c-.16-.29-.33-.58-.5-.86L121,81.92a2,2,0,0,0,.59-1.48c0-.65-.21-4-1.91-5.7s-5-1.88-5.7-1.9a1.92,1.92,0,0,0-1.47.58l-2.31,2.31-.86-.5.84-3.15a2,2,0,0,0-.23-1.57c-.34-.56-2.18-3.36-4.5-4s-5.31.89-5.89,1.2a2,2,0,0,0-1,1.24l-.85,3.16h-1L95.84,69a2,2,0,0,0-1-1.24c-.58-.31-3.57-1.83-5.89-1.2s-4.16,3.42-4.5,4a2,2,0,0,0-.23,1.57l.85,3.15-.86.5-2.31-2.31a2,2,0,0,0-1.48-.58c-.65,0-4,.2-5.7,1.9s-1.88,5.05-1.9,5.7a2,2,0,0,0,.58,1.48l2.31,2.31c-.17.28-.34.57-.5.86l-3.15-.85a2,2,0,0,0-1.57.23c-.56.35-3.36,2.18-4,4.5s.89,5.31,1.2,5.89a2,2,0,0,0,1.24,1l3.16.85q0,.5,0,1L69,98.53a2,2,0,0,0-1.24,1c-.31.58-1.83,3.57-1.21,5.89s3.43,4.16,4,4.5a2,2,0,0,0,1.57.23l3.15-.84c.16.29.33.57.5.86l-2.31,2.31a2,2,0,0,0-.58,1.47c0,.65.2,4,1.9,5.7s5.05,1.89,5.7,1.91a2,2,0,0,0,1.48-.59l2.31-2.31.86.5-.85,3.15a2,2,0,0,0,.23,1.57c.34.56,2.18,3.36,4.5,4a4.89,4.89,0,0,0,1.21.15,11.27,11.27,0,0,0,4.68-1.35,2,2,0,0,0,1-1.25l.85-3.16q.5,0,1,0l.85,3.16a2,2,0,0,0,1,1.25c.58.31,3.57,1.82,5.89,1.2s4.16-3.43,4.5-4a2,2,0,0,0,.23-1.57l-.84-3.15.86-.5,2.31,2.31a1.93,1.93,0,0,0,1.47.59c.65,0,4-.21,5.7-1.91s1.89-5,1.91-5.7a2,2,0,0,0-.59-1.47l-2.31-2.31c.17-.29.34-.57.5-.86l3.15.84a2,2,0,0,0,1.57-.23c.56-.34,3.36-2.18,4-4.5S127,100.09,126.65,99.51ZM124,104.37a5,5,0,0,1-1.55,1.66l-3.82-1a2,2,0,0,0-2.33,1.09,21.56,21.56,0,0,1-1.84,3.17,2,2,0,0,0,.22,2.57l2.81,2.8a5.06,5.06,0,0,1-.67,2.17,5,5,0,0,1-2.17.67l-2.8-2.81a2,2,0,0,0-2.57-.22,19.91,19.91,0,0,1-3.17,1.84,2,2,0,0,0-1.09,2.33l1,3.82a5,5,0,0,1-1.66,1.55,4.86,4.86,0,0,1-2.22-.51l-1-3.83A2,2,0,0,0,99,118.17a22.49,22.49,0,0,1-3.67,0,2,2,0,0,0-2.1,1.47l-1,3.83A5,5,0,0,1,90,124a4.9,4.9,0,0,1-1.67-1.55l1-3.82a2,2,0,0,0-1.09-2.33,20.36,20.36,0,0,1-3.17-1.84,2,2,0,0,0-2.56.22l-2.81,2.81a5.11,5.11,0,0,1-2.17-.67,5,5,0,0,1-.67-2.17l2.81-2.8a2,2,0,0,0,.22-2.57,21.05,21.05,0,0,1-1.84-3.17A2,2,0,0,0,75.76,105l-3.82,1a5.08,5.08,0,0,1-1.55-1.66,5,5,0,0,1,.51-2.22l3.83-1A2,2,0,0,0,76.21,99a20.45,20.45,0,0,1,0-3.67,2,2,0,0,0-1.48-2.1l-3.83-1A5,5,0,0,1,70.39,90a4.9,4.9,0,0,1,1.55-1.67l3.82,1a2,2,0,0,0,2.33-1.09,22.09,22.09,0,0,1,1.84-3.17,2,2,0,0,0-.22-2.56L76.9,79.74a5.11,5.11,0,0,1,.67-2.17,5,5,0,0,1,2.17-.67l2.81,2.81a2,2,0,0,0,2.56.22,22.09,22.09,0,0,1,3.17-1.84,2,2,0,0,0,1.09-2.33l-1-3.82A5,5,0,0,1,90,70.39a5,5,0,0,1,2.21.51l1,3.83a2,2,0,0,0,2.1,1.48,20.45,20.45,0,0,1,3.67,0,2,2,0,0,0,2.11-1.48l1-3.83a5.11,5.11,0,0,1,2.22-.51A5,5,0,0,1,106,71.94l-1,3.82a2,2,0,0,0,1.09,2.33,21.56,21.56,0,0,1,3.17,1.84,2,2,0,0,0,2.57-.22l2.8-2.81a5,5,0,0,1,2.17.67,4.86,4.86,0,0,1,.67,2.17l-2.81,2.81a2,2,0,0,0-.22,2.56,21.19,21.19,0,0,1,1.84,3.17,2,2,0,0,0,2.33,1.09l3.82-1A4.9,4.9,0,0,1,124,90a4.83,4.83,0,0,1-.51,2.21l-3.83,1a2,2,0,0,0-1.47,2.1,22.49,22.49,0,0,1,0,3.67,2,2,0,0,0,1.47,2.11l3.83,1A4.94,4.94,0,0,1,124,104.37Z"></path><path d="M69.71,74.69a2,2,0,0,0-.26-.76l-.91-1.59a35.88,35.88,0,0,0,3.8-3.8l1.59.91a2,2,0,0,0,.76.26c3.63.43,8.24.44,9.62-1.94s-1-6.37-3.14-9.3a2,2,0,0,0-.6-.53L79,57a35,35,0,0,0,1.39-5.2h1.83a2.14,2.14,0,0,0,.79-.16c3.36-1.44,7.36-3.74,7.36-6.49s-4-5-7.36-6.48a2,2,0,0,0-.79-.16H80.38A34.8,34.8,0,0,0,79,33.33l1.58-.91a1.91,1.91,0,0,0,.6-.53c2.19-2.93,4.51-6.92,3.14-9.3s-6-2.37-9.62-1.93a2,2,0,0,0-.76.25l-1.59.92A35.14,35.14,0,0,0,68.53,18l.92-1.59a2,2,0,0,0,.26-.76c.43-3.63.44-8.24-1.94-9.62s-6.37,1-9.3,3.14a2,2,0,0,0-.53.6L57,11.37A35,35,0,0,0,51.83,10V8.15a2.14,2.14,0,0,0-.16-.79C50.23,4,47.93,0,45.18,0s-5,4-6.48,7.36a2,2,0,0,0-.17.79V10a35,35,0,0,0-5.2,1.39l-.91-1.58a1.91,1.91,0,0,0-.53-.6C29,7,25,4.68,22.59,6.05s-2.37,6-1.93,9.62a1.85,1.85,0,0,0,.25.76L21.83,18A36.07,36.07,0,0,0,18,21.83l-1.59-.92a2,2,0,0,0-.76-.25c-3.63-.44-8.24-.45-9.62,1.93S7,29,9.19,31.89a1.91,1.91,0,0,0,.6.53l1.58.91A34.8,34.8,0,0,0,10,38.54H8.15a2,2,0,0,0-.79.16C4,40.14,0,42.43,0,45.18s4,5,7.36,6.49a2.14,2.14,0,0,0,.79.16H10A35,35,0,0,0,11.37,57l-1.58.91a2,2,0,0,0-.6.53C7,61.4,4.68,65.39,6.05,67.77s6,2.37,9.62,1.94a2,2,0,0,0,.76-.26L18,68.54a36,36,0,0,0,3.81,3.8l-.92,1.59a1.85,1.85,0,0,0-.25.76c-.44,3.63-.45,8.24,1.93,9.62s6.37-1,9.3-3.14a1.91,1.91,0,0,0,.53-.6L33.33,79a35,35,0,0,0,5.2,1.39v1.83a2,2,0,0,0,.17.79c1.44,3.36,3.73,7.36,6.48,7.36s5-4,6.49-7.36a2.14,2.14,0,0,0,.16-.79V80.38A34.36,34.36,0,0,0,57,79l.91,1.58a2,2,0,0,0,.53.6c2.93,2.19,6.92,4.51,9.3,3.14S70.14,78.32,69.71,74.69Zm-5-4.4a2,2,0,0,0-.5,2.58l1.56,2.69a18.23,18.23,0,0,1-.1,5.12,18,18,0,0,1-4.49-2.47l-1.55-2.69a2,2,0,0,0-2.48-.85,31.56,31.56,0,0,1-7.61,2,2,2,0,0,0-1.72,2v3.11a17.91,17.91,0,0,1-2.65,4.38,18.56,18.56,0,0,1-2.65-4.38V78.68a2,2,0,0,0-1.72-2,31.56,31.56,0,0,1-7.61-2,2,2,0,0,0-2.48.85l-1.55,2.69a18.12,18.12,0,0,1-4.48,2.47,17.78,17.78,0,0,1-.11-5.12l1.56-2.69a2,2,0,0,0-.5-2.58,31.92,31.92,0,0,1-5.57-5.57,2,2,0,0,0-2.58-.5L14.8,65.78a17.79,17.79,0,0,1-5.12-.11,18.12,18.12,0,0,1,2.47-4.48l2.69-1.55a2,2,0,0,0,.85-2.48,31.69,31.69,0,0,1-2-7.61,2,2,0,0,0-2-1.72H8.57a17.91,17.91,0,0,1-4.38-2.65,18.26,18.26,0,0,1,4.38-2.64h3.11a2,2,0,0,0,2-1.73,31.81,31.81,0,0,1,2-7.61,2,2,0,0,0-.85-2.48l-2.69-1.55a18.12,18.12,0,0,1-2.47-4.48,17.79,17.79,0,0,1,5.12-.11l2.69,1.56a2,2,0,0,0,2.58-.5,31.92,31.92,0,0,1,5.57-5.57,2,2,0,0,0,.5-2.58L24.58,14.8a17.79,17.79,0,0,1,.11-5.12,18.12,18.12,0,0,1,4.48,2.47l1.55,2.69a2,2,0,0,0,2.48.85,31.81,31.81,0,0,1,7.61-2,2,2,0,0,0,1.72-2V8.57a18.56,18.56,0,0,1,2.65-4.38,17.91,17.91,0,0,1,2.65,4.38v3.11a2,2,0,0,0,1.72,2,31.69,31.69,0,0,1,7.61,2,2,2,0,0,0,2.48-.85l1.55-2.69a18,18,0,0,1,4.49-2.47,18.24,18.24,0,0,1,.1,5.12l-1.56,2.69a2,2,0,0,0,.5,2.58,31.58,31.58,0,0,1,5.57,5.57,2,2,0,0,0,2.58.5l2.69-1.56a17.78,17.78,0,0,1,5.12.11,18.12,18.12,0,0,1-2.47,4.48l-2.69,1.55a2,2,0,0,0-.85,2.48,31.81,31.81,0,0,1,2,7.61,2,2,0,0,0,2,1.73h3.11a17.63,17.63,0,0,1,4.38,2.64,17.91,17.91,0,0,1-4.38,2.65H78.68a2,2,0,0,0-2,1.72,31.69,31.69,0,0,1-2,7.61,2,2,0,0,0,.85,2.48l2.69,1.55a18.12,18.12,0,0,1,2.47,4.48,17.78,17.78,0,0,1-5.12.11l-2.69-1.56a2,2,0,0,0-2.58.5A31.92,31.92,0,0,1,64.72,70.29Z"></path><path d="M72,54a2,2,0,0,0-2-2H68V36h2a2,2,0,0,0,0-4H62a2,2,0,0,0,0,4h2V52H62a2,2,0,0,0,0,4h8A2,2,0,0,0,72,54Z"></path><path d="M29.83,33.13A2,2,0,0,0,28,31.87h0a2,2,0,0,0-1.85,1.26l-8,20.17a2,2,0,0,0,1.12,2.6A1.94,1.94,0,0,0,20,56a2,2,0,0,0,1.86-1.26l2.24-5.67h7.79l2.25,5.67a2,2,0,0,0,3.72-1.48Zm-4.15,12L28,39.29l2.31,5.82Z"></path><path d="M49,32H44a2,2,0,0,0-2,2V54a2,2,0,0,0,4,0V49h3c5,0,9-3.73,9-8.5S54.05,32,49,32Zm0,13H46V36h3a4.72,4.72,0,0,1,5,4.5A4.72,4.72,0,0,1,49,45Z"></path></svg>