MathewFrancis/cezenGIT
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Nav bar

Browse Source
This commit is contained in:
MathewFrancis 2025-05-21 12:51:58 +05:30
parent c28b9b1132
commit 9ba229c153
13 changed files with 274 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
MySQL_conf_pbx/test1/mariadb_data/aria_log.00000001
View File

Binary file not shown.

BIN
MySQL_conf_pbx/test1/mariadb_data/aria_log_control
View File

Binary file not shown.

20
MySQL_conf_pbx/test1/reactcezenpbx/src/App.jsx
View File

@ -1,17 +1,19 @@
import { useState } from 'react' import { useState } from "react";
import reactLogo from './assets/react.svg' import reactLogo from "./assets/react.svg";
import viteLogo from '/vite.svg' import viteLogo from "/vite.svg";
import SignInUp from './components/login-logout/signInup' import SignInUp from "./components/login-logout/signInup";
import './App.css' import LandingPage from "./components/landing-page/homePage.jsx";
import "./App.css";
function App() { function App() {
const [count, setCount] = useState(0) const [count, setCount] = useState(0);
return ( return (
<div className='containment'> <div className="containment">
<LandingPage />
<SignInUp /> <SignInUp />
</div> </div>
) );
} }
export default App export default App;

46
MySQL_conf_pbx/test1/reactcezenpbx/src/assets/hammer-spanner-svgrepo-com.svg Normal file
View File

@ -0,0 +1,46 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg fill="#008985" height="800px" width="800px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 512.01 512.01" xml:space="preserve">
<g>
<g>
<path d="M477.765,373.495c-5.141-7.527-17.466-19.802-39.834-20.289c-17.809,4.379-36.815,11.154-54.572,21.35
c-22.308,12.805-39.21,29.108-51.014,48.507c-0.171,0.547-0.282,0.915-0.282,0.915c-1.24,6.458-1.018,12.471,0.154,17.74
c6.398,28.62,41.536,48.242,70.362,48.619c3.37,0.043,6.518-1.617,8.4-4.422c1.873-2.797,2.198-6.355,0.872-9.452l-17.415-40.629
l38.457-19.228l16.945,39.552c1.257,2.934,3.849,5.081,6.963,5.782c3.114,0.701,6.372-0.128,8.767-2.241
C489.287,438.904,494.949,398.548,477.765,373.495z"/>
</g>
</g>
<g>
<g>
<path d="M405.659,334.089c-44.932-30.955-86.75-64.066-124.472-98.306l78.111-78.111c1.839-1.839,1.839-4.824,0-6.663
l-19.99-19.99c-1.839-1.839-4.824-1.839-6.663,0l-78.915,78.915c-30.647-29.938-58.079-60.525-81.464-91.147
c-2.027-2.652-5.885-2.523-7.861,0.163c-4.362,5.936-9.169,11.59-14.481,16.902c-10.35,10.35-22.402,19.511-36.105,27.371
c-8.793,5.055-18.005,9.358-27.354,13.027c-3.764,1.48-4.337,6.518-0.975,8.785c34.924,23.539,66.812,47.019,95.911,70.567
L56.074,380.928L10.86,399.755c-1.745,1.163-3.045,2.874-3.712,4.858l-6.663,19.99c-1.129,3.387-0.248,7.117,2.275,9.64
l53.314,53.314c2.523,2.523,6.261,3.404,9.64,2.275l19.99-6.663c1.984-0.659,3.695-1.967,4.858-3.712l18.809-45.223
l129.031-129.031c31.511,29.655,58.72,59.516,81.764,89.804c1.959,2.575,5.714,2.566,7.775,0.068
c2.942-3.593,6.056-7.074,9.392-10.401c10.358-10.35,22.41-19.519,36.113-27.38c9.965-5.722,20.469-10.512,31.092-14.49
C408.336,341.385,408.994,336.39,405.659,334.089z"/>
</g>
</g>
<g>
<g>
<path d="M155.509,77.105c-6.39-28.62-41.536-48.242-70.362-48.619c-3.353-0.051-6.501,1.617-8.383,4.422
c-1.873,2.797-2.198,6.355-0.881,9.452l17.415,40.63l-38.457,19.228l-16.945-39.56c-1.266-2.925-3.849-5.081-6.963-5.782
c-3.114-0.701-6.372,0.128-8.767,2.241C-1.552,79.911-7.214,120.266,9.97,145.32c5.671,8.271,18.749,22.701,45.642,20.4
c15.952-4.379,32.615-10.735,48.285-19.742c22.804-13.096,39.988-29.826,51.8-49.799c-0.094-0.137-0.205-0.282-0.308-0.419
C155.56,95.213,156.681,82.374,155.509,77.105z"/>
</g>
</g>
<g>
<g>
<path d="M509.251,141.026l-19.99-19.99c-0.821-0.59-1.634-1.172-2.455-1.771l-25.233-12.617c-5.337-5.611-6.543-9.255-8.04-13.814
c-1.659-5.021-3.729-11.265-10.914-18.45C383.761,15.528,316.171,5.443,257.194,46.731c-2.481,1.736-3.935,4.645-3.935,7.664
v26.653c0,3.165,1.702,6.047,4.354,7.801c2.634,1.745,6.099,2.002,9.007,0.761c24.959-10.589,48.619-20.623,78.043-4.414
l-4.285,12.856c-1.129,3.387-0.248,7.117,2.275,9.648l37.02,37.02c2.352,2.352,5.765,3.285,8.973,2.412
c9.007-2.429,18.963-0.393,26.285,6.236l12.591,25.182c0.59,0.821,1.172,1.634,1.771,2.455l19.99,19.99
c3.678,3.678,9.648,3.678,13.326,0l46.651-46.651C512.929,150.674,512.929,144.704,509.251,141.026z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

