Merge branch 'release/v1.2' of github.com:ONLYOFFICE/AppServer into release/v1.2
This commit is contained in:
commit
27f1138a5d
@ -52,13 +52,13 @@ const globalColors = {
|
||||
hoverInfo: "#EED27B",
|
||||
hoverWarning: "#EEB97B",
|
||||
|
||||
firstDefaultСolorScheme: "#4781D1",
|
||||
secondDefaultСolorScheme: "#ED7309",
|
||||
thirdDefaultСolorScheme: "#08AAA0",
|
||||
fourthDefaultСolorScheme: "#F2665A",
|
||||
fifthDefaultСolorScheme: "#6D4EC2",
|
||||
sixthDefaultСolorScheme: "#11A3D4",
|
||||
seventhDefaultСolorScheme: "#444444",
|
||||
colorSchemeDefault_1: "#4781D1",
|
||||
colorSchemeDefault_2: "#ED7309",
|
||||
colorSchemeDefault_3: "#08AAA0",
|
||||
colorSchemeDefault_4: "#F2665A",
|
||||
colorSchemeDefault_5: "#6D4EC2",
|
||||
colorSchemeDefault_6: "#11A3D4",
|
||||
colorSchemeDefault_7: "#444444",
|
||||
};
|
||||
|
||||
export default globalColors;
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Seçilmiş elementlər",
|
||||
"LastModifiedBy": "tərəfindən Son Dəyişiklik",
|
||||
"Members": "üzvlər",
|
||||
"OFORMsDescription": "Formanı onlayn doldurun və sadə Dizayn Layihəsi Təklifini hazırlayın, yaxud da DOCXF, OFORM və ya PDF formatlarında doldurulabilən şablonu endirin. <1>Frilans dizayner komandasına layihə və ya layihələr silsiləsi təklif edin. Layihə və tapşırıq strukturunu, ödəniş və şərtləri təsvir edin.</1>",
|
||||
"OpenSharingSettings": "Paylaşma ayarlarını açın",
|
||||
"SystemProperties": "Sistem xüsusiyyətləri",
|
||||
"Versions": "Versiyalar",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Избрани елементи",
|
||||
"LastModifiedBy": "Последно модифициран от",
|
||||
"Members": "членове",
|
||||
"OFORMsDescription": "Попълнете формуляра онлайн и получете готово просто предложение за проект на дизайна или просто изтеглете шаблона за попълване в желания формат: DOCXF, OFORM или PDF. <1>Предложете проект или поредица от проекти на фрийленс дизайнерски екип. Очертайте структурата на проекта и задачата, плащанията и условията.</1>",
|
||||
"OpenSharingSettings": "Отваряне на настройките за споделяне",
|
||||
"SystemProperties": "Свойства на системата",
|
||||
"Versions": "Версии",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Vybrané položky",
|
||||
"LastModifiedBy": "Naposledy upravil(a)",
|
||||
"Members": "členové",
|
||||
"OFORMsDescription": "Vyplňte formulář online a získejte jednoduchý návrh projektu nebo si stáhněte vyplnitelnou šablonu v požadovaném formátu: DOCXF, OFORM nebo PDF. Navrhněte projekt nebo sérii projektů týmu nezávislých designérů. Načrtněte strukturu projektu a úkolů, platby a podmínky.",
|
||||
"OpenSharingSettings": "Otevřít nastavení sdílení",
|
||||
"SystemProperties": "Vlastnosti systému",
|
||||
"Versions": "Verze",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Ausgewählte Elemente",
|
||||
"LastModifiedBy": "Zuletzt geändert von",
|
||||
"Members": "mitglieder",
|
||||
"OFORMsDescription": "Füllen Sie das Formular online aus und erhalten Sie einen einfachen Projektvorschlag oder laden Sie eine ausfüllbare Vorlage im gewünschten Format herunter: DOCXF, OFORM oder PDF. <1>Schlagen Sie dem freiberuflichen Entwicklungsteam ein Projekt oder eine Reihe von Projekten vor. Beschreiben Sie die Projekt- und Aufgabenstruktur, die Zahlungsmöglichkeiten und Bedingungen.</1>",
|
||||
"OpenSharingSettings": "Freigabeeinstellungen öffnen",
|
||||
"SystemProperties": "Eigenschaften des Systems",
|
||||
"Versions": "Versionen",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Επιλεγμένα στοιχεία",
|
||||
"LastModifiedBy": "Τελευταία Τροποποίηση Από",
|
||||
"Members": "mέλη",
|
||||
"OFORMsDescription": "Συμπληρώστε τη φόρμα ηλεκτρονικά και λάβετε μια απλή Πρόταση Σχεδιασμού Έργου ή απλά κατεβάστε το υπόδειγμα που μπορεί να συμπληρωθεί στην επιθυμητή μορφή: DOCXF, OFORM ή PDF. <1>Προτείνετε ένα έργο ή μια σειρά έργων σε μια ομάδα ελεύθερων επαγγελματιών σχεδιαστών. Περιγράψτε τη δομή των εργασιών και του έργου, τις πληρωμές και τους όρους.</1>",
|
||||
"OpenSharingSettings": "Άνοιγμα ρυθμίσεων κοινής χρήσης",
|
||||
"SystemProperties": "Ιδιότητες συστήματος",
|
||||
"Versions": "Εκδόσεις",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Items selected",
|
||||
"LastModifiedBy": "Last modified by",
|
||||
"Members": "members",
|
||||
"OFORMsDescription": "Fill out the form online and get a simple Design Project Proposal ready, or just download the fillable template in the desirable format: DOCXF, OFORM, or PDF. <1>Propose a project or a series of projects to a freelance designer team. Outline project and task structure, payments, and terms.</1>",
|
||||
"OpenSharingSettings": "Open sharing settings",
|
||||
"SystemProperties": "System properties",
|
||||
"Versions": "Versions",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Elementos seleccionados",
|
||||
"LastModifiedBy": "Ultima modificación por",
|
||||
"Members": "miembros",
|
||||
"OFORMsDescription": "Rellene el formulario en línea y obtenga una sencilla propuesta de proyecto de diseño, o descárguese la plantilla rellenable en el formato deseado: DOCXF, OFORM o PDF. <1>Proponga un proyecto o una serie de proyectos a un equipo de diseñadores autónomos. Describa la estructura del proyecto y de las tareas, los pagos y las condiciones.</1>",
|
||||
"OpenSharingSettings": "Abrir los ajustes de uso compartido",
|
||||
"SystemProperties": "Propiedades del sistema",
|
||||
"Versions": "Versiones",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Valitut kohteet",
|
||||
"LastModifiedBy": "Viimeksi muokannut",
|
||||
"Members": "jäsenet",
|
||||
"OFORMsDescription": "Täytä lomake verkossa ja saat vaivattomasti suunnitteluprojektiehdotuksen valmiiksi tai lataa täytettävä malli haluamassasi muodossa: DOCXF, OFORM, tai PDF. <1>Ehdota projektia tai projekteja freelance-suunnittelutiimille. Esittele projektin ja tehtävän rakenne, maksut ja ehdot.</1>",
|
||||
"OpenSharingSettings": "Avaa jakamisasetukset",
|
||||
"SystemProperties": "Järjestelmän ominaisuudet",
|
||||
"Versions": "Versiot",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Éléments sélectionnés",
|
||||
"LastModifiedBy": "Dernière modification par",
|
||||
"Members": "membres",
|
||||
"OFORMsDescription": "Remplissez le formulaire en ligne et obtenez une proposition de projet de conception simple, ou téléchargez le modèle à remplir dans le format souhaité : DOCXF, OFORM, ou PDF. <1>Proposez un projet ou une série de projets à une équipe de designers indépendants. Décrivez la structure du projet et les tâches, les modalités de paiement et les conditions.</1>",
|
||||
"OpenSharingSettings": "Ouvrir les paramètres de partage",
|
||||
"SystemProperties": "Propriétés du système",
|
||||
"Versions": "Versions",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Elementi selezionati",
|
||||
"LastModifiedBy": "Ultima modifica di",
|
||||
"Members": "membri",
|
||||
"OFORMsDescription": "Compila il modulo online e ottieni una semplice Proposta di Progettazione pronta, oppure scarica semplicemente il modello compilabile nel formato desiderato: DOCXF, OFORM o PDF. <1>Proponi un progetto o una serie di progetti a un team di designer freelance. Definisci il progetto e la struttura delle attività, i pagamenti e i termini.</1>",
|
||||
"OpenSharingSettings": "Aprire impostazioni di condivisione",
|
||||
"SystemProperties": "Proprietà di sistema",
|
||||
"Versions": "Versioni",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "選択されているアイテム",
|
||||
"LastModifiedBy": "最終更新者",
|
||||
"Members": "メンバー",
|
||||
"OFORMsDescription": "オンラインでフォームに記入して、簡単なプロジェクト提案書を受け取るか、必要なフォーマット（DOCXF、OFORM、PDF）で記入可能なテンプレートをダウンロードできます。 <1>フリーランスの開発チームにプロジェクトまたは一連のプロジェクトを提案して、プロジェクトやタスクの構成、支払い方法、条件などを教えてください。</1>",
|
||||
"OpenSharingSettings": "共有設定を開く",
|
||||
"SystemProperties": "システムのプロパティ",
|
||||
"Versions": "バージョン",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "선택된 항목",
|
||||
"LastModifiedBy": "최종 편집자",
|
||||
"Members": "구성원",
|
||||
"OFORMsDescription": "온라인으로 양식을 작성하고 간단한 디자인 프로젝트 제안서를 준비하거나, 원하는 형식(DOCXF, OFORM 또는 PDF)의 템플릿을 다운로드하세요.<1>프리랜스 디자이너 팀에 하나 이상의 프로젝트를 제안해주세요. 프로젝트 및 작업 구조, 지불 및 조건을 간략하게 설명해주세요.</1>",
|
||||
"OpenSharingSettings": "공유 설정 열기",
|
||||
"SystemProperties": "시스템 속성",
|
||||
"Versions": "버전",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Atlasītie vienumi",
|
||||
"LastModifiedBy": "Pēdējo reizi modificēja:",
|
||||
"Members": "locekļi",
|
||||
"OFORMsDescription": "Aizpildiet veidlapu tiešsaistē un sagatavojiet vienkāršu dizaina projekta priekšlikumu vai vienkārši lejupielādējiet aizpildāmo veidni vēlamajā formātā: DOCXF, OFORM vai PDF. <1>Ierosiniet projektu vai projektu sēriju ārštata dizaineru komandai. Ieskicējiet projekta un uzdevuma struktūru, maksājumus un termiņus.</1>",
|
||||
"OpenSharingSettings": "Atvērt koplietošanas iestatījumus",
|
||||
"SystemProperties": "Sistēmas īpašības",
|
||||
"Versions": "Versijas",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Geselecteerde items",
|
||||
"LastModifiedBy": "Laatst aangepast door",
|
||||
"Members": "leden",
|
||||
"OFORMsDescription": "Vul het formulier online in en u krijgt een eenvoudig Ontwerp Projectvoorstel in handen, of download gewoon het invulbare sjabloon in het gewenste formaat: DOCXF, OFORM, of PDF. <1>Stel een project of een reeks projecten voor aan een freelance ontwerpersteam. Schets de project- en taakstructuur, de betalingen, en de voorwaarden.</1>",
|
||||
"OpenSharingSettings": "Instellingen voor delen openen",
|
||||
"SystemProperties": "Systeemeigenschappen",
|
||||
"Versions": "Versies",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Wybrano elementy",
|
||||
"LastModifiedBy": "Ostatnio zmodyfikowany przez",
|
||||
"Members": "członkowie",
|
||||
"OFORMsDescription": "Wypełnij formularz online, aby otrzymać prostą gotową Propozycję Projektu lub po prostu pobierz i wypełnij szablon w preferowanym formacie: DOCXF, OFORM lub PDF. <1>Zaproponuj projekt lub serię projektów zespołowi freelancerów zajmujących się designem. Przedstaw strukturę projektu, zadań oraz płatności i warunków współpracy.</1>",
|
||||
"OpenSharingSettings": "Otwórz ustawienia udostępniania",
|
||||
"SystemProperties": "Właściwości systemu",
|
||||
"Versions": "Wersje",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Itens selecionados",
|
||||
"LastModifiedBy": "Última Modificação Por",
|
||||
"Members": "membros",
|
||||
"OFORMsDescription": "Preencha o formulário online e elabore uma Proposta de Projeto de Design simples, ou apenas baixe o modelo preenchível no formato desejado: DOCXF, OFORM ou PDF. Proponha um projeto ou uma série de projetos para uma equipe de designers freelance. Esboce a estrutura, pagamentos e termos do projeto e da tarefa.",
|
||||
"OpenSharingSettings": "Abrir as configurações de rede",
|
||||
"SystemProperties": "Propriedades do sistema",
|
||||
"Versions": "Versões",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Itens selecionados",
|
||||
"LastModifiedBy": "Modificado por",
|
||||
"Members": "membros",
|
||||
"OFORMsDescription": "Preencha o formulário online e obtenha uma Proposta de Projeto com um Design simples, ou simplesmente descarregue o modelo a preenchível no formato que desejar: DOCXF, OFORM ou PDF. Proponha um projeto ou uma série de projetos a uma equipa de designers freelancers (trabalhadores independentes). Faça um esboço do projeto e da estrutura de tarefas, pagamentos, e dos termos.",
|
||||
"OpenSharingSettings": "Abrir definições de compartilhamento",
|
||||
"SystemProperties": "Propriedades do sistema",
|
||||
"Versions": "Versões",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Elemente selectate",
|
||||
"LastModifiedBy": "Modificat ultima dată de către",
|
||||
"Members": "membrii",
|
||||
"OFORMsDescription": "Completați formularul online și obțineți un simplu Proiect de Design, sau descărcați șablonul spre completare în formatul dorit: DOCXF, OFORM sau PDF. <1>Propuneți un proiect sau o serie de proiecte unei echipe de designeri freelance. Descrieți structura proiectului și sarcinilor, metodele de plată și condițiile.</1>",
|
||||
"OpenSharingSettings": "Deschide setările de partajare",
|
||||
"SystemProperties": "Proprietăți sistem",
|
||||
"Versions": "Versiuni",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Выбрано элементов",
|
||||
"LastModifiedBy": "Автор последнего корректива",
|
||||
"Members": "участников",
|
||||
"OFORMsDescription": "Заполните форму онлайн и получите простое проектное предложение или скачайте заполняемый шаблон в нужном формате: DOCXF, OFORM или PDF. <1>Предложите проект или серию проектов команде внештатных разработчиков. Опишите проект и структуру задачи, способы оплаты и условия.</1>",
|
||||
"OpenSharingSettings": "Открыть настройки общего доступа",
|
||||
"SystemProperties": "Системные свойства",
|
||||
"Versions": "Версии",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Vybraté položky",
|
||||
"LastModifiedBy": "Naposledy upravené",
|
||||
"Members": "členovia",
|
||||
"OFORMsDescription": "Vyplňte formulár online a dostanete jednoduchý návrh dizajn-projektu, alebo si jednoducho stiahnite šablónu, ktorú možno vyplniť v požadovanom formáte: DOCXF, OFORM alebo PDF. Navrhnite projekt alebo sériu projektov tímu dizajnérov-freelancerov. Načrtnite štruktúru projektu a úloh, platieb a podmienok.",
|
||||
"OpenSharingSettings": "Otvoriť nastavenia zdieľania",
|
||||
"SystemProperties": "Vlastnosti systému",
|
||||
"Versions": "Verzie",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Predmeti izbrani",
|
||||
"LastModifiedBy": "Nazadnje spremenjeno",
|
||||
"Members": "člani",
|
||||
"OFORMsDescription": "Izpolnite spletni obrazec in uredite preprost predlog projekta ali pa enostavno v izbranem formatu prenesite predlogo, ki jo lahko izpolnite: DOCXF, OFORM ali PDF. <1>Predlagajte projekt ali vrsto projektov samostojni oblikovalski skupini. Opišite strukturo projekta in naloge, plačila in pogoje.</1>",
|
||||
"OpenSharingSettings": "Odpri nastavitve skupne rabe",
|
||||
"SystemProperties": "Lastnosti sistema",
|
||||
"Versions": "Verzije",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Seçili öğeler",
|
||||
"LastModifiedBy": "Son Düzenleyen",
|
||||
"Members": "üyeler",
|
||||
"OFORMsDescription": "Formu çevrimiçi olarak doldurun ve basit bir Tasarım Projesi Teklifi hazırlayın veya doldurulabilir şablonu istediğiniz formatta indirin: DOCXF, OFORM veya PDF. Serbest çalışan bir tasarımcı ekibine bir proje veya bir dizi proje önerin. Proje ve görev yapısı, ödemeler ve şartları belirleyin.",
|
||||
"OpenSharingSettings": "Paylaşım ayarlarını aç",
|
||||
"SystemProperties": "Sistem özellikleri",
|
||||
"Versions": "Sürümler",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Вибрані елементи",
|
||||
"LastModifiedBy": "Автор останньої зміни",
|
||||
"Members": "учасники",
|
||||
"OFORMsDescription": "Заповніть форму онлайн та отримайте готову просту пропозицію дизайн-проекту або просто завантажте шаблон для заповнення в бажаному форматі: DOCXF, OFORM або PDF. Запропонуйте проект або серію проектів команді фріланс-дизайнерів. Опишіть структуру проекту та завдань, платежі та умови.",
|
||||
"OpenSharingSettings": "Відкрити параметри спільного доступу",
|
||||
"SystemProperties": "Властивості системи",
|
||||
"Versions": "Версії",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "Các mục đã chọn",
|
||||
"LastModifiedBy": "Sửa lần cuối bởi",
|
||||
"Members": "thành viên",
|
||||
"OFORMsDescription": "Điền vào biểu mẫu trực tuyến và có Đề xuất Dự án Thiết kế đơn giản, hoặc chỉ cần tải xuống mẫu có thể điền ở định dạng mong muốn: DOCXF, OFORM, hay PDF. Đề xuất một dự án hoặc một loạt các dự án cho một nhóm thiết kế tự do. Phác thảo dự án và cấu trúc nhiệm vụ, thanh toán và điều khoản.",
|
||||
"OpenSharingSettings": "Mở cài đặt chia sẻ",
|
||||
"SystemProperties": "Thuộc tính hệ thống",
|
||||
"Versions": "Phiên Bản",
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
"ItemsSelected": "选定的项目",
|
||||
"LastModifiedBy": "上次修改时间",
|
||||
"Members": "成员",
|
||||
"OFORMsDescription": "在线填写表单并准备简单的设计项目提案表，或者直接下载可填写模板，格式为DOCXF, OFORM, 或PDF。 这样，您可以向设计师团队提出一个项目或一系列项目的提案。概述项目和任务结构、付款和条款。",
|
||||
"OpenSharingSettings": "打开共享设置",
|
||||
"SystemProperties": "系统属性",
|
||||
"Versions": "版本",
|
||||
|
||||
@ -71,22 +71,6 @@ const SingleItem = (props) => {
|
||||
{selectedItem.attributes.file_pages}
|
||||
</Text>
|
||||
</div>
|
||||
<Text
|
||||
as="div"
|
||||
fontSize="12px"
|
||||
fontWeight={400}
|
||||
className="oforms-description"
|
||||
>
|
||||
<Trans t={t} i18nKey="OFORMsDescription" ns="InfoPanel">
|
||||
Fill out the form online and get a simple Design Project Proposal
|
||||
ready, or just download the fillable template in the desirable
|
||||
format: DOCXF, OFORM, or PDF.
|
||||
<p className="oforms-description-text">
|
||||
Propose a project or a series of projects to an freelance designer
|
||||
team. Outline project and task structure, payments, and terms.
|
||||
</p>
|
||||
</Trans>
|
||||
</Text>
|
||||
</StyledProperties>
|
||||
</>
|
||||
);
|
||||
|
||||
@ -126,14 +126,6 @@ const StyledProperties = styled.div`
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.oforms-description {
|
||||
margin-top: 36px;
|
||||
|
||||
.oforms-description-text {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledAccess = styled.div`
|
||||
|
||||
3
public/images/check.white.svg
Normal file
3
public/images/check.white.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.20718 11.2072L15.7072 1.70718L14.293 0.292969L5.50007 9.08586L1.70718 5.29297L0.292969 6.70718L4.79296 11.2072C5.18349 11.5977 5.81665 11.5977 6.20718 11.2072Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 331 B |
@ -1,8 +1,8 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import React, { useState, useEffect, useCallback, useMemo } from "react";
|
||||
import { withTranslation } from "react-i18next";
|
||||
|
||||
import { inject, observer } from "mobx-react";
|
||||
|
||||
import Button from "@appserver/components/button";
|
||||
import withLoading from "../../../../../HOCs/withLoading";
|
||||
import globalColors from "@appserver/components/utils/globalColors";
|
||||
import styled from "styled-components";
|
||||
@ -18,58 +18,98 @@ const StyledComponent = styled.div`
|
||||
height: 46px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
.first-color-scheme {
|
||||
background: ${globalColors.firstDefaultСolorScheme};
|
||||
#color-scheme_1 {
|
||||
background: ${globalColors.colorSchemeDefault_1};
|
||||
}
|
||||
.second-color-scheme {
|
||||
background: ${globalColors.secondDefaultСolorScheme};
|
||||
#color-scheme_2 {
|
||||
background: ${globalColors.colorSchemeDefault_2};
|
||||
}
|
||||
.third-color-scheme {
|
||||
background: ${globalColors.thirdDefaultСolorScheme};
|
||||
#color-scheme_3 {
|
||||
background: ${globalColors.colorSchemeDefault_3};
|
||||
}
|
||||
.fourth-color-scheme {
|
||||
background: ${globalColors.fourthDefaultСolorScheme};
|
||||
#color-scheme_4 {
|
||||
background: ${globalColors.colorSchemeDefault_4};
|
||||
}
|
||||
.fifth-color-scheme {
|
||||
background: ${globalColors.fifthDefaultСolorScheme};
|
||||
#color-scheme_5 {
|
||||
background: ${globalColors.colorSchemeDefault_5};
|
||||
}
|
||||
.sixth-color-scheme {
|
||||
background: ${globalColors.sixthDefaultСolorScheme};
|
||||
#color-scheme_6 {
|
||||
background: ${globalColors.colorSchemeDefault_6};
|
||||
}
|
||||
.sevent-color-scheme {
|
||||
background: ${globalColors.seventhDefaultСolorScheme};
|
||||
#color-scheme_7 {
|
||||
background: ${globalColors.colorSchemeDefault_7};
|
||||
}
|
||||
`;
|
||||
|
||||
const Appearance = (props) => {
|
||||
const array_items = [
|
||||
{
|
||||
key: "0",
|
||||
title: "Light theme",
|
||||
content: <Preview />,
|
||||
},
|
||||
{
|
||||
key: "1",
|
||||
title: "Dark theme",
|
||||
content: <div>Tab 2 content</div>,
|
||||
},
|
||||
];
|
||||
const [selectedColor, setSelectedColor] = useState(1);
|
||||
|
||||
const checkImg = <img src="/static/images/check.white.svg" />;
|
||||
|
||||
const array_items = useMemo(
|
||||
() => [
|
||||
{
|
||||
key: "0",
|
||||
title: "Light theme",
|
||||
content: <Preview selectedColor={selectedColor} />,
|
||||
},
|
||||
{
|
||||
key: "1",
|
||||
title: "Dark theme",
|
||||
content: <Preview selectedColor={selectedColor} />,
|
||||
},
|
||||
],
|
||||
[selectedColor]
|
||||
);
|
||||
|
||||
useEffect(() => {}, [selectedColor]);
|
||||
|
||||
const onColorSelection = (e) => {
|
||||
if (!e.target.id) return;
|
||||
|
||||
const colorNumber = e.target.id[e.target.id.length - 1];
|
||||
setSelectedColor(+colorNumber);
|
||||
};
|
||||
|
||||
const onShowCheck = (colorNumber) => {
|
||||
return selectedColor && selectedColor === colorNumber && checkImg;
|
||||
};
|
||||
|
||||
return (
|
||||
<StyledComponent>
|
||||
<div>Color</div>
|
||||
<div>Header color is displayed only when light theme is applied</div>
|
||||
<div className="container">
|
||||
<div className="box first-color-scheme"></div>
|
||||
<div className="box second-color-scheme"></div>
|
||||
<div className="box third-color-scheme"></div>
|
||||
<div className="box fourth-color-scheme"></div>
|
||||
<div className="box fifth-color-scheme"></div>
|
||||
<div className="box sixth-color-scheme"></div>
|
||||
<div className="box sevent-color-scheme"></div>
|
||||
<div id="color-scheme_1" className="box" onClick={onColorSelection}>
|
||||
{onShowCheck(1)}
|
||||
</div>
|
||||
<div id="color-scheme_2" className="box" onClick={onColorSelection}>
|
||||
{onShowCheck(2)}
|
||||
</div>
|
||||
<div id="color-scheme_3" className="box" onClick={onColorSelection}>
|
||||
{onShowCheck(3)}
|
||||
</div>
|
||||
<div id="color-scheme_4" className="box" onClick={onColorSelection}>
|
||||
{onShowCheck(4)}
|
||||
</div>
|
||||
<div id="color-scheme_5" className="box" onClick={onColorSelection}>
|
||||
{onShowCheck(5)}
|
||||
</div>
|
||||
<div id="color-scheme_6" className="box" onClick={onColorSelection}>
|
||||
{onShowCheck(6)}
|
||||
</div>
|
||||
<div id="color-scheme_7" className="box" onClick={onColorSelection}>
|
||||
{onShowCheck(7)}
|
||||
</div>
|
||||
</div>
|
||||
<div>Preview</div>
|
||||
<TabContainer elements={array_items} />
|
||||
<Button
|
||||
label="Save"
|
||||
onClick={function noRefCheck() {}}
|
||||
primary
|
||||
size="small"
|
||||
/>
|
||||
</StyledComponent>
|
||||
);
|
||||
};
|
||||
|
||||
@ -8,6 +8,7 @@ import { inject, observer } from "mobx-react";
|
||||
import Loaders from "@appserver/common/components/Loaders";
|
||||
import MainButton from "@appserver/components/main-button";
|
||||
import ContextMenuButton from "@appserver/components/context-menu-button";
|
||||
import globalColors from "@appserver/components/utils/globalColors";
|
||||
|
||||
const StyledComponent = styled.div`
|
||||
display: flex;
|
||||
@ -155,12 +156,30 @@ const StyledComponent = styled.div`
|
||||
`;
|
||||
|
||||
const Preview = (props) => {
|
||||
const { selectedColor } = props;
|
||||
|
||||
const [color, setColor] = useState();
|
||||
const globalColors = "globalColors.colorSchemeDefault_";
|
||||
|
||||
useEffect(() => {
|
||||
setColor(globalColors + `${selectedColor}`);
|
||||
}, [selectedColor]);
|
||||
|
||||
return (
|
||||
<StyledComponent>
|
||||
<div className="menu">
|
||||
<Loaders.Rectangle width="211" height="24" className="header" />
|
||||
<Loaders.Rectangle
|
||||
width="211"
|
||||
height="24"
|
||||
className="header"
|
||||
style={{ background: `${color}` }}
|
||||
/>
|
||||
|
||||
<MainButton text="Actions" className="main-button-preview" />
|
||||
<MainButton
|
||||
text="Actions"
|
||||
className="main-button-preview"
|
||||
style={{ background: `${color}` }}
|
||||
/>
|
||||
|
||||
<div className="menu-section">
|
||||
<Loaders.Rectangle width="37" height="12" className="title-section" />
|
||||
|
||||
Loading…
Reference in New Issue
Block a user