update Modal
This commit is contained in:
Alex Santos
parent
a3027ebb7f
commit
41c4a07a6d
14
src/components/buttons/faqButton/FaqButton1.tsx
Normal file
14
src/components/buttons/faqButton/FaqButton1.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import React from 'react'
|
||||
|
||||
import { FaqButtonView1 } from './FaqButtonView1'
|
||||
|
||||
interface FaqButtonInterface {
|
||||
title: string
|
||||
onClick: () => void
|
||||
}
|
||||
|
||||
export default function FaqButton1({title, onClick}: FaqButtonInterface) {
|
||||
return (
|
||||
<FaqButtonView1 onClick={() => onClick()}>{title}</FaqButtonView1>
|
||||
)
|
||||
}
|
||||
14
src/components/buttons/faqButton/FaqButton2.tsx
Normal file
14
src/components/buttons/faqButton/FaqButton2.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import React from 'react'
|
||||
|
||||
import { FaqButtonView2 } from './FaqButtonView2'
|
||||
|
||||
interface FaqButtonInterface {
|
||||
title: string
|
||||
onClick: () => void
|
||||
}
|
||||
|
||||
export default function FaqButton2({title, onClick}: FaqButtonInterface) {
|
||||
return (
|
||||
<FaqButtonView2 onClick={() => onClick()}>{title}</FaqButtonView2>
|
||||
)
|
||||
}
|
||||
21
src/components/buttons/faqButton/FaqButtonView1.ts
Normal file
21
src/components/buttons/faqButton/FaqButtonView1.ts
Normal file
@ -0,0 +1,21 @@
|
||||
import styled from 'styled-components'
|
||||
|
||||
export const FaqButtonView1 = styled.button`
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
margin-left: 65px;
|
||||
width: 350px;
|
||||
height: 45px;
|
||||
cursor: pointer;
|
||||
background: #DDDDDD;
|
||||
border-radius: 8px;
|
||||
border-style: none;
|
||||
|
||||
font-family: 'Poppins';
|
||||
font-size: 90%;
|
||||
|
||||
|
||||
color: #6A707E;
|
||||
`
|
||||
22
src/components/buttons/faqButton/FaqButtonView2.ts
Normal file
22
src/components/buttons/faqButton/FaqButtonView2.ts
Normal file
@ -0,0 +1,22 @@
|
||||
import styled from 'styled-components'
|
||||
|
||||
export const FaqButtonView2 = styled.button`
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: -46px;
|
||||
margin-left: 430px;
|
||||
width: 350px;
|
||||
height: 45px;
|
||||
cursor: pointer;
|
||||
background: #254F7F;
|
||||
border-radius: 8px;
|
||||
border-style: none;
|
||||
|
||||
font-family: 'Poppins';
|
||||
font-size: 90%;
|
||||
|
||||
|
||||
|
||||
color: #FFFFFF;
|
||||
`
|
||||
@ -2,47 +2,39 @@ import Button from '@mui/material/Button';
|
||||
import TextField from '@mui/material/TextField';
|
||||
import { DataGrid, GridColDef, GridValueGetterParams } from '@mui/x-data-grid';
|
||||
import React, { useState } from 'react'
|
||||
|
||||
import Typography from '@mui/material/Typography';
|
||||
import BasicButton from '../../components/buttons/basicButton/BasicButton'
|
||||
import Modal from '../../components/modal/Modal';
|
||||
import Modal from '@mui/material/Modal';
|
||||
import PageTitle from '../../components/pageTitle/PageTitle'
|
||||
import { ClientsModalView, ClientsView } from '../../styles/layouts/clients/ClientsView'
|
||||
import Box from '@mui/material/Box';
|
||||
import FaqButton1 from '../../components/buttons/faqButton/FaqButton1';
|
||||
import FaqButton2 from '../../components/buttons/faqButton/FaqButton2';
|
||||
|
||||
const style = {
|
||||
position: 'absolute' as const,
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)',
|
||||
width: 900,
|
||||
height: 500,
|
||||
bgcolor: 'background.paper',
|
||||
border: '2px solid #000',
|
||||
boxShadow: 24,
|
||||
p: 4,
|
||||
overflowY: 'scroll'
|
||||
};
|
||||
|
||||
|
||||
|
||||
export default function clients() {
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const handleOpen = () => setOpen(true);
|
||||
const handleClose = () => setOpen(false);
|
||||
|
||||
const [openModal, setOpenModal] = useState(false)
|
||||
|
||||
const rows = [
|
||||
{ id: 1, lastName: 'Snow', firstName: 'Jon', age: 35 },
|
||||
{ id: 2, lastName: 'Lannister', firstName: 'Cersei', age: 42 },
|
||||
{ id: 3, lastName: 'Lannister', firstName: 'Jaime', age: 45 },
|
||||
{ id: 4, lastName: 'Stark', firstName: 'Arya', age: 16 },
|
||||
{ id: 5, lastName: 'Targaryen', firstName: 'Daenerys', age: null },
|
||||
{ id: 6, lastName: 'Melisandre', firstName: null, age: 150 },
|
||||
{ id: 7, lastName: 'Clifford', firstName: 'Ferrara', age: 44 },
|
||||
{ id: 8, lastName: 'Frances', firstName: 'Rossini', age: 36 },
|
||||
{ id: 9, lastName: 'Roxie', firstName: 'Harvey', age: 65 },
|
||||
];
|
||||
|
||||
const columns: GridColDef[] = [
|
||||
{ field: 'id', headerName: 'ID', width: 70 },
|
||||
{ field: 'firstName', headerName: 'First name', width: 130 },
|
||||
{ field: 'lastName', headerName: 'Last name', width: 130 },
|
||||
{
|
||||
field: 'age',
|
||||
headerName: 'Age',
|
||||
type: 'number',
|
||||
width: 90,
|
||||
},
|
||||
{
|
||||
field: 'fullName',
|
||||
headerName: 'Full name',
|
||||
description: 'This column has a value getter and is not sortable.',
|
||||
sortable: false,
|
||||
width: 160,
|
||||
valueGetter: (params: GridValueGetterParams) =>
|
||||
`${params.row.firstName || ''} ${params.row.lastName || ''}`,
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -50,40 +42,40 @@ export default function clients() {
|
||||
<PageTitle title='Clientes' subtitle='Clientes Smart Energia'/>
|
||||
|
||||
<section>
|
||||
<BasicButton title='Adicionar' onClick={() => setOpenModal(true)}/>
|
||||
<BasicButton title='Inativar' onClick={() => {throw new Error('fixing...')}}/>
|
||||
<BasicButton title='Adicionar' onClick={handleOpen}/>
|
||||
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<DataGrid
|
||||
rows={rows}
|
||||
columns={columns}
|
||||
pageSize={6}
|
||||
rowsPerPageOptions={[6]}
|
||||
checkboxSelection
|
||||
/>
|
||||
</section>
|
||||
{/* <button className='btn2' onClick={handleOpen}>Open modal</button> */}
|
||||
<Modal
|
||||
open={open}
|
||||
onClose={handleClose}
|
||||
aria-labelledby="modal-modal-title"
|
||||
aria-describedby="modal-modal-description"
|
||||
>
|
||||
<Box sx={style}>
|
||||
<h1>Adicionar Cliente</h1>
|
||||
<Typography sx={{color:'gray', fontSize:12}}variant="h5" gutterBottom component="div">
|
||||
Adicionar Cliente Smart Energia</Typography>
|
||||
<br />
|
||||
<TextField id="outlined-basic" label="Nome" sx={{width:350, ml:5}} variant="outlined" />
|
||||
<TextField id="outlined-basic" label="E-mail/Usuário" sx={{width:350, ml:8}} variant="outlined" />
|
||||
<TextField id="outlined-basic" label="Senha" sx={{width:350, ml:5, mt:2}} variant="outlined" />
|
||||
<TextField id="outlined-basic" label="Confirma Senha" sx={{width:350, ml:8, mt:2}} variant="outlined" />
|
||||
<TextField id="outlined-basic" label="Codigo do Cliente Smart Energia" sx={{width:350, ml:5, mt:2}} variant="outlined" />
|
||||
<TextField id="outlined-basic" label="Imagem/Logotipo" sx={{width:350, ml:8, mt:2}} variant="outlined" />
|
||||
<br /><br />
|
||||
<FaqButton1 title='Cancelar' />
|
||||
<FaqButton2 title='Salvar' />
|
||||
|
||||
|
||||
|
||||
</Box>
|
||||
|
||||
</Modal>
|
||||
|
||||
</ClientsView>
|
||||
|
||||
<Modal open={openModal} handleIsClose={(value) => {setOpenModal(value)}}>
|
||||
<ClientsModalView>
|
||||
<TextField id="outlined-basic" label="Outlined" variant="outlined" style={{width: '300px'}}/>
|
||||
<TextField id="outlined-basic" label="Outlined" variant="outlined" style={{width: '300px'}}/>
|
||||
<TextField id="outlined-basic" label="Outlined" variant="outlined" style={{width: '300px'}}/>
|
||||
<TextField id="outlined-basic" label="Outlined" variant="outlined" style={{width: '300px'}}/>
|
||||
<TextField id="outlined-basic" label="Outlined" variant="outlined" style={{width: '300px'}}/>
|
||||
<Button
|
||||
variant="contained"
|
||||
component="label"
|
||||
>
|
||||
Upload File
|
||||
<input
|
||||
type="file"
|
||||
hidden
|
||||
/>
|
||||
</Button>
|
||||
</ClientsModalView>
|
||||
</Modal>
|
||||
</>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
54
src/pages/administrative/faq/faqView.ts
Normal file
54
src/pages/administrative/faq/faqView.ts
Normal file
@ -0,0 +1,54 @@
|
||||
import styled from 'styled-components'
|
||||
|
||||
|
||||
|
||||
export const FaqView = styled.nav`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
|
||||
.btn{
|
||||
background: #254F7F;
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
width: 164px;
|
||||
height: 40px;
|
||||
border: none;
|
||||
|
||||
}
|
||||
.btn2{
|
||||
background: #FFBC10;
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
width: 164px;
|
||||
height: 40px;
|
||||
border: none;
|
||||
margin-left: 3px;
|
||||
}
|
||||
.buttons{
|
||||
display: flex;
|
||||
margin-top:50px ;
|
||||
justify-content: space-between;
|
||||
align-self:flex-start ;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.title{
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-self:flex-start ;
|
||||
flex-direction: column;
|
||||
margin-left: 19px;
|
||||
}
|
||||
|
||||
/*
|
||||
.teste{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-left: 100px;
|
||||
} */
|
||||
|
||||
|
||||
`
|
||||
@ -1,39 +1,78 @@
|
||||
import Head from 'next/head'
|
||||
import React from 'react'
|
||||
import CommonQuestionsCard from '../../../components/faqQuestionsCard/FaqQuestionsCard'
|
||||
import Header from '../../../components/header/Header'
|
||||
import { FaqView } from '../../../styles/layouts/commonQuestions/FaqView'
|
||||
import BasicButton from '../../../components/buttons/basicButton/BasicButton';
|
||||
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import { useRouter } from 'next/router'
|
||||
import Image from 'next/image'
|
||||
import Link from 'next/link'
|
||||
import Box from '@mui/material/Box';
|
||||
import Button from '@mui/material/Button';
|
||||
import Typography from '@mui/material/Typography';
|
||||
import Modal from '@mui/material/Modal';
|
||||
import Stack from '@mui/material/Stack';
|
||||
import TextField from '@mui/material/TextField';
|
||||
import FaqButton1 from '../../../components/buttons/faqButton/FaqButton1';
|
||||
import FaqButton2 from '../../../components/buttons/faqButton/FaqButton2';
|
||||
import CommonQuestionsCard from '../../../components/faqQuestionsCard/FaqQuestionsCard'
|
||||
|
||||
|
||||
|
||||
import { FaqView } from './faqView'
|
||||
|
||||
const style = {
|
||||
position: 'absolute' as const,
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)',
|
||||
width: 900,
|
||||
height: 500,
|
||||
bgcolor: 'background.paper',
|
||||
border: '2px solid #000',
|
||||
boxShadow: 24,
|
||||
p: 4,
|
||||
};
|
||||
|
||||
|
||||
|
||||
export default function Sidebar() {
|
||||
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const handleOpen = () => setOpen(true);
|
||||
const handleClose = () => setOpen(false);
|
||||
|
||||
|
||||
export default function commonQuestions() {
|
||||
return (
|
||||
<FaqView>
|
||||
<Head>
|
||||
<title>Smart Energia - FAQ</title>
|
||||
</Head>
|
||||
<Header name='' />
|
||||
<h1>Perguntas Frequentes</h1>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
||||
<div className='title'>
|
||||
<h1>Adicionar/Editar Pergunta</h1>
|
||||
<Typography sx={{color:'gray', fontSize:12}}variant="h5" gutterBottom component="div">
|
||||
Adicionar/Editar Pergunta
|
||||
</Typography>
|
||||
</div>
|
||||
<div className='buttons'>
|
||||
|
||||
<button className='btn' onClick={handleOpen}>Open modal</button>
|
||||
<button className='btn2' onClick={handleOpen}>Open modal</button>
|
||||
</div>
|
||||
<Modal
|
||||
open={open}
|
||||
onClose={handleClose}
|
||||
aria-labelledby="modal-modal-title"
|
||||
aria-describedby="modal-modal-description"
|
||||
>
|
||||
<Box sx={style}>
|
||||
<h1>Adicionar/Editar Pergunta</h1>
|
||||
<Typography sx={{color:'gray', fontSize:12}}variant="h5" gutterBottom component="div">
|
||||
Adicionar/Editar Pergunta
|
||||
</Typography>
|
||||
<br />
|
||||
<TextField id="outlined-basic" label="Pergunta" sx={{width:710, ml:8}} variant="outlined" /> <br /><br />
|
||||
<TextField id="outlined-basic" label="Resposta" sx={{width:710, ml:8}} variant="outlined" />
|
||||
<br /><br />
|
||||
<FaqButton1 title='Cancelar' />
|
||||
<FaqButton2 title='Salvar' />
|
||||
</Box>
|
||||
|
||||
</Modal>
|
||||
|
||||
<TextField id="standard-basic" label="Pergunta" sx={{width:740}} variant="standard" />
|
||||
<TextField id="standard-basic" label="Resposta" sx={{width:740}} variant="standard" />
|
||||
<br />
|
||||
<BasicButton title='Enviar' />
|
||||
|
||||
<section className='CommonQuestionsSection' >
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
</section>
|
||||
</FaqView>
|
||||
)
|
||||
}
|
||||
|
||||
@ -2,81 +2,146 @@ import Head from 'next/head'
|
||||
import React from 'react'
|
||||
import CommonQuestionsCard from '../../../components/faqQuestionsCard/FaqQuestionsCard'
|
||||
import Header from '../../../components/header/Header'
|
||||
import { FaqView } from '../../../styles/layouts/commonQuestions/FaqView'
|
||||
import { NotificationView } from './notificationView'
|
||||
import BasicButton from '../../../components/buttons/basicButton/BasicButton';
|
||||
import InputLabel from '@mui/material/InputLabel';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
import FormControl from '@mui/material/FormControl';
|
||||
import Select, { SelectChangeEvent } from '@mui/material/Select';
|
||||
import Checkbox from '@mui/material/Checkbox';
|
||||
import RadioButtonUncheckedIcon from '@mui/icons-material/RadioButtonUnchecked';
|
||||
import RadioButtonCheckedIcon from '@mui/icons-material/RadioButtonChecked';
|
||||
|
||||
import Typography from '@mui/material/Typography';
|
||||
import Modal from '@mui/material/Modal';
|
||||
import Box from '@mui/material/Box';
|
||||
import TextField from '@mui/material/TextField';
|
||||
import FaqButton1 from '../../../components/buttons/faqButton/FaqButton1';
|
||||
import FaqButton2 from '../../../components/buttons/faqButton/FaqButton2';
|
||||
|
||||
|
||||
import Autocomplete from '@mui/material/Autocomplete';
|
||||
import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank';
|
||||
import CheckBoxIcon from '@mui/icons-material/CheckBox';
|
||||
|
||||
|
||||
const style = {
|
||||
position: 'absolute' as const,
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)',
|
||||
width: 900,
|
||||
height: 500,
|
||||
bgcolor: 'background.paper',
|
||||
border: '2px solid #000',
|
||||
boxShadow: 24,
|
||||
p: 4,
|
||||
overflowY: 'scroll'
|
||||
};
|
||||
|
||||
const icon = <CheckBoxOutlineBlankIcon fontSize="small" />;
|
||||
const checkedIcon = <CheckBoxIcon fontSize="small" />;
|
||||
|
||||
export default function commonQuestions() {
|
||||
|
||||
const [month, setMonth] = React.useState('');
|
||||
const [unidade, setUnidade] = React.useState('');
|
||||
|
||||
const handleChangeMonth = (event: SelectChangeEvent) => {
|
||||
setMonth(event.target.value);
|
||||
};
|
||||
const handleChangeUnidade = (event: SelectChangeEvent) => {
|
||||
setUnidade(event.target.value);
|
||||
};
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const handleOpen = () => setOpen(true);
|
||||
const handleClose = () => setOpen(false);
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<FaqView>
|
||||
<NotificationView>
|
||||
<Head>
|
||||
<title>Smart Energia - FAQ</title>
|
||||
</Head>
|
||||
<Header name='' />
|
||||
<Header name='' />
|
||||
<h1>Perguntas Frequentes</h1>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
||||
|
||||
<TextField id="standard-basic" label="Mensagem" sx={{width:700}} variant="standard" />
|
||||
|
||||
<br />
|
||||
|
||||
<FormControl size='small' fullWidth sx={{ width: 135}} >
|
||||
|
||||
<InputLabel id="demo-simple-select-label">Clientes</InputLabel>
|
||||
<Select
|
||||
labelId="demo-simple-select-label"
|
||||
id="demo-simple-select"
|
||||
value={month}
|
||||
label="Month"
|
||||
onChange={handleChangeMonth}
|
||||
<button className='btn2' onClick={handleOpen}>Open modal</button>
|
||||
<Modal
|
||||
open={open}
|
||||
onClose={handleClose}
|
||||
aria-labelledby="modal-modal-title"
|
||||
aria-describedby="modal-modal-description"
|
||||
>
|
||||
<MenuItem value={15}>Cliente 1</MenuItem>
|
||||
<MenuItem value={20}>Cliente 2</MenuItem>
|
||||
<MenuItem value={30}>Cliente 3</MenuItem>
|
||||
<MenuItem value={30}>Cliente 4</MenuItem>
|
||||
<MenuItem value={30}>Cliente 5</MenuItem>
|
||||
<MenuItem value={30}>Cliente 6</MenuItem>
|
||||
<MenuItem value={30}>Cliente 7</MenuItem>
|
||||
<Box sx={style}>
|
||||
<h1>Disparar Notificações</h1>
|
||||
<Typography sx={{color:'gray', fontSize:12}}variant="h5" gutterBottom component="div">
|
||||
Pode ser que todas as notificaçõs demorem alguns minutos para estarem disponíveis</Typography>
|
||||
<br />
|
||||
<TextField id="outlined-basic" label="Título" sx={{width:700, ml:8}} variant="outlined" /> <br /><br />
|
||||
|
||||
<Autocomplete
|
||||
multiple
|
||||
id="checkboxes-tags-demo"
|
||||
options={top100Films}
|
||||
disableCloseOnSelect
|
||||
getOptionLabel={(option) => option.title}
|
||||
renderOption={(props, option, { selected }) => (
|
||||
<li {...props}>
|
||||
<Checkbox
|
||||
icon={icon}
|
||||
checkedIcon={checkedIcon}
|
||||
style={{ marginRight: 8 }}
|
||||
checked={selected}
|
||||
/>
|
||||
{option.title}
|
||||
</li>
|
||||
)}
|
||||
sx={{ml:8}}
|
||||
style={{ width: 700 }}
|
||||
renderInput={(params) => (
|
||||
<TextField {...params} label="Corpo/Conteúdo da notificação" placeholder="Corpo/Conteúdo da notificação" />
|
||||
)}
|
||||
/>
|
||||
<div>
|
||||
<Checkbox sx={{ml:7}}
|
||||
icon={<RadioButtonUncheckedIcon />}
|
||||
checkedIcon={<RadioButtonCheckedIcon />}
|
||||
/>
|
||||
<Typography sx={{color:'#1976D2', fontSize:12, ml:12, mt:-3.7}} >
|
||||
Disparar para todos os clientes</Typography>
|
||||
<Checkbox sx={{ml:7}}
|
||||
icon={<RadioButtonUncheckedIcon />}
|
||||
checkedIcon={<RadioButtonCheckedIcon />}
|
||||
/>
|
||||
<Typography sx={{color:'#1976D2', fontSize:12, ml:12, mt:-3.7}} >
|
||||
Disparar somente para alguns clientes</Typography>
|
||||
</div>
|
||||
|
||||
|
||||
<FaqButton1 title='Cancelar' />
|
||||
<FaqButton2 title='Salvar' />
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
|
||||
</Modal>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</NotificationView>
|
||||
|
||||
</Select>
|
||||
</FormControl>
|
||||
<br />
|
||||
<BasicButton title='Enviar' />
|
||||
|
||||
<section className='CommonQuestionsSection' >
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
<CommonQuestionsCard />
|
||||
<hr />
|
||||
</section>
|
||||
</FaqView>
|
||||
)
|
||||
}
|
||||
|
||||
const top100Films = [
|
||||
{ title: 'The Shawshank Redemption', year: 1994 },
|
||||
{ title: 'The Godfather', year: 1972 },
|
||||
{ title: 'The Godfather: Part II', year: 1974 },
|
||||
{ title: 'The Dark Knight', year: 2008 },
|
||||
{ title: '12 Angry Men', year: 1957 },
|
||||
{ title: "Schindler's List", year: 1993 },
|
||||
{ title: 'Pulp Fiction', year: 1994 },
|
||||
{
|
||||
title: 'The Lord of the Rings: The Return of the King',
|
||||
year: 2003,
|
||||
},
|
||||
];
|
||||
|
||||
60
src/pages/administrative/notification/notificationView.ts
Normal file
60
src/pages/administrative/notification/notificationView.ts
Normal file
@ -0,0 +1,60 @@
|
||||
import styled from 'styled-components'
|
||||
|
||||
|
||||
|
||||
export const NotificationView = styled.nav`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
|
||||
.btn{
|
||||
background: #254F7F;
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
width: 164px;
|
||||
height: 40px;
|
||||
border: none;
|
||||
|
||||
}
|
||||
.btn2{
|
||||
background: #FFBC10;
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
width: 164px;
|
||||
height: 40px;
|
||||
border: none;
|
||||
margin-left: 3px;
|
||||
}
|
||||
.buttons{
|
||||
display: flex;
|
||||
margin-top:50px ;
|
||||
justify-content: space-between;
|
||||
align-self:flex-start ;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.title{
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-self:flex-start ;
|
||||
flex-direction: column;
|
||||
margin-left: 19px;
|
||||
}
|
||||
|
||||
/*
|
||||
.teste{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-left: 100px;
|
||||
} */
|
||||
.text1{
|
||||
margin-left: 70px;
|
||||
}
|
||||
.header{
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
|
||||
`
|
||||
@ -33,4 +33,14 @@ export const FaqView = styled.main`
|
||||
hr {
|
||||
border: 1px solid #DDDDDD;
|
||||
}
|
||||
|
||||
/* .modal{
|
||||
display: flex;
|
||||
justify-self: flex-end;
|
||||
align-self: center;
|
||||
margin-left: 100px;
|
||||
|
||||
} */
|
||||
|
||||
|
||||
`
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user