6
MySQL_conf_pbx/test1/reactcezenpbx/src/assets/profile-circle-svgrepo-com.svg Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.5 8.5C14.5 9.88071 13.3807 11 12 11C10.6193 11 9.5 9.88071 9.5 8.5C9.5 7.11929 10.6193 6 12 6C13.3807 6 14.5 7.11929 14.5 8.5Z" fill="#008985"/>
<path d="M15.5812 16H8.50626C8.09309 16 7.87415 15.5411 8.15916 15.242C9.00598 14.3533 10.5593 13 12.1667 13C13.7899 13 15.2046 14.3801 15.947 15.2681C16.2011 15.5721 15.9774 16 15.5812 16Z" fill="#008985" stroke="#008985" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="12" cy="12" r="10" stroke="#008985" stroke-width="2"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 748 B

5
MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/home-page.css Normal file
View File

@ -0,0 +1,5 @@
.landing_screen {
margin-top: 2rem;
text-align: center;
font-size: 2rem;
}

13
MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/homePage.jsx Normal file
View File

@ -0,0 +1,13 @@
import NavBar from "./navBar";
import "./home-page.css";
export default function LandingPage() {
return (
<>
<NavBar />
<article className="landing_screen">
<p>Welcome to the landing page !</p>
</article>
</>
);
}

24
MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/navBar.jsx Normal file
View File

@ -0,0 +1,24 @@
import "./navStyleImpl.css";
import CezenBanner from "../login-logout/cezenBanar";
import operationsLogo from "../../assets/hammer-spanner-svgrepo-com.svg";
import profileLogo from "../../assets/profile-circle-svgrepo-com.svg";
export default function NavBar() {
return (
<nav className="navigation">
<div>
<CezenBanner className="cezen_banner_top" />
</div>
<div className="RHS_nav">
<div>
<img src={operationsLogo} />
operations
</div>
<div>
<img src={profileLogo} />
profile
</div>
</div>
</nav>
);
}

74
MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/navStyleImpl.css Normal file
View File

@ -0,0 +1,74 @@
.navigation {
margin-top: 2rem;
background-color: #caf0f8;
font-size: 1.6rem;
padding: 1rem;
display: flex;
flex-direction: row;
gap: 2rem;
justify-content: space-between;
border-radius: 2rem;
}
.navigation span {
max-width: 4rem;
transition: all 1s;
margin-right: 0rem;
margin-left: 0rem;
}
.navigation span:hover {
cursor: pointer;
margin-right: 0.4rem;
margin-left: 0.4rem;
}
.cezen_banner_top {
display: flex;
flex-direction: row;
}
.cezen_banner_top h1 {
align-self: center;
font-size: 2rem;
/* font-weight: 500; */
}
/* cezen */
.cezen_banner_top h1 span:first-child {
color: #008985;
}
/* PBX */
.cezen_banner_top h1 span:last-child {
color: #1f3890;
}
.RHS_nav {
color: #1f3890;
display: flex;
flex-direction: row;
gap: 2.4rem;
align-items: center;
text-transform: uppercase;
margin-right: 1rem;
}
.RHS_nav div {
padding-left: 1rem;
padding-bottom: 0rem;
border-bottom: 0.4rem solid rgba(202, 240, 248, 0.3);
transition: all 0.3s;
}
.RHS_nav div img {
max-width: 2.2rem;
margin-right: 0.8rem;
}
.RHS_nav div:hover {
padding-left: 1rem;
padding-bottom: 0.5rem;
border-bottom: 0.2rem solid rgba(0, 137, 133, 0.8);
cursor: pointer;
}

14
MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/cezenBanar.jsx
View File

