mirror of
https://github.com/usebruno/bruno.git
synced 2024-11-21 23:43:15 +01:00
feat: added support links
This commit is contained in:
parent
6380797f92
commit
890c79b013
@ -0,0 +1,20 @@
|
||||
import styled from 'styled-components';
|
||||
|
||||
const StyledWrapper = styled.div`
|
||||
color: var(--color-text);
|
||||
.collection-options {
|
||||
svg {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
.label {
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export default StyledWrapper;
|
39
packages/bruno-app/src/components/BrunoSupport/index.js
Normal file
39
packages/bruno-app/src/components/BrunoSupport/index.js
Normal file
@ -0,0 +1,39 @@
|
||||
import React from "react";
|
||||
import Modal from "components/Modal/index";
|
||||
import {IconSpeakerphone, IconBrandTwitter} from "@tabler/icons";
|
||||
import StyledWrapper from "./StyledWrapper";
|
||||
|
||||
const BrunoSupport = ({onClose}) => {
|
||||
return (
|
||||
<StyledWrapper>
|
||||
<Modal
|
||||
size="sm"
|
||||
title={"Support"}
|
||||
handleCancel={onClose}
|
||||
hideFooter={true}
|
||||
>
|
||||
<div className="collection-options">
|
||||
<div className="mt-2">
|
||||
<a href="https://github.com/usebruno/bruno/issues" target="_blank" className="flex items-center">
|
||||
<IconSpeakerphone size={18} strokeWidth={2}/><span className="label ml-2">Report Issues</span>
|
||||
</a>
|
||||
</div>
|
||||
<div className="mt-2">
|
||||
<a href="https://github.com/usebruno/bruno" target="_blank" className="flex items-center">
|
||||
<img src="/github.svg" style={{width: "18px"}}/>
|
||||
<span className="label ml-2">Github</span>
|
||||
</a>
|
||||
</div>
|
||||
<div className="mt-2">
|
||||
<a href="https://twitter.com/use_bruno" target="_blank" className="flex items-center">
|
||||
<IconBrandTwitter size={18} strokeWidth={2}/><span className="label ml-2">Twitter</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
</StyledWrapper>
|
||||
);
|
||||
}
|
||||
|
||||
export default BrunoSupport;
|
||||
|
@ -1,14 +1,16 @@
|
||||
import React from 'react';
|
||||
import React, { useState } from 'react';
|
||||
import Link from 'next/link';
|
||||
import { useRouter } from 'next/router';
|
||||
import { IconCode, IconFiles, IconUser, IconUsers, IconSettings, IconChevronsLeft, IconLifebuoy} from '@tabler/icons';
|
||||
import { useDispatch } from 'react-redux';
|
||||
import { toggleLeftMenuBar } from 'providers/ReduxStore/slices/app'
|
||||
import { toggleLeftMenuBar } from 'providers/ReduxStore/slices/app';
|
||||
import BrunoSupport from 'components/BrunoSupport';
|
||||
import StyledWrapper from './StyledWrapper';
|
||||
|
||||
const MenuBar = () => {
|
||||
const router = useRouter();
|
||||
const dispatch = useDispatch();
|
||||
const [openBrunoSupport, setOpenBrunoSupport] = useState(false);
|
||||
|
||||
const getClassName = (menu) => {
|
||||
return router.pathname === menu ? "active menu-item": "menu-item";
|
||||
@ -38,12 +40,13 @@ const MenuBar = () => {
|
||||
</div>
|
||||
</Link> */}
|
||||
<div className="menu-item">
|
||||
<IconLifebuoy size={28} strokeWidth={1.5}/>
|
||||
<IconLifebuoy size={28} strokeWidth={1.5} onClick={() => setOpenBrunoSupport(true)}/>
|
||||
</div>
|
||||
<div className="menu-item" onClick={() => dispatch(toggleLeftMenuBar())}>
|
||||
<IconChevronsLeft size={28} strokeWidth={1.5}/>
|
||||
</div>
|
||||
</div>
|
||||
{openBrunoSupport && <BrunoSupport onClose={() => setOpenBrunoSupport(false)}/>}
|
||||
</StyledWrapper>
|
||||
);
|
||||
};
|
||||
|
@ -103,6 +103,9 @@ const Sidebar = () => {
|
||||
{/* <IconLayoutGrid size={20} strokeWidth={1.5} className="mr-2"/> */}
|
||||
{/* Need to ut github stars link here */}
|
||||
</div>
|
||||
<div className='pl-1'>
|
||||
<iframe src="https://ghbtns.com/github-btn.html?user=usebruno&repo=bruno&type=star&count=true" frameborder="0" scrolling="0" width="100" height="20" title="GitHub"></iframe>
|
||||
</div>
|
||||
<div className="flex flex-grow items-center justify-end text-xs mr-2">
|
||||
v1.25.2
|
||||
</div>
|
||||
|
@ -112,21 +112,29 @@ const Welcome = () => {
|
||||
|
||||
<div className="uppercase font-semibold create-request mt-10 pt-6">Links</div>
|
||||
<div className="mt-4 flex flex-col collection-options select-none">
|
||||
<div className="flex items-center">
|
||||
<IconBrandChrome size={18} strokeWidth={2}/><span className="label ml-2">Chrome Extension</span>
|
||||
<div>
|
||||
<a href="https://www.usebruno.com/downloads" target="_blank" className="flex items-center">
|
||||
<IconBrandChrome size={18} strokeWidth={2}/><span className="label ml-2">Chrome Extension</span>
|
||||
</a>
|
||||
</div>
|
||||
<div className="flex items-center mt-2">
|
||||
<IconDeviceDesktop size={18} strokeWidth={2}/><span className="label ml-2">Desktop App</span>
|
||||
<div className="mt-2">
|
||||
<a href="https://www.usebruno.com/downloads" target="_blank" className="flex items-center">
|
||||
<IconDeviceDesktop size={18} strokeWidth={2}/><span className="label ml-2">Desktop App</span>
|
||||
</a>
|
||||
</div>
|
||||
<div className="flex items-center mt-2">
|
||||
<IconSpeakerphone size={18} strokeWidth={2}/><span className="label ml-2">Report Issues</span>
|
||||
<div className="mt-2">
|
||||
<a href="https://github.com/usebruno/bruno/issues" target="_blank" className="flex items-center">
|
||||
<IconSpeakerphone size={18} strokeWidth={2}/><span className="label ml-2">Report Issues</span>
|
||||
</a>
|
||||
</div>
|
||||
{/* <div className="flex items-center mt-2">
|
||||
<IconBook size={18} strokeWidth={2}/><span className="label ml-2">Docs</span>
|
||||
</div> */}
|
||||
<div className="flex items-center mt-2">
|
||||
<img src='/github.svg' style={{width: '18px'}}/>
|
||||
<span className="label ml-2">Github</span>
|
||||
<div className="mt-2">
|
||||
<a href="https://github.com/usebruno/bruno" target="_blank" className="flex items-center">
|
||||
<img src='/github.svg' style={{width: '18px'}}/>
|
||||
<span className="label ml-2">Github</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -1,6 +1,7 @@
|
||||
|
||||
:root {
|
||||
--color-brand: #546de5;
|
||||
--color-text: rgb(52 52 52);
|
||||
--color-sidebar-collection-item-active-indent-border: #d0d0d0;
|
||||
--color-sidebar-collection-item-active-background: #e1e1e1;
|
||||
--color-sidebar-background: #f3f3f3;
|
||||
|
Loading…
Reference in New Issue
Block a user