Merge branch 'dev' into 'feature/operationSummary'
# Conflicts: # pages/resumoOperacao.tsx
96
README.md
@ -1,34 +1,92 @@
|
|||||||
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
|
# Smart Energia Web
|
||||||
|
|
||||||
## Getting Started
|
|
||||||
|
|
||||||
First, run the development server:
|
|
||||||
|
|
||||||
```bash
|
## Getting started
|
||||||
npm run dev
|
|
||||||
# or
|
To make it easy for you to get started with GitLab, here's a list of recommended next steps.
|
||||||
yarn dev
|
|
||||||
|
Already a pro? Just edit this README.md and make it your own. Want to make it easy? [Use the template at the bottom](#editing-this-readme)!
|
||||||
|
|
||||||
|
## Add your files
|
||||||
|
|
||||||
|
- [ ] [Create](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#create-a-file) or [upload](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#upload-a-file) files
|
||||||
|
- [ ] [Add files using the command line](https://docs.gitlab.com/ee/gitlab-basics/add-file.html#add-a-file-using-the-command-line) or push an existing Git repository with the following command:
|
||||||
|
|
||||||
|
```
|
||||||
|
cd existing_repo
|
||||||
|
git remote add origin https://gitlab.com/kluppsoftware/smart-energia-web.git
|
||||||
|
git branch -M main
|
||||||
|
git push -uf origin main
|
||||||
```
|
```
|
||||||
|
|
||||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
## Integrate with your tools
|
||||||
|
|
||||||
You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
|
- [ ] [Set up project integrations](https://gitlab.com/kluppsoftware/smart-energia-web/-/settings/integrations)
|
||||||
|
|
||||||
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
|
## Collaborate with your team
|
||||||
|
|
||||||
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
|
- [ ] [Invite team members and collaborators](https://docs.gitlab.com/ee/user/project/members/)
|
||||||
|
- [ ] [Create a new merge request](https://docs.gitlab.com/ee/user/project/merge_requests/creating_merge_requests.html)
|
||||||
|
- [ ] [Automatically close issues from merge requests](https://docs.gitlab.com/ee/user/project/issues/managing_issues.html#closing-issues-automatically)
|
||||||
|
- [ ] [Enable merge request approvals](https://docs.gitlab.com/ee/user/project/merge_requests/approvals/)
|
||||||
|
- [ ] [Automatically merge when pipeline succeeds](https://docs.gitlab.com/ee/user/project/merge_requests/merge_when_pipeline_succeeds.html)
|
||||||
|
|
||||||
## Learn More
|
## Test and Deploy
|
||||||
|
|
||||||
To learn more about Next.js, take a look at the following resources:
|
Use the built-in continuous integration in GitLab.
|
||||||
|
|
||||||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
- [ ] [Get started with GitLab CI/CD](https://docs.gitlab.com/ee/ci/quick_start/index.html)
|
||||||
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
- [ ] [Analyze your code for known vulnerabilities with Static Application Security Testing(SAST)](https://docs.gitlab.com/ee/user/application_security/sast/)
|
||||||
|
- [ ] [Deploy to Kubernetes, Amazon EC2, or Amazon ECS using Auto Deploy](https://docs.gitlab.com/ee/topics/autodevops/requirements.html)
|
||||||
|
- [ ] [Use pull-based deployments for improved Kubernetes management](https://docs.gitlab.com/ee/user/clusters/agent/)
|
||||||
|
- [ ] [Set up protected environments](https://docs.gitlab.com/ee/ci/environments/protected_environments.html)
|
||||||
|
|
||||||
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
|
***
|
||||||
|
|
||||||
## Deploy on Vercel
|
# Editing this README
|
||||||
|
|
||||||
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
When you're ready to make this README your own, just edit this file and use the handy template below (or feel free to structure it however you want - this is just a starting point!). Thank you to [makeareadme.com](https://www.makeareadme.com/) for this template.
|
||||||
|
|
||||||
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
|
## Suggestions for a good README
|
||||||
|
Every project is different, so consider which of these sections apply to yours. The sections used in the template are suggestions for most open source projects. Also keep in mind that while a README can be too long and detailed, too long is better than too short. If you think your README is too long, consider utilizing another form of documentation rather than cutting out information.
|
||||||
|
|
||||||
|
## Name
|
||||||
|
Choose a self-explaining name for your project.
|
||||||
|
|
||||||
|
## Description
|
||||||
|
Let people know what your project can do specifically. Provide context and add a link to any reference visitors might be unfamiliar with. A list of Features or a Background subsection can also be added here. If there are alternatives to your project, this is a good place to list differentiating factors.
|
||||||
|
|
||||||
|
## Badges
|
||||||
|
On some READMEs, you may see small images that convey metadata, such as whether or not all the tests are passing for the project. You can use Shields to add some to your README. Many services also have instructions for adding a badge.
|
||||||
|
|
||||||
|
## Visuals
|
||||||
|
Depending on what you are making, it can be a good idea to include screenshots or even a video (you'll frequently see GIFs rather than actual videos). Tools like ttygif can help, but check out Asciinema for a more sophisticated method.
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
Within a particular ecosystem, there may be a common way of installing things, such as using Yarn, NuGet, or Homebrew. However, consider the possibility that whoever is reading your README is a novice and would like more guidance. Listing specific steps helps remove ambiguity and gets people to using your project as quickly as possible. If it only runs in a specific context like a particular programming language version or operating system or has dependencies that have to be installed manually, also add a Requirements subsection.
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
Use examples liberally, and show the expected output if you can. It's helpful to have inline the smallest example of usage that you can demonstrate, while providing links to more sophisticated examples if they are too long to reasonably include in the README.
|
||||||
|
|
||||||
|
## Support
|
||||||
|
Tell people where they can go to for help. It can be any combination of an issue tracker, a chat room, an email address, etc.
|
||||||
|
|
||||||
|
## Roadmap
|
||||||
|
If you have ideas for releases in the future, it is a good idea to list them in the README.
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
State if you are open to contributions and what your requirements are for accepting them.
|
||||||
|
|
||||||
|
For people who want to make changes to your project, it's helpful to have some documentation on how to get started. Perhaps there is a script that they should run or some environment variables that they need to set. Make these steps explicit. These instructions could also be useful to your future self.
|
||||||
|
|
||||||
|
You can also document commands to lint the code or run tests. These steps help to ensure high code quality and reduce the likelihood that the changes inadvertently break something. Having instructions for running tests is especially helpful if it requires external setup, such as starting a Selenium server for testing in a browser.
|
||||||
|
|
||||||
|
## Authors and acknowledgment
|
||||||
|
Show your appreciation to those who have contributed to the project.
|
||||||
|
|
||||||
|
## License
|
||||||
|
For open source projects, say how it is licensed.
|
||||||
|
|
||||||
|
## Project status
|
||||||
|
If you have run out of energy or time for your project, put a note at the top of the README saying that development has slowed down or stopped completely. Someone may choose to fork your project or volunteer to step in as a maintainer or owner, allowing your project to keep going. You can also make an explicit request for maintainers.
|
||||||
|
|||||||
7422
package-lock.json
generated
Normal file
@ -17,7 +17,6 @@
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"faker": "5.5.3",
|
|
||||||
"@emotion/react": "^11.9.0",
|
"@emotion/react": "^11.9.0",
|
||||||
"@emotion/styled": "^11.8.1",
|
"@emotion/styled": "^11.8.1",
|
||||||
"@mui/material": "^5.6.4",
|
"@mui/material": "^5.6.4",
|
||||||
@ -26,7 +25,9 @@
|
|||||||
"chart.js": "^3.7.1",
|
"chart.js": "^3.7.1",
|
||||||
"eslint-plugin-react": "^7.29.4",
|
"eslint-plugin-react": "^7.29.4",
|
||||||
"eslit": "^6.0.0",
|
"eslit": "^6.0.0",
|
||||||
|
"faker": "5.5.3",
|
||||||
"next": "12.1.6",
|
"next": "12.1.6",
|
||||||
|
"nprogress": "^0.2.0",
|
||||||
"react": "18.1.0",
|
"react": "18.1.0",
|
||||||
"react-chartjs-2": "^4.1.0",
|
"react-chartjs-2": "^4.1.0",
|
||||||
"react-dom": "18.1.0",
|
"react-dom": "18.1.0",
|
||||||
@ -34,9 +35,10 @@
|
|||||||
"styled-components": "^5.3.5"
|
"styled-components": "^5.3.5"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/faker": "5.5.3",
|
|
||||||
"@types/chartjs": "^0.0.31",
|
"@types/chartjs": "^0.0.31",
|
||||||
|
"@types/faker": "5.5.3",
|
||||||
"@types/node": "^17.0.31",
|
"@types/node": "^17.0.31",
|
||||||
|
"@types/nprogress": "^0.2.0",
|
||||||
"@types/react": "^18.0.8",
|
"@types/react": "^18.0.8",
|
||||||
"@types/styled-components": "^5.1.25",
|
"@types/styled-components": "^5.1.25",
|
||||||
"eslint": "8.14.0",
|
"eslint": "8.14.0",
|
||||||
|
|||||||
@ -1,22 +1,48 @@
|
|||||||
import React, { useState, useEffect } from 'react'
|
import React, { useState, useEffect } from 'react'
|
||||||
import { useRouter } from 'next/router'
|
import { useRouter } from 'next/router'
|
||||||
|
|
||||||
import '../styles/globals.ts'
|
|
||||||
|
|
||||||
import { AppProps } from 'next/app'
|
import { AppProps } from 'next/app'
|
||||||
|
import NProgress from 'nprogress'
|
||||||
|
|
||||||
|
|
||||||
import Sidebar from '../src/components/sidebar/Sidebar'
|
import Sidebar from '../src/components/sidebar/Sidebar'
|
||||||
import { GlobalStyle } from '../styles/globals'
|
import { GlobalStyle } from '../styles/globals'
|
||||||
import { AppView } from '../styles/app/AppView'
|
import { AppView } from '../styles/app/AppView'
|
||||||
|
import '../styles/nprogress/nprogress.css'
|
||||||
|
import '../styles/globals.ts'
|
||||||
|
|
||||||
import Home from '.'
|
import Home from '.'
|
||||||
|
|
||||||
function MyApp({ Component, pageProps }: AppProps) {
|
import Head from 'next/head'
|
||||||
const [ auth, setAuth ] = useState(false)
|
|
||||||
|
|
||||||
|
function MyApp({ Component, pageProps }: AppProps) {
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const rota = router.pathname
|
const rota = router.pathname
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const handleStart = (url) => {
|
||||||
|
console.log(`Loading: ${url}`)
|
||||||
|
NProgress.start()
|
||||||
|
}
|
||||||
|
const handleStop = () => {
|
||||||
|
NProgress.done()
|
||||||
|
}
|
||||||
|
|
||||||
|
router.events.on('routeChangeStart', handleStart)
|
||||||
|
router.events.on('routeChangeComplete', handleStop)
|
||||||
|
router.events.on('routeChangeError', handleStop)
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
router.events.off('routeChangeStart', handleStart)
|
||||||
|
router.events.off('routeChangeComplete', handleStop)
|
||||||
|
router.events.off('routeChangeError', handleStop)
|
||||||
|
}
|
||||||
|
}, [router])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<AppView>
|
<AppView>
|
||||||
|
<Head>
|
||||||
|
<meta name="viewport" content="viewport-fit=cover" />
|
||||||
|
</Head>
|
||||||
<Home auth={rota} />
|
<Home auth={rota} />
|
||||||
<GlobalStyle />
|
<GlobalStyle />
|
||||||
{
|
{
|
||||||
|
|||||||
@ -39,7 +39,13 @@ export default class MyDocument extends Document {
|
|||||||
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap" rel="stylesheet"></link>
|
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap" rel="stylesheet"></link>
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com"/>
|
<link rel="preconnect" href="https://fonts.googleapis.com"/>
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin='true' />
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin='true' />
|
||||||
|
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"/>
|
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"/>
|
||||||
|
|
||||||
|
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400&family=Lobster&family=Poppins:ital,wght@0,500;0,600;0,800;1,500;1,600;1,700;1,800&display=swap" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
</Head>
|
</Head>
|
||||||
<body>
|
<body>
|
||||||
<Main />
|
<Main />
|
||||||
|
|||||||
48
pages/aboutUs.tsx
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
import Image from 'next/image'
|
||||||
|
import React from 'react'
|
||||||
|
import Banner from '../src/components/banner/Banner'
|
||||||
|
import Header from '../src/components/header/Header'
|
||||||
|
import { AboutUsView } from '../styles/layouts/aboutUs/AboutUsView'
|
||||||
|
|
||||||
|
export default function aboutUs() {
|
||||||
|
return (
|
||||||
|
<AboutUsView>
|
||||||
|
<Header name='' />
|
||||||
|
<Banner title='Quem Somos' subtitle='Soluções inteligentes em Gestão de Energia' imgSource='/assets/banners/aboutUsBanner.png' />
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<p>A <strong>SMART ENERGIA</strong> é uma consultoria independente especializada em Gestão de Energia Elétrica, consolidada como uma das três maiores consultorias do Brasil.
|
||||||
|
Devido à grande experiência em operações na CCEE – Câmara de Comercialização de Energia Elétrica e ANEEL, entrega resultados que superam as expectativas.</p>
|
||||||
|
|
||||||
|
<p>Nasceu para gerenciar a compra de energia com inovação, transparência e imparcialidade sendo o elo forte e necessário entre os Consumidores e os
|
||||||
|
Vendedores de energia. </p>
|
||||||
|
|
||||||
|
<p>Baseada em sua experiência no setor elétrico adquirida desde 2001 e em mais de 900 unidades migradas, atua na negociação de contratos de compra e venda de
|
||||||
|
energia, na Gestão de Energia no Mercado Livre e criação de produtos diferenciados para atender as necessidades específicas dos consumidores.</p>
|
||||||
|
|
||||||
|
<p>Apoiada pela sólida experiência de seus gestores, conhecendo as premissas dos agentes de Comercialização e Geração para a compra e venda de energia,
|
||||||
|
aplicamos as mesmas premissas a favor dos Consumidores, disponibilizando assim um diferencial único para a tomada de decisão e elaboração das estratégias de
|
||||||
|
contratação de energia.</p>
|
||||||
|
<ul>
|
||||||
|
<li><Image src='/assets/listIcon.svg' width={25} height={25} />{'Informação'}</li>
|
||||||
|
<li><Image src='/assets/listIcon.svg' width={25} height={25} />{'Economia'}</li>
|
||||||
|
<li><Image src='/assets/listIcon.svg' width={25} height={25} />{'Gestão de Energia'}</li>
|
||||||
|
<li><Image src='/assets/listIcon.svg' width={25} height={25} />{'Imparcialidade'}</li>
|
||||||
|
<li><Image src='/assets/listIcon.svg' width={25} height={25} />{'Previsão de Custos'}</li>
|
||||||
|
<li><Image src='/assets/listIcon.svg' width={25} height={25} />{'Experiência'}</li>
|
||||||
|
<li><Image src='/assets/listIcon.svg' width={25} height={25} />{'Relacionamento'}</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<article>
|
||||||
|
<aside>
|
||||||
|
<h2>Apoio a projetos sociais</h2>
|
||||||
|
<div>
|
||||||
|
<Image src='/assets/stamps/whiteStamp.png' width={200} height={200} />
|
||||||
|
<Image src='/assets/stamps/blueStamp.png' width={200} height={200} />
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</section>
|
||||||
|
</AboutUsView>
|
||||||
|
)
|
||||||
|
}
|
||||||
@ -2,6 +2,7 @@ import React from 'react'
|
|||||||
|
|
||||||
import Chart from '../src/components/graph/Chart'
|
import Chart from '../src/components/graph/Chart'
|
||||||
import Header from '../src/components/header/Header'
|
import Header from '../src/components/header/Header'
|
||||||
|
import PageTitle from '../src/components/pageTitle/PageTitle'
|
||||||
|
|
||||||
import { AccumulatedSavingsView } from '../styles/layouts/economy/accumulatedSavings/AccumulatedSavingsView'
|
import { AccumulatedSavingsView } from '../styles/layouts/economy/accumulatedSavings/AccumulatedSavingsView'
|
||||||
|
|
||||||
@ -9,10 +10,7 @@ export default function AccumulatedSavings() {
|
|||||||
return (
|
return (
|
||||||
<AccumulatedSavingsView>
|
<AccumulatedSavingsView>
|
||||||
<Header name='' />
|
<Header name='' />
|
||||||
<section>
|
<PageTitle title='Economia Acumulada' subtitle='Economia Bruta Estimada e Acumulada anual (Valores em R$ mil)' />
|
||||||
<h1>Economia Acumulada</h1>
|
|
||||||
<span>Economia Bruta Estimada e Acumulada anual (Valores em R$ mil)</span>
|
|
||||||
</section>
|
|
||||||
<section>
|
<section>
|
||||||
<Chart title='Indicador de custo' />
|
<Chart title='Indicador de custo' />
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@ -1,9 +1,13 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import BasicButton from '../src/components/buttons/basicButton/BasicButton'
|
import BasicButton from '../src/components/buttons/basicButton/BasicButton'
|
||||||
|
import GradientButton from '../src/components/buttons/gradientButton/GradientButton'
|
||||||
import Graph from '../src/components/graph/Chart'
|
import Graph from '../src/components/graph/Chart'
|
||||||
|
|
||||||
export default function areaTest() {
|
export default function areaTest() {
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
<Graph title='Indicador de custo' />
|
<Graph title='Indicador de custo' />
|
||||||
|
<GradientButton title='GRÁFICO' description='Gerar gráficos com os dados selecionados' orange />
|
||||||
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,16 +1,14 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import Chart from '../src/components/graph/Chart'
|
import Chart from '../src/components/graph/Chart'
|
||||||
import Header from '../src/components/header/Header'
|
import Header from '../src/components/header/Header'
|
||||||
|
import PageTitle from '../src/components/pageTitle/PageTitle'
|
||||||
import { ConsumptionView } from '../styles/layouts/consumption/ConsumptionView'
|
import { ConsumptionView } from '../styles/layouts/consumption/ConsumptionView'
|
||||||
|
|
||||||
export default function Consumption() {
|
export default function Consumption() {
|
||||||
return (
|
return (
|
||||||
<ConsumptionView>
|
<ConsumptionView>
|
||||||
<Header name='' />
|
<Header name='' />
|
||||||
<section>
|
<PageTitle title='Consumo' subtitle='Análise de Consumo'/>
|
||||||
<h1>Consumo</h1>
|
|
||||||
<span>Análise de Consumo</span>
|
|
||||||
</section>
|
|
||||||
<section>
|
<section>
|
||||||
<Chart title='Indicador de custo' />
|
<Chart title='Indicador de custo' />
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@ -2,16 +2,14 @@ import React from 'react'
|
|||||||
|
|
||||||
import Chart from '../src/components/graph/Chart'
|
import Chart from '../src/components/graph/Chart'
|
||||||
import Header from '../src/components/header/Header'
|
import Header from '../src/components/header/Header'
|
||||||
|
import PageTitle from '../src/components/pageTitle/PageTitle'
|
||||||
import { CostIndicatorView } from '../styles/layouts/economy/costIndicator/CostIndicatorView'
|
import { CostIndicatorView } from '../styles/layouts/economy/costIndicator/CostIndicatorView'
|
||||||
|
|
||||||
export default function CostIndicator() {
|
export default function CostIndicator() {
|
||||||
return (
|
return (
|
||||||
<CostIndicatorView>
|
<CostIndicatorView>
|
||||||
<Header name='' />
|
<Header name='' />
|
||||||
<section>
|
<PageTitle title='Indicador de Custo' subtitle='Valores em R$/MWh'/>
|
||||||
<h1>Indicador de Custo</h1>
|
|
||||||
<span>Valores em R$/MWh</span>
|
|
||||||
</section>
|
|
||||||
<section>
|
<section>
|
||||||
<Chart title='Indicador de custo' />
|
<Chart title='Indicador de custo' />
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@ -3,12 +3,14 @@ import React from 'react'
|
|||||||
import { DashboardView } from '../styles/layouts/dashboard/DashboardView'
|
import { DashboardView } from '../styles/layouts/dashboard/DashboardView'
|
||||||
import MapCard from '../src/components/mapCard/MapCard'
|
import MapCard from '../src/components/mapCard/MapCard'
|
||||||
import GraphCard from '../src/components/graph/graphCard/ChartCard'
|
import GraphCard from '../src/components/graph/graphCard/ChartCard'
|
||||||
|
import Header from '../src/components/header/Header'
|
||||||
|
import PageTitle from '../src/components/pageTitle/PageTitle'
|
||||||
|
|
||||||
export default function Dashboard() {
|
export default function Dashboard() {
|
||||||
return (
|
return (
|
||||||
<DashboardView>
|
<DashboardView>
|
||||||
<h1>Visão Geral</h1>
|
<Header name='' />
|
||||||
<span>Bem Vindo a Smart Energia</span>
|
<PageTitle title='Visão Geral' subtitle='Bem Vindo a Smart Energia' />
|
||||||
<section className="cardsSection" >
|
<section className="cardsSection" >
|
||||||
<MapCard title='R$/MWh' subtitle='abril / 22' statistic='' imgSource='/moneyIcon.svg' />
|
<MapCard title='R$/MWh' subtitle='abril / 22' statistic='' imgSource='/moneyIcon.svg' />
|
||||||
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
|
<MapCard title='SE/CO' subtitle='Sudeste' statistic='R$ 273,54' imgSource='/mapSample.svg' />
|
||||||
|
|||||||
@ -2,6 +2,7 @@ import React from 'react'
|
|||||||
|
|
||||||
import Chart from '../src/components/graph/Chart'
|
import Chart from '../src/components/graph/Chart'
|
||||||
import Header from '../src/components/header/Header'
|
import Header from '../src/components/header/Header'
|
||||||
|
import PageTitle from '../src/components/pageTitle/PageTitle'
|
||||||
|
|
||||||
import { EstimatedCostView } from '../styles/layouts/economy/estimatedCost/EstimatedCostView'
|
import { EstimatedCostView } from '../styles/layouts/economy/estimatedCost/EstimatedCostView'
|
||||||
|
|
||||||
@ -9,10 +10,7 @@ export default function EstimatedCost() {
|
|||||||
return (
|
return (
|
||||||
<EstimatedCostView>
|
<EstimatedCostView>
|
||||||
<Header name='' />
|
<Header name='' />
|
||||||
<section>
|
<PageTitle title='Custos Estimados' subtitle='Comparativo de Custo Estimado' />
|
||||||
<h1>Custo Estimado</h1>
|
|
||||||
<span>Comparativo de Custo Estimado</span>
|
|
||||||
</section>
|
|
||||||
<section>
|
<section>
|
||||||
<Chart title='Indicador de custo' />
|
<Chart title='Indicador de custo' />
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
26
pages/faq.tsx
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import CommonQuestionsCard from '../src/components/faqQuestionsCard/FaqQuestionsCard'
|
||||||
|
import Header from '../src/components/header/Header'
|
||||||
|
import { FaqView } from '../styles/layouts/commonQuestions/FaqView'
|
||||||
|
|
||||||
|
export default function commonQuestions() {
|
||||||
|
return (
|
||||||
|
<FaqView>
|
||||||
|
<Header name='' />
|
||||||
|
<h1>Perguntas Frequentes</h1>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
||||||
|
<section className='CommonQuestionsSection' >
|
||||||
|
<CommonQuestionsCard />
|
||||||
|
<hr />
|
||||||
|
<CommonQuestionsCard />
|
||||||
|
<hr />
|
||||||
|
<CommonQuestionsCard />
|
||||||
|
<hr />
|
||||||
|
<CommonQuestionsCard />
|
||||||
|
<hr />
|
||||||
|
<CommonQuestionsCard />
|
||||||
|
<hr />
|
||||||
|
</section>
|
||||||
|
</FaqView>
|
||||||
|
)
|
||||||
|
}
|
||||||
@ -2,6 +2,7 @@ import React from 'react'
|
|||||||
|
|
||||||
import Chart from '../src/components/graph/Chart'
|
import Chart from '../src/components/graph/Chart'
|
||||||
import Header from '../src/components/header/Header'
|
import Header from '../src/components/header/Header'
|
||||||
|
import PageTitle from '../src/components/pageTitle/PageTitle'
|
||||||
|
|
||||||
import { GrossSavingsView } from '../styles/layouts/economy/grossSavings/GrossSavings'
|
import { GrossSavingsView } from '../styles/layouts/economy/grossSavings/GrossSavings'
|
||||||
|
|
||||||
@ -9,10 +10,7 @@ export default function GrossSavings() {
|
|||||||
return (
|
return (
|
||||||
<GrossSavingsView>
|
<GrossSavingsView>
|
||||||
<Header name='' />
|
<Header name='' />
|
||||||
<section>
|
<PageTitle title='Economia Bruta' subtitle='Economia Bruta Estimada e Acumulada anual (Valores em R$ mil)' />
|
||||||
<h1>Economia Bruta</h1>
|
|
||||||
<span>Economia Bruta Estimada e Acumulada anual (Valores em R$ mil)</span>
|
|
||||||
</section>
|
|
||||||
<section>
|
<section>
|
||||||
<Chart title='Indicador de custo' />
|
<Chart title='Indicador de custo' />
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@ -2,19 +2,15 @@ import React from 'react';
|
|||||||
import BasicButton from '../src/components/buttons/basicButton/BasicButton';
|
import BasicButton from '../src/components/buttons/basicButton/BasicButton';
|
||||||
import Sidebar from '../src/components/sidebar/Sidebar';
|
import Sidebar from '../src/components/sidebar/Sidebar';
|
||||||
|
|
||||||
import { TableView} from '../styles/layouts/resumoOperacao/ResumoOperacaoView';
|
import { TableView } from '../styles/layouts/ResumoOperacao/ResumoOperacaoView';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export default function ResumoOperacao() {
|
export default function ResumoOperacao() {
|
||||||
return(
|
return(
|
||||||
|
|
||||||
|
|
||||||
<TableView>
|
<TableView>
|
||||||
<h1>Resumo de Operaçoes</h1>
|
<Header name='' />
|
||||||
<h2>Operações detalhadas</h2>
|
<PageTitle title='Resumo de Operaçoes' subtitle='Operações detalhadas' />
|
||||||
<h3>Seletor Mês</h3>
|
|
||||||
|
|
||||||
|
<h3>Seletor Mês</h3>
|
||||||
<table className="tg">
|
<table className="tg">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
|
|||||||
@ -1,13 +1,9 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import Banner from '../src/components/banner/Banner';
|
import Banner from '../src/components/banner/Banner';
|
||||||
|
|
||||||
import { TelemetriaView, Buttons} from '../styles/layouts/Telemetria/TelemetriaView';
|
import { TelemetriaView, Buttons} from '../styles/layouts/Telemetria/TelemetriaView';
|
||||||
|
import GradientButton from '../src/components/buttons/gradientButton/GradientButton'
|
||||||
|
import Header from '../src/components/header/Header';
|
||||||
|
|
||||||
import MenuItem from '@mui/material/MenuItem';
|
import MenuItem from '@mui/material/MenuItem';
|
||||||
import FormHelperText from '@mui/material/FormHelperText';
|
|
||||||
import FormControl from '@mui/material/FormControl';
|
import FormControl from '@mui/material/FormControl';
|
||||||
import Select, { SelectChangeEvent } from '@mui/material/Select';
|
import Select, { SelectChangeEvent } from '@mui/material/Select';
|
||||||
|
|
||||||
@ -27,23 +23,23 @@ export default function Telemetria() {
|
|||||||
return(
|
return(
|
||||||
|
|
||||||
<TelemetriaView>
|
<TelemetriaView>
|
||||||
|
<Header name='' />
|
||||||
<Banner title ='Telemetria' subtitle='Dados Coletados do Sistema de Coleta de Dados de Energia -
|
<Banner title ='Telemetria' subtitle='Dados Coletados do Sistema de Coleta de Dados de Energia -
|
||||||
SCDE da Câmara de Comercialização de Energia Elétrica - CCEE,
|
SCDE da Câmara de Comercialização de Energia Elétrica - CCEE,
|
||||||
sendo que as quantidades aqui informadas são de responsabilidade do agente de medição
|
sendo que as quantidades aqui informadas são de responsabilidade do agente de medição
|
||||||
- Distribuidora.' imgSource='/assets/graphical.png' />
|
- Distribuidora.' imgSource='/assets/graphical.png' />
|
||||||
|
|
||||||
|
|
||||||
<FormControl sx={{ width: 250, mt:10 , pl:8}} style={{}}>
|
<FormControl size="small" sx={{ width: 300, mt:10 , pl:7 }} style={{}}>
|
||||||
<FormHelperText style={{}}>Unidade</FormHelperText>
|
<p className='title'>Unidade</p>
|
||||||
<Select
|
<Select
|
||||||
value={age}
|
value={age}
|
||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
displayEmpty
|
displayEmpty
|
||||||
inputProps={{ 'aria-label': 'Without label' }}
|
|
||||||
>
|
>
|
||||||
<MenuItem value="">
|
<MenuItem value="">
|
||||||
<em>Filial 3</em>
|
<span className='titleMenuItem'>Filial 3</span>
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
<MenuItem value={10}>Filial 3</MenuItem>
|
<MenuItem value={10}>Filial 3</MenuItem>
|
||||||
<MenuItem value={20}>Twenty</MenuItem>
|
<MenuItem value={20}>Twenty</MenuItem>
|
||||||
@ -52,16 +48,16 @@ export default function Telemetria() {
|
|||||||
|
|
||||||
</FormControl>
|
</FormControl>
|
||||||
|
|
||||||
<FormControl sx={{ width: 240, mt:10 , pl:8}} >
|
<FormControl size="small" sx={{ width: 300, mt:10 , pl:7}} >
|
||||||
<FormHelperText>Data Final</FormHelperText>
|
<p className='title'>Data Inicial</p>
|
||||||
<Select
|
<Select
|
||||||
value={age}
|
value={age}
|
||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
displayEmpty
|
displayEmpty
|
||||||
inputProps={{ 'aria-label': 'Without label' }}
|
|
||||||
>
|
>
|
||||||
<MenuItem value="">
|
<MenuItem value="">
|
||||||
<em>07/09/2021</em>
|
<span className='titleMenuItem'>07/09/2021</span>
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
<MenuItem value={10}>Filial 3</MenuItem>
|
<MenuItem value={10}>Filial 3</MenuItem>
|
||||||
<MenuItem value={20}>Twenty</MenuItem>
|
<MenuItem value={20}>Twenty</MenuItem>
|
||||||
@ -69,8 +65,8 @@ export default function Telemetria() {
|
|||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
|
|
||||||
<FormControl sx={{ width: 240, mt:10 , pl:8}} >
|
<FormControl size="small" sx={{ width: 300, mt:10 , pl:7, }} >
|
||||||
<FormHelperText>Data Final</FormHelperText>
|
<p className='title'>Data Final</p>
|
||||||
<Select
|
<Select
|
||||||
value={age}
|
value={age}
|
||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
@ -78,7 +74,7 @@ export default function Telemetria() {
|
|||||||
inputProps={{ 'aria-label': 'Without label' }}
|
inputProps={{ 'aria-label': 'Without label' }}
|
||||||
>
|
>
|
||||||
<MenuItem value="">
|
<MenuItem value="">
|
||||||
<em>07/09/2021</em>
|
<span className='titleMenuItem'>30/06/2000</span>
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
<MenuItem value={10}>Filial 3</MenuItem>
|
<MenuItem value={10}>Filial 3</MenuItem>
|
||||||
<MenuItem value={20}>Twenty</MenuItem>
|
<MenuItem value={20}>Twenty</MenuItem>
|
||||||
@ -86,8 +82,8 @@ export default function Telemetria() {
|
|||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
|
|
||||||
<FormControl sx={{ width: 240, mt:10 , pl:8}} >
|
<FormControl size="small" sx={{ width: 280, mt:10 , pl:5}} >
|
||||||
<FormHelperText >Discretização</FormHelperText>
|
<p className='title'>Discretização</p>
|
||||||
<Select
|
<Select
|
||||||
value={age}
|
value={age}
|
||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
@ -95,7 +91,7 @@ export default function Telemetria() {
|
|||||||
inputProps={{ 'aria-label': 'Without label' }}
|
inputProps={{ 'aria-label': 'Without label' }}
|
||||||
>
|
>
|
||||||
<MenuItem value="">
|
<MenuItem value="">
|
||||||
<em>60 min</em>
|
<span className='titleMenuItem'>60 min</span>
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
<MenuItem value={10}>Filial 3</MenuItem>
|
<MenuItem value={10}>Filial 3</MenuItem>
|
||||||
<MenuItem value={20}>Twenty</MenuItem>
|
<MenuItem value={20}>Twenty</MenuItem>
|
||||||
@ -104,9 +100,9 @@ export default function Telemetria() {
|
|||||||
</FormControl>
|
</FormControl>
|
||||||
|
|
||||||
<Buttons>
|
<Buttons>
|
||||||
<button className='btnGrafico'> <p>GRÁFICOS</p> <br /> GERAR GRÁFICOS COM OS DADOS SELECIONADOS</button>
|
<GradientButton title='GRÁFICO' description='Gerar gráficos com os dados selecionados' orange />
|
||||||
<button className='btndownload'> <p>DOWNLOADS</p> <br /> DADOS BRUTOS SELECIONADOS</button>
|
<GradientButton title='DOWNLOADS' description='Gerar gráficos com os dados selecionados' purple />
|
||||||
<button className='btnDados'> <p>DADOS</p> <br /> HORÁRIOS DO MÊS ATUAL</button>
|
<GradientButton title='DADOS' description='Gerar gráficos com os dados selecionados' green />
|
||||||
</Buttons>
|
</Buttons>
|
||||||
</TelemetriaView>
|
</TelemetriaView>
|
||||||
)
|
)
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 3.6 MiB After Width: | Height: | Size: 3.6 MiB |
3
public/assets/less-icon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="33" height="33" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M8.4917 16.1553H24.8894" stroke="#254F7F" stroke-width="1.2" stroke-linecap="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 198 B |
11
public/assets/listIcon.svg
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M0 16.0497C0 7.21311 7.16344 0.00195312 16 0.00195312C24.8366 0.00195312 32 7.21311 32 16.0497C32 24.8862 24.8366 32.0974 16 32.0974C7.16344 32.0974 0 24.8862 0 16.0497Z" fill="#F2F4F7"/>
|
||||||
|
<g clip-path="url(#clip0_125_1603)">
|
||||||
|
<path d="M16.6667 9.33496L10 17.335H16L15.3333 22.6683L22 14.6683H16L16.6667 9.33496Z" stroke="#475467" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_125_1603">
|
||||||
|
<rect width="16" height="16" fill="white" transform="translate(8 8.00195)"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 653 B |
4
public/assets/plus-icon.svg
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
<svg width="33" height="33" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M8.49219 16.79H24.8899" stroke="black" stroke-width="1.2" stroke-linecap="round"/>
|
||||||
|
<path d="M16.6909 8.5918L16.6909 24.9895" stroke="black" stroke-width="1.2" stroke-linecap="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 296 B |
BIN
public/assets/png/copel.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
public/assets/png/copel.xcf
Normal file
6
public/assets/sidebar/consumptionIcon.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M17.25 23.3618C17.8465 23.3612 18.4185 23.1239 18.8403 22.7021C19.2621 22.2803 19.4993 21.7084 19.5 21.1118V18.0766C19.5 17.8777 19.421 17.687 19.2803 17.5463C19.1397 17.4057 18.9489 17.3266 18.75 17.3266C18.5511 17.3266 18.3603 17.4057 18.2197 17.5463C18.079 17.687 18 17.8777 18 18.0766V21.1118C17.9998 21.3107 17.9207 21.5013 17.7801 21.6419C17.6395 21.7826 17.4489 21.8616 17.25 21.8618H3.75C3.55114 21.8616 3.36048 21.7826 3.21987 21.6419C3.07925 21.5013 3.00018 21.3107 3 21.1118V4.61182C3.00018 4.41296 3.07925 4.2223 3.21987 4.08168C3.36048 3.94107 3.55114 3.862 3.75 3.86182H17.25C17.4489 3.862 17.6395 3.94107 17.7801 4.08168C17.9207 4.2223 17.9998 4.41296 18 4.61182V6.92482C18 7.12373 18.079 7.31449 18.2197 7.45515C18.3603 7.5958 18.5511 7.67482 18.75 7.67482C18.9489 7.67482 19.1397 7.5958 19.2803 7.45515C19.421 7.31449 19.5 7.12373 19.5 6.92482V4.61182C19.4993 4.01528 19.2621 3.44336 18.8403 3.02155C18.4185 2.59973 17.8465 2.36247 17.25 2.36182H3.75C3.15346 2.36247 2.58155 2.59973 2.15973 3.02155C1.73792 3.44336 1.50066 4.01528 1.5 4.61182V21.1118C1.50066 21.7084 1.73792 22.2803 2.15973 22.7021C2.58155 23.1239 3.15346 23.3612 3.75 23.3618H17.25Z" fill="#969BA0"/>
|
||||||
|
<path d="M5.25 15.1118C5.05109 15.1118 4.86032 15.1908 4.71967 15.3315C4.57902 15.4721 4.5 15.6629 4.5 15.8618C4.5 16.0607 4.57902 16.2515 4.71967 16.3921C4.86032 16.5328 5.05109 16.6118 5.25 16.6118H8.25C8.44891 16.6118 8.63968 16.5328 8.78033 16.3921C8.92098 16.2515 9 16.0607 9 15.8618C9 15.6629 8.92098 15.4721 8.78033 15.3315C8.63968 15.1908 8.44891 15.1118 8.25 15.1118H5.25Z" fill="#969BA0"/>
|
||||||
|
<path d="M19.9548 8.78575C19.8142 8.64515 19.6234 8.56616 19.4246 8.56616C19.2257 8.56616 19.0349 8.64515 18.8943 8.78575L11.4698 16.2103C11.4001 16.2799 11.3448 16.3626 11.3071 16.4536C11.2694 16.5446 11.25 16.6421 11.25 16.7406V18.1117H5.25C5.05109 18.1117 4.86032 18.1907 4.71967 18.3314C4.57902 18.472 4.5 18.6628 4.5 18.8617C4.5 19.0606 4.57902 19.2514 4.71967 19.392C4.86032 19.5327 5.05109 19.6117 5.25 19.6117H14.1215C14.3203 19.6117 14.5111 19.5326 14.6517 19.392L22.0767 11.9674C22.2173 11.8268 22.2963 11.636 22.2963 11.4372C22.2963 11.2383 22.2173 11.0475 22.0767 10.9069L19.9548 8.78575ZM13.811 18.1117H12.75V17.0511L19.4246 10.3766L20.4855 11.4372L13.811 18.1117Z" fill="#969BA0"/>
|
||||||
|
<path d="M11.25 8.73682C11.25 8.06931 11.0521 7.41678 10.6812 6.86177C10.3104 6.30675 9.78326 5.87417 9.16656 5.61872C8.54986 5.36328 7.87126 5.29644 7.21657 5.42667C6.56189 5.55689 5.96052 5.87833 5.48852 6.35033C5.01651 6.82233 4.69508 7.4237 4.56485 8.07839C4.43463 8.73307 4.50146 9.41167 4.75691 10.0284C5.01235 10.6451 5.44494 11.1722 5.99995 11.543C6.55497 11.9139 7.20749 12.1118 7.875 12.1118C8.7698 12.1108 9.62767 11.7549 10.2604 11.1222C10.8931 10.4895 11.249 9.63162 11.25 8.73682ZM7.875 10.6118C7.50416 10.6118 7.14165 10.5019 6.83331 10.2958C6.52497 10.0898 6.28464 9.79696 6.14273 9.45435C6.00081 9.11174 5.96368 8.73474 6.03603 8.37102C6.10838 8.00731 6.28695 7.67322 6.54918 7.41099C6.8114 7.14877 7.14549 6.97019 7.50921 6.89785C7.87292 6.8255 8.24992 6.86263 8.59253 7.00454C8.93514 7.14646 9.22798 7.38678 9.43401 7.69512C9.64003 8.00347 9.75 8.36598 9.75 8.73682C9.74949 9.23394 9.55178 9.71055 9.20026 10.0621C8.84874 10.4136 8.37212 10.6113 7.875 10.6118Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.3 KiB |
6
public/assets/sidebar/dashboardIcon.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12 22.6118C14.5859 22.6118 17.0658 21.5846 18.8943 19.7561C20.7228 17.9276 21.75 15.4477 21.75 12.8618C21.75 10.276 20.7228 7.79601 18.8943 5.96753C17.0658 4.13905 14.5859 3.11182 12 3.11182C11.8011 3.11182 11.6103 3.19083 11.4697 3.33149C11.329 3.47214 11.25 3.6629 11.25 3.86182V6.11182C11.25 6.31073 11.329 6.50149 11.4697 6.64215C11.6103 6.7828 11.8011 6.86182 12 6.86182C12.1989 6.86182 12.3897 6.7828 12.5303 6.64215C12.671 6.50149 12.75 6.31073 12.75 6.11182V4.64549C14.3112 4.78811 15.7995 5.37263 17.0405 6.33058C18.2816 7.28853 19.2239 8.58026 19.7573 10.0545C20.2907 11.5287 20.393 13.1244 20.0522 14.6546C19.7114 16.1849 18.9417 17.5864 17.8331 18.6949C16.7245 19.8035 15.3231 20.5732 13.7928 20.914C12.2626 21.2548 10.6669 21.1525 9.19266 20.6191C7.71844 20.0858 6.42672 19.1434 5.46877 17.9024C4.51081 16.6613 3.9263 15.1731 3.78367 13.6118H5.25C5.44891 13.6118 5.63968 13.5328 5.78033 13.3921C5.92098 13.2515 6 13.0607 6 12.8618C6 12.6629 5.92098 12.4721 5.78033 12.3315C5.63968 12.1908 5.44891 12.1118 5.25 12.1118H3C2.80109 12.1118 2.61032 12.1908 2.46967 12.3315C2.32902 12.4721 2.25 12.6629 2.25 12.8618C2.25292 15.4468 3.28108 17.925 5.10893 19.7529C6.93678 21.5807 9.41503 22.6089 12 22.6118Z" fill="#969BA0"/>
|
||||||
|
<path d="M10.5559 12.4782C10.5206 12.6031 10.5018 12.732 10.5 12.8618C10.5 13.1584 10.588 13.4485 10.7528 13.6951C10.9176 13.9418 11.1519 14.1341 11.426 14.2476C11.7001 14.3611 12.0017 14.3908 12.2926 14.3329C12.5836 14.2751 12.8509 14.1322 13.0607 13.9224C13.2705 13.7127 13.4133 13.4454 13.4712 13.1544C13.5291 12.8634 13.4994 12.5618 13.3858 12.2877C13.2723 12.0137 13.08 11.7794 12.8334 11.6146C12.5867 11.4497 12.2967 11.3618 12 11.3618C11.8703 11.3635 11.7413 11.3823 11.6165 11.4177L6.15525 5.95651C6.08607 5.88487 6.00331 5.82774 5.9118 5.78843C5.8203 5.74912 5.72189 5.72843 5.6223 5.72757C5.52272 5.7267 5.42396 5.74568 5.33179 5.78339C5.23961 5.8211 5.15587 5.87679 5.08545 5.94721C5.01503 6.01763 4.95934 6.10137 4.92163 6.19354C4.88392 6.28571 4.86495 6.38447 4.86581 6.48406C4.86668 6.58364 4.88737 6.68206 4.92667 6.77356C4.96598 6.86506 5.02312 6.94782 5.09475 7.01701L10.5559 12.4782Z" fill="#969BA0"/>
|
||||||
|
<path d="M15.75 12.8618C15.75 13.0607 15.829 13.2515 15.9697 13.3921C16.1103 13.5328 16.3011 13.6118 16.5 13.6118H18C18.1989 13.6118 18.3897 13.5328 18.5303 13.3921C18.671 13.2515 18.75 13.0607 18.75 12.8618C18.75 12.6629 18.671 12.4721 18.5303 12.3315C18.3897 12.1908 18.1989 12.1118 18 12.1118H16.5C16.3011 12.1118 16.1103 12.1908 15.9697 12.3315C15.829 12.4721 15.75 12.6629 15.75 12.8618Z" fill="#969BA0"/>
|
||||||
|
<path d="M15.7125 8.08847L14.6514 9.1492C14.5817 9.21883 14.5264 9.30151 14.4887 9.39251C14.451 9.48351 14.4315 9.58105 14.4315 9.67956C14.4315 9.77807 14.4508 9.87562 14.4885 9.96665C14.5262 10.0577 14.5814 10.1404 14.651 10.2101C14.7207 10.2798 14.8033 10.335 14.8943 10.3728C14.9853 10.4105 15.0829 10.4299 15.1814 10.43C15.2799 10.43 15.3775 10.4106 15.4685 10.373C15.5595 10.3353 15.6422 10.2801 15.7119 10.2104L16.7732 9.14995C16.8429 9.0803 16.8982 8.9976 16.936 8.90659C16.9737 8.81557 16.9931 8.71801 16.9932 8.61947C16.9932 8.52094 16.9738 8.42337 16.9362 8.33232C16.8985 8.24128 16.8433 8.15854 16.7736 8.08885C16.704 8.01915 16.6213 7.96385 16.5302 7.92611C16.4392 7.88837 16.3417 7.86893 16.2431 7.8689C16.1446 7.86886 16.047 7.88823 15.956 7.92591C15.8649 7.96358 15.7822 8.01882 15.7125 8.08847Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.4 KiB |
5
public/assets/sidebar/economyIcon.svg
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M9.75 13.6118C10.3433 13.6118 10.9234 13.4359 11.4167 13.1062C11.9101 12.7766 12.2946 12.308 12.5216 11.7599C12.7487 11.2117 12.8081 10.6085 12.6924 10.0265C12.5766 9.4446 12.2909 8.91006 11.8713 8.4905C11.4518 8.07094 10.9172 7.78522 10.3353 7.66946C9.75333 7.55371 9.15013 7.61312 8.60195 7.84018C8.05377 8.06724 7.58524 8.45176 7.25559 8.94511C6.92595 9.43846 6.75 10.0185 6.75 10.6118C6.75077 11.4072 7.06709 12.1698 7.62954 12.7323C8.19198 13.2947 8.95459 13.611 9.75 13.6118ZM9.75 9.11182C10.0467 9.11182 10.3367 9.19979 10.5834 9.36461C10.83 9.52944 11.0223 9.7637 11.1358 10.0378C11.2494 10.3119 11.2791 10.6135 11.2212 10.9045C11.1633 11.1954 11.0204 11.4627 10.8107 11.6725C10.6009 11.8823 10.3336 12.0251 10.0426 12.083C9.75166 12.1409 9.45006 12.1112 9.17598 11.9976C8.90189 11.8841 8.66762 11.6918 8.5028 11.4452C8.33797 11.1985 8.25 10.9085 8.25 10.6118C8.25054 10.2142 8.40874 9.83294 8.68993 9.55175C8.97112 9.27056 9.35234 9.11235 9.75 9.11182Z" fill="#969BA0"/>
|
||||||
|
<path d="M21.468 15.5393C21.7156 15.2077 21.881 14.8221 21.9506 14.4142C22.0203 14.0063 21.9922 13.5876 21.8686 13.1927L21.3925 11.6436C21.169 10.9089 20.7146 10.2658 20.0967 9.80978C19.4789 9.35372 18.7304 9.10897 17.9625 9.11184H14.5972C14.3983 9.11184 14.2075 9.19086 14.0668 9.33151C13.9262 9.47216 13.8472 9.66293 13.8472 9.86184C13.8472 10.0608 13.9262 10.2515 14.0668 10.3922C14.2075 10.5328 14.3983 10.6118 14.5972 10.6118H17.9625C18.4094 10.6103 18.8448 10.7528 19.2043 11.0183C19.5638 11.2837 19.8282 11.6579 19.9583 12.0854L20.4344 13.6338C20.487 13.8046 20.4987 13.9853 20.4687 14.1615C20.4387 14.3376 20.3678 14.5043 20.2616 14.648C20.1555 14.7918 20.0171 14.9087 19.8576 14.9892C19.6981 15.0698 19.5219 15.1118 19.3432 15.1118H12.4666C12.4453 15.1118 12.4276 15.1221 12.4066 15.1239C12.3562 15.122 12.3075 15.1118 12.2563 15.1118H7.55384C6.7204 15.1088 5.9082 15.3746 5.2378 15.8698C4.56741 16.3649 4.07456 17.0631 3.83241 17.8606L3.27246 19.6793C3.14167 20.105 3.11256 20.5553 3.18746 20.9943C3.26236 21.4332 3.4392 21.8484 3.70375 22.2066C3.9683 22.5647 4.31318 22.8558 4.71069 23.0565C5.10819 23.2571 5.54722 23.3617 5.99249 23.3618H13.8172C14.2625 23.3617 14.7015 23.2572 15.0991 23.0566C15.4966 22.856 15.8415 22.5649 16.1061 22.2067C16.3707 21.8485 16.5476 21.4333 16.6225 20.9943C16.6974 20.5554 16.6683 20.105 16.5375 19.6793L15.9779 17.8607C15.8362 17.4078 15.613 16.9846 15.3193 16.6118H19.3432C19.757 16.6137 20.1652 16.5175 20.5346 16.3311C20.9039 16.1447 21.2238 15.8733 21.468 15.5393ZM14.8996 21.3152C14.7753 21.4854 14.6123 21.6237 14.4241 21.7187C14.236 21.8137 14.028 21.8628 13.8172 21.8618H5.99249C5.78189 21.8618 5.57423 21.8124 5.38622 21.7175C5.19821 21.6226 5.0351 21.4849 4.91 21.3155C4.7849 21.146 4.7013 20.9496 4.66594 20.742C4.63058 20.5344 4.64443 20.3214 4.70639 20.1201L5.26596 18.3015C5.41462 17.8112 5.71752 17.3819 6.12964 17.0775C6.54176 16.7731 7.04111 16.6098 7.55346 16.6118H12.256C12.7683 16.6098 13.2677 16.7731 13.6798 17.0775C14.0919 17.3819 14.3948 17.8112 14.5435 18.3015L15.103 20.1201C15.1661 20.3212 15.1806 20.5345 15.1452 20.7423C15.1099 20.9501 15.0257 21.1465 14.8996 21.3155V21.3152Z" fill="#969BA0"/>
|
||||||
|
<path d="M16.125 7.61181C16.6442 7.61181 17.1517 7.45786 17.5834 7.16942C18.015 6.88098 18.3515 6.47101 18.5502 5.99136C18.7489 5.5117 18.8008 4.9839 18.6996 4.4747C18.5983 3.9655 18.3483 3.49777 17.9812 3.13066C17.614 2.76355 17.1463 2.51354 16.6371 2.41226C16.1279 2.31097 15.6001 2.36295 15.1205 2.56163C14.6408 2.76031 14.2308 3.09677 13.9424 3.52844C13.654 3.96012 13.5 4.46764 13.5 4.98681C13.5008 5.68275 13.7777 6.34994 14.2698 6.84205C14.7619 7.33415 15.4291 7.61098 16.125 7.61181ZM16.125 3.86182C16.3475 3.86182 16.565 3.9278 16.75 4.05141C16.935 4.17503 17.0792 4.35073 17.1644 4.5563C17.2495 4.76186 17.2718 4.98806 17.2284 5.20629C17.185 5.42452 17.0778 5.62497 16.9205 5.78231C16.7632 5.93964 16.5627 6.04679 16.3445 6.0902C16.1262 6.1336 15.9 6.11133 15.6945 6.02618C15.4889 5.94103 15.3132 5.79683 15.1896 5.61183C15.066 5.42682 15 5.20932 15 4.98681C15.0003 4.68855 15.119 4.4026 15.3299 4.19169C15.5408 3.98079 15.8267 3.86215 16.125 3.86182Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4.1 KiB |
6
public/assets/sidebar/newsIcon.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M21.75 10.6118H16.5V4.61182C16.4993 4.01528 16.2621 3.44336 15.8403 3.02155C15.4185 2.59973 14.8465 2.36247 14.25 2.36182H3.75C3.15346 2.36247 2.58155 2.59973 2.15973 3.02155C1.73792 3.44336 1.50066 4.01528 1.5 4.61182V21.1118C1.50066 21.7084 1.73792 22.2803 2.15973 22.7021C2.58155 23.1239 3.15346 23.3612 3.75 23.3618H18.75C19.7442 23.3606 20.6973 22.9652 21.4004 22.2622C22.1034 21.5592 22.4988 20.606 22.5 19.6118V11.3618C22.5 11.1629 22.421 10.9721 22.2803 10.8315C22.1397 10.6908 21.9489 10.6118 21.75 10.6118ZM3 21.1118V4.61182C3.00018 4.41296 3.07925 4.2223 3.21987 4.08168C3.36048 3.94107 3.55114 3.862 3.75 3.86182H14.25C14.4489 3.862 14.6395 3.94107 14.7801 4.08168C14.9207 4.2223 14.9998 4.41296 15 4.61182V21.8618H3.75C3.55114 21.8616 3.36048 21.7826 3.21987 21.6419C3.07925 21.5013 3.00018 21.3107 3 21.1118ZM21 19.6118C20.9993 20.2084 20.7621 20.7803 20.3403 21.2021C19.9185 21.6239 19.3465 21.8612 18.75 21.8618H16.5V12.1118H21V19.6118Z" fill="#969BA0"/>
|
||||||
|
<path d="M12.3 7.01182L9.72405 8.94322L7.91602 7.73782C7.79279 7.65577 7.64805 7.61199 7.5 7.61199C7.35195 7.61199 7.20721 7.65577 7.08397 7.73782L4.83397 9.23782C4.75104 9.29202 4.67967 9.36211 4.62398 9.44404C4.56829 9.52598 4.52939 9.61814 4.50952 9.71519C4.48965 9.81225 4.4892 9.91228 4.50821 10.0095C4.52721 10.1067 4.5653 10.1992 4.62025 10.2817C4.67521 10.3641 4.74595 10.4348 4.82839 10.4898C4.91084 10.5447 5.00335 10.5828 5.10058 10.6017C5.19782 10.6207 5.29785 10.6202 5.3949 10.6003C5.49195 10.5805 5.5841 10.5415 5.66602 10.4858L7.5 9.26309L9.33398 10.4856C9.46295 10.572 9.61561 10.6161 9.77078 10.6119C9.92596 10.6076 10.076 10.5552 10.2 10.4618L13.2 8.21182C13.2788 8.15272 13.3452 8.07869 13.3954 7.99394C13.4455 7.90919 13.4785 7.81538 13.4925 7.71788C13.5064 7.62038 13.501 7.52109 13.4765 7.42568C13.4521 7.33027 13.4091 7.24061 13.35 7.16182C13.2909 7.08302 13.2169 7.01664 13.1321 6.96646C13.0474 6.91628 12.9536 6.88328 12.8561 6.86935C12.7586 6.85543 12.6593 6.86084 12.5639 6.88528C12.4685 6.90972 12.3788 6.95272 12.3 7.01182Z" fill="#969BA0"/>
|
||||||
|
<path d="M5.25 15.1118H9C9.19891 15.1118 9.38968 15.0328 9.53033 14.8921C9.67098 14.7515 9.75 14.5607 9.75 14.3618C9.75 14.1629 9.67098 13.9721 9.53033 13.8315C9.38968 13.6908 9.19891 13.6118 9 13.6118H5.25C5.05109 13.6118 4.86032 13.6908 4.71967 13.8315C4.57902 13.9721 4.5 14.1629 4.5 14.3618C4.5 14.5607 4.57902 14.7515 4.71967 14.8921C4.86032 15.0328 5.05109 15.1118 5.25 15.1118Z" fill="#969BA0"/>
|
||||||
|
<path d="M12 16.6118H5.25C5.05109 16.6118 4.86032 16.6908 4.71967 16.8315C4.57902 16.9721 4.5 17.1629 4.5 17.3618C4.5 17.5607 4.57902 17.7515 4.71967 17.8921C4.86032 18.0328 5.05109 18.1118 5.25 18.1118H12C12.1989 18.1118 12.3897 18.0328 12.5303 17.8921C12.671 17.7515 12.75 17.5607 12.75 17.3618C12.75 17.1629 12.671 16.9721 12.5303 16.8315C12.3897 16.6908 12.1989 16.6118 12 16.6118Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.9 KiB |
3
public/assets/sidebar/notificationsIcon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M22 15.076V12.6826C21.9975 10.8306 21.3044 9.04597 20.0561 7.67779C18.8078 6.30962 17.0941 5.45622 15.25 5.28446V3.75001C15.25 3.5511 15.171 3.36033 15.0303 3.21967C14.8897 3.07902 14.6989 3 14.5 3C14.3011 3 14.1103 3.07902 13.9697 3.21967C13.829 3.36033 13.75 3.5511 13.75 3.75001V5.28461C11.9059 5.45637 10.1923 6.30974 8.94395 7.67789C7.69565 9.04603 7.00249 10.8306 7 12.6826V15.0758C6.15363 15.2498 5.39311 15.7102 4.84663 16.3796C4.30016 17.0489 4.00115 17.8861 4 18.7502C4.00066 19.3468 4.23792 19.9187 4.65973 20.3405C5.08155 20.7623 5.65346 20.9996 6.25 21.0002H10.8258C10.9988 21.8471 11.4589 22.6082 12.1284 23.1548C12.7979 23.7014 13.6357 24 14.5 24C15.3643 24 16.2021 23.7014 16.8716 23.1548C17.5411 22.6082 18.0012 21.8471 18.1742 21.0002H22.75C23.3465 20.9996 23.9185 20.7623 24.3403 20.3405C24.7621 19.9187 24.9993 19.3468 25 18.7502C24.9988 17.8862 24.6998 17.0489 24.1533 16.3797C23.6068 15.7104 22.8463 15.2499 22 15.076ZM8.5 12.6826C8.50198 11.1098 9.12765 9.602 10.2398 8.48986C11.3519 7.37771 12.8597 6.75204 14.4325 6.75005H14.5675C16.1403 6.75204 17.6481 7.37771 18.7602 8.48986C19.8723 9.602 20.498 11.1098 20.5 12.6826V15.0002H8.5V12.6826ZM14.5 22.5003C14.0362 22.4988 13.5842 22.3539 13.2061 22.0853C12.828 21.8167 12.5423 21.4377 12.3882 21.0002H16.6118C16.4577 21.4377 16.172 21.8167 15.7939 22.0853C15.4158 22.3539 14.9638 22.4988 14.5 22.5003ZM22.75 19.5002H6.25C6.05112 19.5001 5.86043 19.4211 5.7198 19.2804C5.57918 19.1398 5.50012 18.9491 5.5 18.7502C5.50066 18.1537 5.73792 17.5818 6.15973 17.1599C6.58155 16.7381 7.15346 16.5008 7.75 16.5002H21.25C21.8465 16.5008 22.4185 16.7381 22.8403 17.1599C23.2621 17.5818 23.4993 18.1537 23.5 18.7502C23.4999 18.9491 23.4208 19.1398 23.2802 19.2804C23.1396 19.4211 22.9489 19.5001 22.75 19.5002Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.9 KiB |
5
public/assets/sidebar/saqIcon.svg
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
<svg width="29" height="25" viewBox="0 0 29 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M22.6092 4H6.38886C5.75551 4.00073 5.1483 4.26507 4.70045 4.73503C4.2526 5.20498 4.0007 5.84217 4 6.50678V18.2051C4.0007 18.8697 4.2526 19.5069 4.70045 19.9769C5.1483 20.4468 5.75551 20.7112 6.38886 20.7119C6.60001 20.712 6.80247 20.8001 6.95178 20.9568C7.10108 21.1135 7.18502 21.3259 7.18514 21.5475V23.3288C7.18514 23.6313 7.26338 23.9281 7.41151 24.1876C7.55964 24.4471 7.7721 24.6595 8.02625 24.8023C8.2804 24.945 8.56669 25.0127 8.85461 24.9981C9.14253 24.9834 9.42127 24.8871 9.66112 24.7193L15.1885 20.8523C15.3191 20.7604 15.4729 20.7115 15.6302 20.7119H19.512C20.0337 20.7109 20.5408 20.5315 20.9565 20.2009C21.3723 19.8704 21.674 19.4066 21.8161 18.8799L24.9141 7.17835C25.0119 6.80574 25.0264 6.41449 24.9565 6.03503C24.8866 5.65558 24.7342 5.29817 24.5112 4.99062C24.2882 4.68307 24.0005 4.43368 23.6706 4.26186C23.3407 4.09005 22.9775 4.00043 22.6092 4ZM23.3783 6.73448L20.2818 18.432C20.2339 18.6074 20.1329 18.7617 19.994 18.8715C19.8551 18.9814 19.686 19.0408 19.512 19.0407H15.6302C15.1584 19.0401 14.6972 19.1866 14.3051 19.4618L8.77772 23.3288V21.5475C8.77702 20.8829 8.52511 20.2457 8.07727 19.7757C7.62942 19.3058 7.02221 19.0414 6.38886 19.0407C6.17771 19.0406 5.97524 18.9525 5.82594 18.7958C5.67663 18.6391 5.5927 18.4267 5.59257 18.2051V6.50678C5.5927 6.28521 5.67663 6.07275 5.82594 5.91608C5.97524 5.7594 6.17771 5.67132 6.38886 5.67119H22.6092C22.7323 5.67152 22.8536 5.70164 22.9638 5.75922C23.074 5.8168 23.17 5.90028 23.2444 6.00316C23.3188 6.10604 23.3696 6.22556 23.3928 6.3524C23.4161 6.47924 23.4111 6.61 23.3783 6.73448Z" fill="#969BA0"/>
|
||||||
|
<path d="M8.77772 11.5203H12.7591C12.9703 11.5203 13.1729 11.4323 13.3222 11.2756C13.4715 11.1189 13.5554 10.9063 13.5554 10.6847C13.5554 10.4631 13.4715 10.2506 13.3222 10.0939C13.1729 9.93716 12.9703 9.84912 12.7591 9.84912H8.77772C8.56653 9.84912 8.36399 9.93716 8.21466 10.0939C8.06532 10.2506 7.98143 10.4631 7.98143 10.6847C7.98143 10.9063 8.06532 11.1189 8.21466 11.2756C8.36399 11.4323 8.56653 11.5203 8.77772 11.5203Z" fill="#969BA0"/>
|
||||||
|
<path d="M15.9443 13.1914H8.77772C8.56653 13.1914 8.36399 13.2794 8.21466 13.4361C8.06532 13.5929 7.98143 13.8054 7.98143 14.027C7.98143 14.2486 8.06532 14.4612 8.21466 14.6179C8.36399 14.7746 8.56653 14.8626 8.77772 14.8626H15.9443C16.1555 14.8626 16.358 14.7746 16.5073 14.6179C16.6567 14.4612 16.7406 14.2486 16.7406 14.027C16.7406 13.8054 16.6567 13.5929 16.5073 13.4361C16.358 13.2794 16.1555 13.1914 15.9443 13.1914Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
6
public/assets/sidebar/sectorialInfoIcon.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M21.75 10.6118H16.5V4.61182C16.4993 4.01528 16.2621 3.44336 15.8403 3.02155C15.4185 2.59973 14.8465 2.36247 14.25 2.36182H3.75C3.15346 2.36247 2.58155 2.59973 2.15973 3.02155C1.73792 3.44336 1.50066 4.01528 1.5 4.61182V21.1118C1.50066 21.7084 1.73792 22.2803 2.15973 22.7021C2.58155 23.1239 3.15346 23.3612 3.75 23.3618H18.75C19.7442 23.3606 20.6973 22.9652 21.4004 22.2622C22.1034 21.5592 22.4988 20.606 22.5 19.6118V11.3618C22.5 11.1629 22.421 10.9721 22.2803 10.8315C22.1397 10.6908 21.9489 10.6118 21.75 10.6118ZM3 21.1118V4.61182C3.00018 4.41296 3.07925 4.2223 3.21987 4.08168C3.36048 3.94107 3.55114 3.862 3.75 3.86182H14.25C14.4489 3.862 14.6395 3.94107 14.7801 4.08168C14.9207 4.2223 14.9998 4.41296 15 4.61182V21.8618H3.75C3.55114 21.8616 3.36048 21.7826 3.21987 21.6419C3.07925 21.5013 3.00018 21.3107 3 21.1118ZM21 19.6118C20.9993 20.2084 20.7621 20.7803 20.3403 21.2021C19.9185 21.6239 19.3465 21.8612 18.75 21.8618H16.5V12.1118H21V19.6118Z" fill="#969BA0"/>
|
||||||
|
<path d="M12.3 7.01182L9.72405 8.94322L7.91602 7.73782C7.79279 7.65577 7.64805 7.61199 7.5 7.61199C7.35195 7.61199 7.20721 7.65577 7.08397 7.73782L4.83397 9.23782C4.75104 9.29202 4.67967 9.36211 4.62398 9.44404C4.56829 9.52598 4.52939 9.61814 4.50952 9.71519C4.48965 9.81225 4.4892 9.91228 4.50821 10.0095C4.52721 10.1067 4.5653 10.1992 4.62025 10.2817C4.67521 10.3641 4.74595 10.4348 4.82839 10.4898C4.91084 10.5447 5.00335 10.5828 5.10058 10.6017C5.19782 10.6207 5.29785 10.6202 5.3949 10.6003C5.49195 10.5805 5.5841 10.5415 5.66602 10.4858L7.5 9.26309L9.33398 10.4856C9.46295 10.572 9.61561 10.6161 9.77078 10.6119C9.92596 10.6076 10.076 10.5552 10.2 10.4618L13.2 8.21182C13.2788 8.15272 13.3452 8.07869 13.3954 7.99394C13.4455 7.90919 13.4785 7.81538 13.4925 7.71788C13.5064 7.62038 13.501 7.52109 13.4765 7.42568C13.4521 7.33027 13.4091 7.24061 13.35 7.16182C13.2909 7.08302 13.2169 7.01664 13.1321 6.96646C13.0474 6.91628 12.9536 6.88328 12.8561 6.86935C12.7586 6.85543 12.6593 6.86084 12.5639 6.88528C12.4685 6.90972 12.3788 6.95272 12.3 7.01182Z" fill="#969BA0"/>
|
||||||
|
<path d="M5.25 15.1118H9C9.19891 15.1118 9.38968 15.0328 9.53033 14.8921C9.67098 14.7515 9.75 14.5607 9.75 14.3618C9.75 14.1629 9.67098 13.9721 9.53033 13.8315C9.38968 13.6908 9.19891 13.6118 9 13.6118H5.25C5.05109 13.6118 4.86032 13.6908 4.71967 13.8315C4.57902 13.9721 4.5 14.1629 4.5 14.3618C4.5 14.5607 4.57902 14.7515 4.71967 14.8921C4.86032 15.0328 5.05109 15.1118 5.25 15.1118Z" fill="#969BA0"/>
|
||||||
|
<path d="M12 16.6118H5.25C5.05109 16.6118 4.86032 16.6908 4.71967 16.8315C4.57902 16.9721 4.5 17.1629 4.5 17.3618C4.5 17.5607 4.57902 17.7515 4.71967 17.8921C4.86032 18.0328 5.05109 18.1118 5.25 18.1118H12C12.1989 18.1118 12.3897 18.0328 12.5303 17.8921C12.671 17.7515 12.75 17.5607 12.75 17.3618C12.75 17.1629 12.671 16.9721 12.5303 16.8315C12.3897 16.6908 12.1989 16.6118 12 16.6118Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.9 KiB |
3
public/assets/sidebar/summaryOperationsIcon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M15.375 5.23013L12.375 3.49831C12.261 3.43248 12.1317 3.39783 12 3.39783C11.8683 3.39783 11.739 3.43248 11.625 3.49831L8.625 5.23013C8.51101 5.29594 8.41635 5.3906 8.35052 5.50458C8.2847 5.61856 8.25003 5.74786 8.25 5.87948V8.93445L5.32913 14.7762C5.30706 14.8305 5.29167 14.8872 5.2833 14.9452L2.625 16.4801C2.51101 16.5459 2.41635 16.6406 2.35052 16.7546C2.2847 16.8686 2.25003 16.9978 2.25 17.1295V20.5945C2.24998 20.7261 2.28462 20.8555 2.35045 20.9695C2.41628 21.0836 2.51097 21.1783 2.625 21.2441L5.625 22.9759C5.73904 23.0417 5.86836 23.0763 6 23.0763C6.13164 23.0763 6.26096 23.0417 6.375 22.9759L9.375 21.2441C9.48903 21.1783 9.58372 21.0836 9.64955 20.9695C9.71538 20.8555 9.75002 20.7261 9.75 20.5945V19.612H14.25V20.5945C14.25 20.7261 14.2846 20.8555 14.3504 20.9695C14.4163 21.0836 14.511 21.1783 14.625 21.2441L17.625 22.9759C17.739 23.0417 17.8684 23.0763 18 23.0763C18.1316 23.0763 18.261 23.0417 18.375 22.9759L21.375 21.2441C21.489 21.1783 21.5837 21.0836 21.6496 20.9695C21.7154 20.8555 21.75 20.7261 21.75 20.5945V17.1295C21.75 16.9978 21.7154 16.8684 21.6496 16.7544C21.5837 16.6404 21.489 16.5457 21.375 16.4798L18.7167 14.9452C18.7083 14.8872 18.6929 14.8305 18.6709 14.7762L15.75 8.93475V5.87948C15.75 5.74786 15.7153 5.61856 15.6495 5.50458C15.5837 5.3906 15.489 5.29594 15.375 5.23013ZM9.75 6.31306L12 5.01406L14.25 6.31306V8.9109L12 10.2099L9.75 8.9109V6.31306ZM8.25 20.1609L6 21.4599L3.75 20.1609V17.563L6 16.264L8.25 17.563V20.1609ZM9.75 18.112V17.1295C9.75002 16.9978 9.71538 16.8684 9.64955 16.7544C9.58372 16.6404 9.48903 16.5457 9.375 16.4798L6.87585 15.0374L9.225 10.34L11.625 11.7257C11.739 11.7914 11.8684 11.826 12 11.826C12.1316 11.826 12.261 11.7914 12.375 11.7257L14.7754 10.34L17.1241 15.0374L14.625 16.4801C14.511 16.546 14.4163 16.6407 14.3504 16.7547C14.2846 16.8687 14.25 16.9981 14.25 17.1298V18.112H9.75ZM20.25 20.1609L18 21.4599L15.75 20.1609V17.563L18 16.264L20.25 17.563V20.1609Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.0 KiB |
6
public/assets/sidebar/telemetryIcon.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M21.75 9.75H16.5V3.75C16.4993 3.15346 16.2621 2.58155 15.8403 2.15973C15.4185 1.73792 14.8465 1.50066 14.25 1.5H3.75C3.15346 1.50066 2.58155 1.73792 2.15973 2.15973C1.73792 2.58155 1.50066 3.15346 1.5 3.75V20.25C1.50066 20.8465 1.73792 21.4185 2.15973 21.8403C2.58155 22.2621 3.15346 22.4993 3.75 22.5H18.75C19.7442 22.4988 20.6973 22.1034 21.4004 21.4004C22.1034 20.6973 22.4988 19.7442 22.5 18.75V10.5C22.5 10.3011 22.421 10.1103 22.2803 9.96967C22.1397 9.82902 21.9489 9.75 21.75 9.75ZM3 20.25V3.75C3.00018 3.55114 3.07925 3.36048 3.21987 3.21987C3.36048 3.07925 3.55114 3.00018 3.75 3H14.25C14.4489 3.00018 14.6395 3.07925 14.7801 3.21987C14.9207 3.36048 14.9998 3.55114 15 3.75V21H3.75C3.55114 20.9998 3.36048 20.9207 3.21987 20.7801C3.07925 20.6395 3.00018 20.4489 3 20.25ZM21 18.75C20.9993 19.3465 20.7621 19.9185 20.3403 20.3403C19.9185 20.7621 19.3465 20.9993 18.75 21H16.5V11.25H21V18.75Z" fill="#969BA0"/>
|
||||||
|
<path d="M12.3 6.15L9.72405 8.0814L7.91602 6.876C7.79279 6.79395 7.64805 6.75017 7.5 6.75017C7.35195 6.75017 7.20721 6.79395 7.08397 6.876L4.83397 8.376C4.75104 8.4302 4.67967 8.50029 4.62398 8.58223C4.56829 8.66416 4.52939 8.75632 4.50952 8.85338C4.48965 8.95043 4.4892 9.05047 4.50821 9.14769C4.52721 9.24492 4.5653 9.33742 4.62025 9.41985C4.67521 9.50228 4.74595 9.57301 4.82839 9.62794C4.91084 9.68288 5.00335 9.72094 5.10058 9.73992C5.19782 9.7589 5.29785 9.75843 5.3949 9.73853C5.49195 9.71864 5.5841 9.67971 5.66602 9.624L7.5 8.40127L9.33398 9.62378C9.46295 9.71017 9.61561 9.7543 9.77078 9.75004C9.92596 9.74578 10.076 9.69334 10.2 9.6L13.2 7.35C13.2788 7.29091 13.3452 7.21687 13.3954 7.13212C13.4455 7.04737 13.4785 6.95357 13.4925 6.85607C13.5064 6.75856 13.501 6.65927 13.4765 6.56386C13.4521 6.46845 13.4091 6.37879 13.35 6.3C13.2909 6.22121 13.2169 6.15482 13.1321 6.10464C13.0474 6.05446 12.9536 6.02147 12.8561 6.00754C12.7586 5.99361 12.6593 5.99902 12.5639 6.02346C12.4685 6.04791 12.3788 6.0909 12.3 6.15Z" fill="#969BA0"/>
|
||||||
|
<path d="M5.25 14.25H9C9.19891 14.25 9.38968 14.171 9.53033 14.0303C9.67098 13.8897 9.75 13.6989 9.75 13.5C9.75 13.3011 9.67098 13.1103 9.53033 12.9697C9.38968 12.829 9.19891 12.75 9 12.75H5.25C5.05109 12.75 4.86032 12.829 4.71967 12.9697C4.57902 13.1103 4.5 13.3011 4.5 13.5C4.5 13.6989 4.57902 13.8897 4.71967 14.0303C4.86032 14.171 5.05109 14.25 5.25 14.25Z" fill="#969BA0"/>
|
||||||
|
<path d="M12 15.75H5.25C5.05109 15.75 4.86032 15.829 4.71967 15.9697C4.57902 16.1103 4.5 16.3011 4.5 16.5C4.5 16.6989 4.57902 16.8897 4.71967 17.0303C4.86032 17.171 5.05109 17.25 5.25 17.25H12C12.1989 17.25 12.3897 17.171 12.5303 17.0303C12.671 16.8897 12.75 16.6989 12.75 16.5C12.75 16.3011 12.671 16.1103 12.5303 15.9697C12.3897 15.829 12.1989 15.75 12 15.75Z" fill="#969BA0"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.8 KiB |
BIN
public/assets/stamps/blueStamp.png
Normal file
|
After Width: | Height: | Size: 173 KiB |
BIN
public/assets/stamps/whiteStamp.png
Normal file
|
After Width: | Height: | Size: 196 KiB |
|
Before Width: | Height: | Size: 53 KiB After Width: | Height: | Size: 53 KiB |
@ -2,6 +2,10 @@ import styled from 'styled-components'
|
|||||||
|
|
||||||
export const BannerView = styled.div`
|
export const BannerView = styled.div`
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 19rem;
|
height: 19rem;
|
||||||
|
|
||||||
@ -18,13 +22,31 @@ export const BannerView = styled.div`
|
|||||||
|
|
||||||
.text {
|
.text {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 82px 0 0 20px;
|
margin: 0 0 0 20px;
|
||||||
|
|
||||||
font-family: 'Poppins';
|
font-family: 'Poppins';
|
||||||
|
font-size:19px;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
|
|
||||||
color: white;
|
color: white;
|
||||||
|
padding-top:45px;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1008px) {
|
||||||
|
font-size: 170%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
`
|
`
|
||||||
|
|||||||
@ -7,13 +7,13 @@ export const BasicButtonView = styled.button`
|
|||||||
|
|
||||||
width: 120px;
|
width: 120px;
|
||||||
height: 45px;
|
height: 45px;
|
||||||
|
cursor: pointer;
|
||||||
background: #254F7F;
|
background: #254F7F;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
border-style: none;
|
border-style: none;
|
||||||
|
|
||||||
font-family: 'Poppins';
|
font-family: 'Poppins';
|
||||||
font-size: 16px;
|
font-size: 90%;
|
||||||
/* identical to box height */
|
/* identical to box height */
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
19
src/components/buttons/gradientButton/GradientButton.tsx
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import { GradientButtonView } from './GradientButtonView'
|
||||||
|
|
||||||
|
interface GradientButtonInterface {
|
||||||
|
title: string,
|
||||||
|
description: string
|
||||||
|
orange?: undefined | null | boolean,
|
||||||
|
purple?: undefined | null | boolean,
|
||||||
|
green?: undefined | null | boolean
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function GradientButton({ title, description, orange, purple, green }: GradientButtonInterface) {
|
||||||
|
return (
|
||||||
|
<GradientButtonView color={orange? 'orange' : purple? 'purple' : green? 'green' : 'orange' } >
|
||||||
|
<p>{title}</p>
|
||||||
|
<p>{description}</p>
|
||||||
|
</GradientButtonView>
|
||||||
|
)
|
||||||
|
}
|
||||||
58
src/components/buttons/gradientButton/GradientButtonView.ts
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
import styled from "styled-components";
|
||||||
|
|
||||||
|
export const GradientButtonView = styled.button`
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
flex-direction: column;
|
||||||
|
border-radius: 2px;
|
||||||
|
|
||||||
|
width: 25%;
|
||||||
|
height: 110px;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
|
||||||
|
font-family: 'Poppins';
|
||||||
|
font-size: 10px;
|
||||||
|
|
||||||
|
color: #FFFFFF;
|
||||||
|
|
||||||
|
background: ${ props => props.color==='orange'?
|
||||||
|
'linear-gradient(200.86deg, #F48665 8.03%, #F48665 91.97%), #FFFFFF'
|
||||||
|
:
|
||||||
|
props.color === 'purple'?
|
||||||
|
'linear-gradient(200.69deg, #9A56FF 8.53%, #D78AFD 91.47%), #FFFFFF'
|
||||||
|
:
|
||||||
|
'linear-gradient(200.69deg, #23BDB8 8.53%, #43E794 91.47%), #FFFFFF'
|
||||||
|
};
|
||||||
|
|
||||||
|
box-shadow: 0.5px 3px 10px rgba(119, 119, 119, 0.1);
|
||||||
|
|
||||||
|
border-style: none;
|
||||||
|
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
:first-child {
|
||||||
|
font-family: 'Poppins';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: calc(20px);
|
||||||
|
|
||||||
|
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
|
||||||
|
}
|
||||||
|
:last-child {
|
||||||
|
font-family: 'Poppins';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 12;
|
||||||
|
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
23
src/components/faqQuestionsCard/FaqQuestionsCard.tsx
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
import React, { useState } from 'react'
|
||||||
|
import Image from 'next/image'
|
||||||
|
|
||||||
|
import { FaqQuestionsCardBody, FaqQuestionsCardHeader, CommonQuestionsCardView } from './FaqQuestionsCardView'
|
||||||
|
|
||||||
|
export default function CommonsQuestionsCard() {
|
||||||
|
const [ showCardBody, setShowCardBody ] = useState<boolean>(false)
|
||||||
|
return (
|
||||||
|
<CommonQuestionsCardView>
|
||||||
|
<FaqQuestionsCardHeader>
|
||||||
|
<h4>Lorem ipsum dolor sit amet, consectetur adipiscing elit?</h4>
|
||||||
|
<Image src={showCardBody? '/assets/less-icon.svg' : '/assets/plus-icon.svg' } width={32} height={32} onClick={() => setShowCardBody(!showCardBody)} />
|
||||||
|
</FaqQuestionsCardHeader>
|
||||||
|
|
||||||
|
<FaqQuestionsCardBody showCardBody={showCardBody} >
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||||
|
Consequat porta faucibus elementum pharetra varius
|
||||||
|
</p>
|
||||||
|
</FaqQuestionsCardBody>
|
||||||
|
</CommonQuestionsCardView>
|
||||||
|
)
|
||||||
|
}
|
||||||
45
src/components/faqQuestionsCard/FaqQuestionsCardView.ts
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
import styled from "styled-components";
|
||||||
|
|
||||||
|
export const CommonQuestionsCardView = styled.article`
|
||||||
|
`
|
||||||
|
|
||||||
|
export const FaqQuestionsCardHeader = styled.div`
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
flex-direction: row;
|
||||||
|
|
||||||
|
margin-top: 53px;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
img {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
interface CardBodyInterface {
|
||||||
|
showCardBody: boolean;
|
||||||
|
}
|
||||||
|
export const FaqQuestionsCardBody = styled.div<CardBodyInterface>`
|
||||||
|
display: ${props => props.showCardBody? 'flex' : 'none'};
|
||||||
|
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 99%;
|
||||||
|
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
|
||||||
|
color: rgba(0, 0, 0, 0.6);
|
||||||
|
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1008px) {
|
||||||
|
p {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
@ -1,5 +1,5 @@
|
|||||||
import styled from "styled-components"
|
import styled from "styled-components"
|
||||||
|
|
||||||
export const ChartView = styled.div`
|
export const ChartView = styled.div`
|
||||||
width: 100%;
|
width: 80%;
|
||||||
`
|
`
|
||||||
|
|||||||
@ -5,6 +5,7 @@ import ToggleButton from '@mui/material/ToggleButton';
|
|||||||
import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
|
import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
|
||||||
|
|
||||||
import { ChartCardView } from './ChartCardView';
|
import { ChartCardView } from './ChartCardView';
|
||||||
|
import Chart from '../Chart';
|
||||||
|
|
||||||
interface ChartCardInterface {
|
interface ChartCardInterface {
|
||||||
title: string,
|
title: string,
|
||||||
@ -28,7 +29,7 @@ export default function ChartCard({ title, subtitle, consumption, className }: C
|
|||||||
<div className='content' >
|
<div className='content' >
|
||||||
<div className='header'>
|
<div className='header'>
|
||||||
<div>
|
<div>
|
||||||
<h4>{title}</h4>
|
<h2>{title}</h2>
|
||||||
<span>{subtitle}</span>
|
<span>{subtitle}</span>
|
||||||
</div>
|
</div>
|
||||||
<ToggleButtonGroup
|
<ToggleButtonGroup
|
||||||
@ -63,7 +64,7 @@ export default function ChartCard({ title, subtitle, consumption, className }: C
|
|||||||
<></>
|
<></>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
<div className='graph' />
|
<Chart title='' />
|
||||||
</ChartCardView>
|
</ChartCardView>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -53,7 +53,7 @@ export default function Header({ name }: headerInterface) {
|
|||||||
/>
|
/>
|
||||||
</section>
|
</section>
|
||||||
<section>
|
<section>
|
||||||
<Image src='/copel.svg' width={150} height={150} />
|
<Image src='/assets/png/copel.png' width={170} height={50} />
|
||||||
<div className='icon' >
|
<div className='icon' >
|
||||||
olá, {'josé'}
|
olá, {'josé'}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -2,23 +2,22 @@ import styled from "styled-components";
|
|||||||
|
|
||||||
export const HeaderView = styled.header`
|
export const HeaderView = styled.header`
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
||||||
flex-direction: row;
|
margin: 0 0 75px 0;
|
||||||
|
|
||||||
height: 10rem;
|
width: 100%;
|
||||||
|
|
||||||
section {
|
section {
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
:first-child {
|
|
||||||
width: 30%;
|
width: 30%;
|
||||||
|
|
||||||
|
|
||||||
|
:last-child {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
height: fit-content;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -30,7 +29,7 @@ export const HeaderView = styled.header`
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
width: 150px;
|
width: 150px;
|
||||||
height: 43px;
|
height: 40px;
|
||||||
|
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
|
|
||||||
@ -42,11 +41,20 @@ export const HeaderView = styled.header`
|
|||||||
::after {
|
::after {
|
||||||
content: "";
|
content: "";
|
||||||
position: relative;
|
position: relative;
|
||||||
left: 40px;
|
left: 2.5rem;
|
||||||
background-color: #FFF;
|
background-color: #fff;
|
||||||
width: 45px;
|
width: 45px;
|
||||||
height: 45px;
|
height: 45px;
|
||||||
border-radius: 100%;
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1020px) {
|
||||||
|
.icon {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
section {
|
||||||
|
width: 50%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|||||||
@ -5,7 +5,7 @@ import { MapCardView } from './style'
|
|||||||
interface MapCardInterface {
|
interface MapCardInterface {
|
||||||
title: string,
|
title: string,
|
||||||
subtitle: string,
|
subtitle: string,
|
||||||
statistic: string,
|
statistic?: string,
|
||||||
imgSource: string,
|
imgSource: string,
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -18,8 +18,15 @@ export default function MapCard({ title, subtitle, statistic, imgSource }: MapCa
|
|||||||
<h4>{title}</h4>
|
<h4>{title}</h4>
|
||||||
<span>{subtitle}</span>
|
<span>{subtitle}</span>
|
||||||
<article>
|
<article>
|
||||||
|
{
|
||||||
|
statistic?
|
||||||
|
<>
|
||||||
<Image src="/graphLineIcon.svg" width={20} height={20} />
|
<Image src="/graphLineIcon.svg" width={20} height={20} />
|
||||||
<p>{statistic}</p>
|
<p>{statistic}</p>
|
||||||
|
</>
|
||||||
|
:
|
||||||
|
null
|
||||||
|
}
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</MapCardView>
|
</MapCardView>
|
||||||
|
|||||||
@ -9,6 +9,11 @@ export const MapCardView = styled.figure`
|
|||||||
|
|
||||||
margin-right: 25px;
|
margin-right: 25px;
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
margin-bottom: 25px;
|
margin-bottom: 25px;
|
||||||
}
|
}
|
||||||
|
|||||||
16
src/components/pageTitle/PageTitle.tsx
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import { PageTitleView } from './PageTitleView'
|
||||||
|
|
||||||
|
interface PageTitleInterface {
|
||||||
|
title: string,
|
||||||
|
subtitle: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function PageTitle({ title, subtitle }: PageTitleInterface) {
|
||||||
|
return (
|
||||||
|
<PageTitleView>
|
||||||
|
<h1>{title}</h1>
|
||||||
|
<p>{subtitle}</p>
|
||||||
|
</PageTitleView>
|
||||||
|
)
|
||||||
|
}
|
||||||
27
src/components/pageTitle/PageTitleView.ts
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
import styled from "styled-components";
|
||||||
|
|
||||||
|
export const PageTitleView = styled.div`
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
font-family: 'Poppins';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 99%;
|
||||||
|
line-height: 27px;
|
||||||
|
|
||||||
|
color: #969BA0;
|
||||||
|
}
|
||||||
|
`
|
||||||
@ -1,9 +1,9 @@
|
|||||||
import React, { useState } from 'react'
|
import React, { useState, useEffect } from 'react'
|
||||||
import Image from 'next/image'
|
|
||||||
import { useRouter } from 'next/router'
|
import { useRouter } from 'next/router'
|
||||||
|
import Image from 'next/image'
|
||||||
|
import Link from 'next/link'
|
||||||
|
|
||||||
import { SidebarView } from './SidebarView'
|
import { SidebarView } from './SidebarView'
|
||||||
import Link from 'next/link'
|
|
||||||
|
|
||||||
export default function Sidebar() {
|
export default function Sidebar() {
|
||||||
const [ economiaDrawer, setEconomiaDrawer ] = useState(false)
|
const [ economiaDrawer, setEconomiaDrawer ] = useState(false)
|
||||||
@ -12,33 +12,35 @@ export default function Sidebar() {
|
|||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
console.log(router.pathname)
|
useEffect(() => {
|
||||||
|
setViewModal(false)
|
||||||
|
}, [router.pathname])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SidebarView economiaDrawer={economiaDrawer} modalOpen={viewModal} >
|
<SidebarView economiaDrawer={economiaDrawer} modalOpen={viewModal} >
|
||||||
<div className='hamburger' onClick={() => setViewModal(!viewModal)} >
|
<div className='hamburger' onClick={() => setViewModal(!viewModal)} >
|
||||||
<Image src='/assets/hamburgerModal.svg' width={25} height={25} />
|
<Image src='/assets/hamburgerModal.svg' width={60} height={60} />
|
||||||
</div>
|
</div>
|
||||||
<div className='imageNext'>
|
<div className='imageNext'>
|
||||||
<Image src='/assets/logo.svg' width={100} height={100} />
|
<Image src='/assets/logo.svg' width={100} height={100} />
|
||||||
</div>
|
</div>
|
||||||
<ul>
|
<ul>
|
||||||
<Link href='/dashboard'><li className={router.pathname=='/dashboard'? 'actualPath' : null} >{'Visão Geral'}</li></Link>
|
<Link href='/dashboard'><li className={router.pathname=='/dashboard'? 'actualPath' : null} ><Image src='/assets/sidebar/dashboardIcon.svg' width={25} height={25} />{'Visão Geral'}</li></Link>
|
||||||
<Link href='/consumption'><li className={router.pathname=='/consumption'? 'actualPath' : null} >{'Consumo'}</li></Link>
|
<Link href='/consumption'><li className={router.pathname=='/consumption'? 'actualPath' : null} ><Image src='/assets/sidebar/consumptionIcon.svg' width={25} height={25} />{'Consumo'}</li></Link>
|
||||||
<Link href='/resumoOperacao'><li className={router.pathname=='/resumoOperacao'? 'actualPath' : null} >{'Resumo de Op. '}</li></Link>
|
<Link href='/resumoOperacao'><li className={router.pathname=='/resumoOperacao'? 'actualPath' : null} ><Image src='/assets/sidebar/summaryOperationsIcon.svg' width={25} height={25} />{'Resumo de Op. '}</li></Link>
|
||||||
<li onClick={() => setEconomiaDrawer(!economiaDrawer)} className={router.pathname=='/grossSavings' || router.pathname=='/accumulatedSavings' || router.pathname=='/estimatedCost' || router.pathname=='/costIndicator' ? 'actualPath' : null } >{'Economia >'}</li>
|
<li onClick={() => setEconomiaDrawer(!economiaDrawer)} className={router.pathname=='/grossSavings' || router.pathname=='/accumulatedSavings' || router.pathname=='/estimatedCost' || router.pathname=='/costIndicator' ? 'actualPath' : null } ><Image src='/assets/sidebar/economyIcon.svg' width={25} height={25} />{'Economia'}</li>
|
||||||
<div className='economiaDrawer drawer' >
|
<div className='economiaDrawer drawer' >
|
||||||
<Link href='/grossSavings'><li>Economia Bruta</li></Link>
|
<Link href='/grossSavings'><li>Economia Bruta</li></Link>
|
||||||
<Link href='/accumulatedSavings'><li>Economia Acumulada</li></Link>
|
<Link href='/accumulatedSavings'><li>Economia Acumulada</li></Link>
|
||||||
<Link href='/estimatedCost'><li>Custo Estimado</li></Link>
|
<Link href='/estimatedCost'><li>Custo Estimado</li></Link>
|
||||||
<Link href='/costIndicator'><li>Custo R/MWh</li></Link>
|
<Link href='/costIndicator'><li>Custo R/MWh</li></Link>
|
||||||
</div>
|
</div>
|
||||||
<Link href='#'><li className={router.pathname=='/news'? 'actualPath' : null}>{'Notícias >'}</li></Link>
|
<Link href='#'><li className={router.pathname=='/news'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'Notícias >'}</li></Link>
|
||||||
<Link href='#'><li className={router.pathname=='/sectorialInfo'? 'actualPath' : null}>{'Info Setorial >'}</li></Link>
|
<Link href='#'><li className={router.pathname=='/sectorialInfo'? 'actualPath' : null}><Image src='/assets/sidebar/sectorialInfoIcon.svg' width={25} height={25} />{'Info Setorial >'}</li></Link>
|
||||||
<Link href='#'><li className={router.pathname=='/saq'? 'actualPath' : null}>{'SAQ >'}</li></Link>
|
<Link href='/faq'><li className={router.pathname=='/faq'? 'actualPath' : null}><Image src='/assets/sidebar/saqIcon.svg' width={25} height={25} />{'FAQ >'}</li></Link>
|
||||||
<Link href='#'><li className={router.pathname=='/aboutus'? 'actualPath' : null}>{'Sobre Nós >'}</li></Link>
|
<Link href='/aboutUs'><li className={router.pathname=='/aboutUs'? 'actualPath' : null}><Image src='/assets/sidebar/dashboardIcon.svg' width={25} height={25} />{'Sobre Nós >'}</li></Link>
|
||||||
<Link href='#'><li className={router.pathname=='/notification'? 'actualPath' : null}>{'Notificação >'}</li></Link>
|
<Link href='#'><li className={router.pathname=='/notification'? 'actualPath' : null}><Image src='/assets/sidebar/notificationsIcon.svg' width={25} height={25} />{'Notificação >'}</li></Link>
|
||||||
<Link href='#'><li className={router.pathname=='/telemetry'? 'actualPath' : null}>{'Telemetria >'}</li></Link>
|
<Link href='/telemetria'><li className={router.pathname=='/telemetry'? 'actualPath' : null}><Image src='/assets/sidebar/telemetryIcon.svg' width={25} height={25} />{'Telemetria >'}</li></Link>
|
||||||
</ul>
|
</ul>
|
||||||
<aside>
|
<aside>
|
||||||
<p>Nossos Gerentes estão prontos para atendê-los</p>
|
<p>Nossos Gerentes estão prontos para atendê-los</p>
|
||||||
|
|||||||
@ -15,6 +15,7 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
width: 20%;
|
width: 20%;
|
||||||
|
min-width: 15rem;
|
||||||
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
@ -26,6 +27,8 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
|
|||||||
.actualPath {
|
.actualPath {
|
||||||
border-left: #254F7F solid 8px;
|
border-left: #254F7F solid 8px;
|
||||||
background-color: #FAFBFF;
|
background-color: #FAFBFF;
|
||||||
|
|
||||||
|
color: #254F7F;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
@ -49,19 +52,17 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
|
|
||||||
|
gap: 15px;
|
||||||
|
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 16px;
|
|
||||||
line-height: 27px;
|
line-height: 27px;
|
||||||
/* identical to box height */
|
|
||||||
|
|
||||||
color: #969BA0;
|
color: #969BA0;
|
||||||
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
padding-left: 40px;
|
padding-left: 40px;
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.economiaDrawer {
|
.economiaDrawer {
|
||||||
@ -121,7 +122,7 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1196px) {
|
@media (max-width: 1008px) {
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -140,15 +141,22 @@ export const SidebarView = styled.nav<SidebarViewInterface>`
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
|
|
||||||
|
height: 5rem;
|
||||||
}
|
}
|
||||||
.imageNext {
|
.imageNext {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
ul {
|
ul {
|
||||||
display: ${props => props.modalOpen? 'block' : 'none'};
|
display: ${props => props.modalOpen? 'block' : 'none'};
|
||||||
min-height: 100vh;
|
min-height: 85vh;
|
||||||
|
|
||||||
background-color: #FFF;
|
background-color: #FFF;
|
||||||
|
|
||||||
|
li {
|
||||||
|
height: 7rem;
|
||||||
|
font-size: 170%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
aside {
|
aside {
|
||||||
display: none;
|
display: none;
|
||||||
|
|||||||
@ -3,10 +3,10 @@ import styled from 'styled-components'
|
|||||||
export const AppView = styled.main`
|
export const AppView = styled.main`
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
margin: 0;
|
margin: 0 0 10rem 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
||||||
@media (max-width: 1196px) {
|
@media (max-width: 1008px) {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,11 +1,6 @@
|
|||||||
import styled from 'styled-components'
|
import styled from 'styled-components'
|
||||||
|
|
||||||
export const DashboardView = styled.main`
|
export const DashboardView = styled.main`
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
@ -16,38 +11,6 @@ export const DashboardView = styled.main`
|
|||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
span {
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h4 {
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 21px;
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 28px;
|
|
||||||
line-height: 42px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cardsSection {
|
.cardsSection {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
|
|||||||
@ -76,11 +76,11 @@ export const TableView = styled.div`
|
|||||||
vertical-align:top
|
vertical-align:top
|
||||||
}
|
}
|
||||||
|
|
||||||
h1{
|
/* h1{
|
||||||
color: #000;
|
color: #000;
|
||||||
font-family: Poppins;
|
font-family: Poppins;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
}
|
} */
|
||||||
/* .tg td{
|
/* .tg td{
|
||||||
border-color:black;
|
border-color:black;
|
||||||
border-style:solid;
|
border-style:solid;
|
||||||
@ -117,7 +117,7 @@ h1{
|
|||||||
text-align:center;
|
text-align:center;
|
||||||
vertical-align:top
|
vertical-align:top
|
||||||
}
|
}
|
||||||
|
/*
|
||||||
h1{
|
h1{
|
||||||
color: #000;
|
color: #000;
|
||||||
font-family: Poppins;
|
font-family: Poppins;
|
||||||
@ -129,14 +129,15 @@ h1{
|
|||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
margin-top: 1px;
|
margin-top: 1px;
|
||||||
}
|
}*/
|
||||||
|
|
||||||
|
|
||||||
h3{
|
h3{
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 22px;
|
||||||
|
line-height: 54px;
|
||||||
|
|
||||||
color: #254F7F;
|
color: #254F7F;
|
||||||
font-family: Poppins;
|
|
||||||
font-size: 15px;
|
|
||||||
margin-top: 5rem;
|
|
||||||
}
|
}
|
||||||
p{
|
p{
|
||||||
margin-top: 4rem;
|
margin-top: 4rem;
|
||||||
|
|||||||
@ -6,6 +6,28 @@ export const TelemetriaView = styled.main`
|
|||||||
padding: 20px ;
|
padding: 20px ;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
|
.title{
|
||||||
|
color: black;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
span{
|
||||||
|
font-family: 'Inter';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 24px;
|
||||||
|
color: #667085;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleMenuItem{
|
||||||
|
color: #667085;
|
||||||
|
font-family: Inter;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
`;
|
`;
|
||||||
@ -14,12 +36,12 @@ export const Buttons = styled.div`
|
|||||||
display: flex;
|
display: flex;
|
||||||
min-width: 10rem;
|
min-width: 10rem;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
margin-top: 8rem;
|
margin-top: 5rem;
|
||||||
|
padding: 1px 60px;
|
||||||
justify-content: space-around;
|
justify-content: space-around;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
|
||||||
height: 6rem;
|
height: 6rem;
|
||||||
/* flex-direction: column; */
|
|
||||||
/*
|
/*
|
||||||
.btnSucess{
|
.btnSucess{
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
@ -28,7 +50,7 @@ export const Buttons = styled.div`
|
|||||||
border: none;
|
border: none;
|
||||||
} */
|
} */
|
||||||
|
|
||||||
.btnGrafico {
|
/* .btnGrafico {
|
||||||
box-shadow:inset 0px 34px 0px -15px #F48665;
|
box-shadow:inset 0px 34px 0px -15px #F48665;
|
||||||
background-color:#F48665;
|
background-color:#F48665;
|
||||||
border:none;
|
border:none;
|
||||||
@ -45,7 +67,14 @@ export const Buttons = styled.div`
|
|||||||
text-shadow:0px -1px 0px #7a2a1d;
|
text-shadow:0px -1px 0px #7a2a1d;
|
||||||
|
|
||||||
}
|
}
|
||||||
p{
|
.btnTitle{
|
||||||
|
font-size: 15px;
|
||||||
|
margin-bottom: 1px;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.title{
|
||||||
font-size:20px;
|
font-size:20px;
|
||||||
}
|
}
|
||||||
.myButton:hover {
|
.myButton:hover {
|
||||||
@ -82,7 +111,7 @@ p{
|
|||||||
.myButton:active {
|
.myButton:active {
|
||||||
position:relative;
|
position:relative;
|
||||||
/* justify-content: space-between; */
|
/* justify-content: space-between; */
|
||||||
top:1px;
|
/* top:1px;
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -91,8 +120,8 @@ p{
|
|||||||
box-shadow:inset 100% #23BDB8;
|
box-shadow:inset 100% #23BDB8;
|
||||||
background-color:#23BDB8;
|
background-color:#23BDB8;
|
||||||
border:none;
|
border:none;
|
||||||
border-radius: 2px;
|
border-radius: 2px; */
|
||||||
display:inline-block;
|
/* display:inline-block;
|
||||||
width: 17rem;
|
width: 17rem;
|
||||||
cursor:pointer;
|
cursor:pointer;
|
||||||
color:#ffffff;
|
color:#ffffff;
|
||||||
@ -112,9 +141,9 @@ p{
|
|||||||
}
|
}
|
||||||
.myButton:active {
|
.myButton:active {
|
||||||
position:relative;
|
position:relative;
|
||||||
/* justify-content: space-between; */
|
justify-content: space-between;
|
||||||
top:1px;
|
top:1px;
|
||||||
}
|
} */
|
||||||
|
|
||||||
|
|
||||||
`;
|
`;
|
||||||
|
|||||||
52
styles/layouts/aboutUs/AboutUsView.ts
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
import styled from "styled-components";
|
||||||
|
|
||||||
|
export const AboutUsView = styled.main`
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-family: 'Poppins';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 300;
|
||||||
|
font-size: 80%;
|
||||||
|
line-height: 26px;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style: none;
|
||||||
|
|
||||||
|
li {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
|
||||||
|
font-size: 98.98%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
section {
|
||||||
|
article {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
aside {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
width: fit-content;
|
||||||
|
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1008px) {
|
||||||
|
li {
|
||||||
|
font-size: 170%!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
36
styles/layouts/commonQuestions/FaqView.ts
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
import styled from "styled-components";
|
||||||
|
|
||||||
|
export const FaqView = styled.main`
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: calc(90% + 2rem);
|
||||||
|
line-height: 72px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 99.98%;
|
||||||
|
line-height: 21px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
|
||||||
|
color: #AAAAAA;
|
||||||
|
}
|
||||||
|
|
||||||
|
.CommonQuestionsSection {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border: 1px solid #DDDDDD;
|
||||||
|
}
|
||||||
|
`
|
||||||
@ -6,21 +6,13 @@ export const ConsumptionView = styled.main`
|
|||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
span {
|
|
||||||
color: #969BA0;
|
|
||||||
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
section {
|
||||||
margin-bottom: 160px;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
canvas {
|
canvas {
|
||||||
max-height: 30rem;
|
margin: 160px 0 0 0
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|||||||
@ -6,21 +6,13 @@ export const AccumulatedSavingsView = styled.main`
|
|||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
span {
|
|
||||||
color: #969BA0;
|
|
||||||
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
section {
|
||||||
margin-bottom: 160px;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
canvas {
|
canvas {
|
||||||
max-height: 30rem;
|
margin: 160px 0 0 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|||||||
@ -6,21 +6,13 @@ export const CostIndicatorView = styled.main`
|
|||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
span {
|
|
||||||
color: #969BA0;
|
|
||||||
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
section {
|
||||||
margin-bottom: 160px;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
canvas {
|
canvas {
|
||||||
max-height: 30rem;
|
margin: 160px 0 0 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|||||||
@ -6,21 +6,13 @@ export const EstimatedCostView = styled.main`
|
|||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
span {
|
|
||||||
color: #969BA0;
|
|
||||||
|
|
||||||
font-family: 'Poppins';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
section {
|
||||||
margin-bottom: 160px;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
canvas {
|
canvas {
|
||||||
max-height: 30rem;
|
margin: 160px 0 0 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|||||||
@ -17,10 +17,12 @@ export const GrossSavingsView = styled.main`
|
|||||||
}
|
}
|
||||||
|
|
||||||
section {
|
section {
|
||||||
margin-bottom: 160px;
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
canvas {
|
canvas {
|
||||||
max-height: 30rem;
|
margin: 160px 0 0 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|||||||
81
styles/nprogress/nprogress.css
Normal file
@ -0,0 +1,81 @@
|
|||||||
|
* Make clicks pass-through */
|
||||||
|
#nprogress {
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#nprogress .bar {
|
||||||
|
background: #254F7F;
|
||||||
|
|
||||||
|
position: fixed;
|
||||||
|
z-index: 1031;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
height: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Fancy blur effect */
|
||||||
|
#nprogress .peg {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
width: 100px;
|
||||||
|
height: 100%;
|
||||||
|
box-shadow: 0 0 10px #254F7F, 0 0 5px #254F7F;
|
||||||
|
opacity: 1;
|
||||||
|
|
||||||
|
-webkit-transform: rotate(3deg) translate(0px, -4px);
|
||||||
|
-ms-transform: rotate(3deg) translate(0px, -4px);
|
||||||
|
transform: rotate(3deg) translate(0px, -4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Remove these to get rid of the spinner */
|
||||||
|
#nprogress .spinner {
|
||||||
|
display: block;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 1031;
|
||||||
|
top: 15px;
|
||||||
|
right: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#nprogress .spinner-icon {
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
border: solid 2px transparent;
|
||||||
|
border-top-color: #254F7F;
|
||||||
|
border-left-color: #254F7F;
|
||||||
|
border-radius: 50%;
|
||||||
|
|
||||||
|
-webkit-animation: nprogress-spinner 400ms linear infinite;
|
||||||
|
animation: nprogress-spinner 400ms linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nprogress-custom-parent {
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nprogress-custom-parent #nprogress .spinner,
|
||||||
|
.nprogress-custom-parent #nprogress .bar {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes nprogress-spinner {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes nprogress-spinner {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||