@ -1,16 +1,14 @@
import cezenLogo from "../../assets/CezenLogo.svg"; import cezenLogo from "../../assets/CezenLogo.svg";
import './logo_and_text.css' import "./logo_and_text.css";
export default function CezenBanner(){
export default function CezenBanner({ ...restOfIt }) {
return ( return (
<span className="cezen_banner"> <span {...restOfIt}>
<img src={cezenLogo} alt="cezen tech logo"/> <img src={cezenLogo} alt="cezen tech logo" />
<h1> <h1>
<span>Cezen</span><span>PBX</span> <span>Cezen</span>
<span>PBX</span>
</h1> </h1>
</span> </span>
); );
} }

52
MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/form_styling.css
View File

@ -1,68 +1,64 @@
section{ section {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
font-size: 2rem; font-size: 2rem;
margin-bottom: 4rem; margin-bottom: 4rem;
} }
.intro-page{ .intro-page {
margin-top: 3rem; margin-top: 3rem;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2rem; gap: 2rem;
/* align-items: center; */ /* align-items: center; */
} }
.cezen-logo{ .cezen-logo {
justify-items:center; justify-items: center;
margin-right: 25rem; margin-right: 25rem;
} }
.LHS {
.LHS{ background-color: #03045e;
background-color: #03045E;
justify-items: center; justify-items: center;
padding: 5rem; padding: 5rem;
text-transform: capitalize; text-transform: capitalize;
color: #0096C7; color: #0096c7;
border-top-left-radius: 2rem; border-top-left-radius: 2rem;
border-bottom-left-radius: 2rem; border-bottom-left-radius: 2rem;
} }
.RHS{ .RHS {
background-color: #CAF0F8; background-color: #caf0f8;
justify-items: center; justify-items: center;
padding: 5rem; padding: 5rem;
color: #03045E; color: #03045e;
} }
.RHS p{ .RHS p {
margin-top: 2rem; margin-top: 2rem;
padding-left: 2rem; padding-left: 2rem;
} }
.form-elements {
.form-elements{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 4rem; gap: 4rem;
padding: 2rem; padding: 2rem;
} }
.form-elements div .form-elements div {
{
font-size: 2.2rem; font-size: 2.2rem;
align-items:start; align-items: start;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1.4rem; gap: 1.4rem;
} }
.form-elements div label{ .form-elements div label {
padding-left: 1rem; padding-left: 1rem;
} }
.form-elements div input{ .form-elements div input {
min-width: 30rem; min-width: 30rem;
min-height: 4rem; min-height: 4rem;
padding: 1rem; padding: 1rem;
@ -72,23 +68,21 @@ section{
background-color: #e7f8fc; background-color: #e7f8fc;
} }
form button{ form button {
margin-top: 4rem; margin-top: 4rem;
background-color: #90E0EF; background-color: #90e0ef;
color: #03045E; color: #03045e;
font-size: 2rem; font-size: 2rem;
text-transform: uppercase; text-transform: uppercase;
padding: 1.2rem 1.6rem; padding: 1.2rem 1.6rem;
font-weight: 900; font-weight: 900;
border-radius: 0.5rem; border-radius: 0.5rem;
transition: all 0.3s; transition: all 0.3s;
border: 0.3rem solid #03045E; border: 0.3rem solid #03045e;
} }
form button:hover{ form button:hover {
background-color: #ADE8F4; background-color: #ade8f4;
cursor: pointer; cursor: pointer;
border: 0.3rem solid #ADE8F4; border: 0.3rem solid #ade8f4;
} }

15
MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/logo_and_text.css
View File

@ -1,27 +1,24 @@
.cezen_banner{ .cezen_banner {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
} }
.cezen_banner h1{ .cezen_banner h1 {
align-self: center; align-self: center;
font-size: 10rem; font-size: 10rem;
/* font-weight: 500; */ /* font-weight: 500; */
} }
/* cezen */ /* cezen */
.cezen_banner h1 span:first-child{ .cezen_banner h1 span:first-child {
color: #008985; color: #008985;
} }
/* PBX */ /* PBX */
.cezen_banner h1 span:last-child{ .cezen_banner h1 span:last-child {
color: #1F3890; color: #1f3890;
} }
img {
img{
max-width: 20rem; max-width: 20rem;
} }

3
MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/signInup.jsx
View File

@ -2,6 +2,7 @@ import CezenBanner from "./cezenBanar";
import SignUp from "./signUp"; import SignUp from "./signUp";
import LogIn from "./logIn"; import LogIn from "./logIn";
import "./form_styling.css"; import "./form_styling.css";
import "./logo_and_text.css";
// admin signup // admin signup
export default function SignInUp() { export default function SignInUp() {
@ -10,7 +11,7 @@ export default function SignInUp() {
<> <>
<div className="intro-page"> <div className="intro-page">
<div className="cezen-logo"> <div className="cezen-logo">
<CezenBanner /> <CezenBanner className="cezen_banner" />
</div> </div>
<section> <section>
<div className="LHS"> <div className="LHS">