/* override common styles */ :root body { margin: 0; background: #e8e8e9; } :global(.page-content) { background: #FFF; padding: 32px; height: 370px; } import {render} from 'react-dom'; import React from 'react'; import hubLogo from '@jetbrains/logos/hub/hub.svg'; import {DragIcon, ExpandIcon} from '@jetbrains/ring-ui/components/icon'; import Auth from '@jetbrains/ring-ui/components/auth/auth'; import showAuthDialog from '@jetbrains/ring-ui/components/auth-dialog-service/auth-dialog-service'; import Header, {Logo, Tray, TrayIcon, SmartProfile, SmartServices} from '@jetbrains/ring-ui/components/header/header'; import Link from '@jetbrains/ring-ui/components/link/link'; import Input from '@jetbrains/ring-ui/components/input/input'; import Button from '@jetbrains/ring-ui/components/button/button'; import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown'; import PopupMenu from '@jetbrains/ring-ui/components/popup-menu/popup-menu'; import hubConfig from '@ring-ui/docs/components/hub-config'; const container = document.getElementById('header'); const auth = new Auth(hubConfig); auth.setAuthDialogService(showAuthDialog); auth.init(); const Comp = props => This is component; const renderHeaderDemo = () => (
Users Groups Spaces Services ( )} >
); render(renderHeaderDemo(), container);
/* override common styles */ :root body { margin: 0; background: #f7f9fa; } import {render} from 'react-dom'; import React from 'react'; import hubLogo from '@jetbrains/logos/hub/hub.svg'; import {DragIcon, ExpandIcon} from '@jetbrains/ring-ui/components/icon'; import Auth from '@jetbrains/ring-ui/components/auth/auth'; import Theme from '@jetbrains/ring-ui/components/global/theme'; import Header, {Logo, Tray, TrayIcon, SmartProfile, SmartServices} from '@jetbrains/ring-ui/components/header/header'; import Link from '@jetbrains/ring-ui/components/link/link'; import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown'; import PopupMenu from '@jetbrains/ring-ui/components/popup-menu/popup-menu'; import hubConfig from '@ring-ui/docs/components/hub-config'; const container = document.getElementById('header'); const auth = new Auth(hubConfig); auth.init(); const Comp = props => This is component; const renderHeaderDemo = () => (
Users Groups ( )} >
); render(renderHeaderDemo(), container);
body { margin: 0 !important; background: #e8e8e9; } :global(.page-content) { background: #FFF; padding: 32px; height: 394px; } /* override Header */ :global(.header.header) { height: 40px; } :global(.logo.logo) { color: #fff; position: relative; top: -2px; } import {render} from 'react-dom'; import React from 'react'; import hubLogo from '@jetbrains/logos/hub/hub-text.svg'; import {DragIcon, ExpandIcon} from '@jetbrains/ring-ui/components/icon'; import Auth from '@jetbrains/ring-ui/components/auth/auth'; import Header, {Logo, Tray, TrayIcon, SmartProfile, SmartServices} from '@jetbrains/ring-ui/components/header/header'; import Link from '@jetbrains/ring-ui/components/link/link'; import Button from '@jetbrains/ring-ui/components/button/button'; import Dropdown from '@jetbrains/ring-ui/components/dropdown/dropdown'; import PopupMenu from '@jetbrains/ring-ui/components/popup-menu/popup-menu'; import hubConfig from '@ring-ui/docs/components/hub-config'; const container = document.getElementById('header'); const auth = new Auth(hubConfig); auth.init(); const renderHeaderDemo = () => (
Users Groups Spaces Services ( )} >
); render(renderHeaderDemo(), container);