cambios2
This commit is contained in:
parent
15c37d966b
commit
31e7d6342c
|
@ -1,4 +1,4 @@
|
||||||
.contenedor {
|
/*.contenedor {
|
||||||
max-height: none;
|
max-height: none;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
@ -12,13 +12,13 @@
|
||||||
.banner h1 {
|
.banner h1 {
|
||||||
font-size: 35px;
|
font-size: 35px;
|
||||||
margin-left: 2%;
|
margin-left: 2%;
|
||||||
pointer-events: none; /* Evita que el cursor se posicione sobre el título */
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.banner nav {
|
.banner nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between; /* Alinea los elementos al principio y al final */
|
justify-content: space-between;
|
||||||
align-items: center; /* Alinea verticalmente los elementos */
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.opciones {
|
.opciones {
|
||||||
|
@ -29,15 +29,56 @@
|
||||||
|
|
||||||
.opciones li {
|
.opciones li {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-left: 10px; /* Espacio entre elementos */
|
margin-left: 10px;
|
||||||
margin-right: 30px; /* Espacio entre elementos */
|
margin-right: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.opciones li a {
|
.opciones li a {
|
||||||
color: white;
|
color: white;
|
||||||
text-decoration: none; /* Quita el punto de los enlaces */
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.opciones li a:hover {
|
.opciones li a:hover {
|
||||||
text-decoration: underline; /* Subraya los enlaces al pasar el mouse sobre ellos */
|
text-decoration: underline;
|
||||||
|
}*/
|
||||||
|
|
||||||
|
header.headerOE{
|
||||||
|
display: inline;
|
||||||
|
width: 100%;
|
||||||
|
height: 18%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
div.grupo1{
|
||||||
|
background-color: #D5EEBB;
|
||||||
|
padding: 0%;
|
||||||
|
}
|
||||||
|
#logo{
|
||||||
|
width: 70px;
|
||||||
|
height:min-content;
|
||||||
|
}
|
||||||
|
div.grupo2{
|
||||||
|
background-color: #D5EEBB;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-left: 10px;
|
||||||
|
text-align: left;
|
||||||
|
font-size: x-large;
|
||||||
|
}
|
||||||
|
li.tit{
|
||||||
|
background-color: #D5EEBB;
|
||||||
|
color:rgba(36, 15, 103, 0.922);
|
||||||
|
font-size: xx-large;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
nav ul {
|
||||||
|
list-style-type: none;
|
||||||
|
background-color:#D5EEBB;
|
||||||
|
}
|
||||||
|
nav ul li {
|
||||||
|
display: inline;
|
||||||
|
margin-right: 80px;
|
||||||
|
|
||||||
|
}
|
||||||
|
li a{
|
||||||
|
background-color: #D5EEBB;
|
||||||
|
color:rgb(172, 104, 9);
|
||||||
}
|
}
|
|
@ -3,7 +3,23 @@ import './Encabezado.css';
|
||||||
|
|
||||||
const Encabezado = () => {
|
const Encabezado = () => {
|
||||||
return (
|
return (
|
||||||
<div className="contenedor">
|
<header className='headerOE'>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<div className='grupo1'>
|
||||||
|
<img id='logo' src="logo.png" alt='Imagen'/>
|
||||||
|
<li className='tit'>Universidad Filadelfia de México</li>
|
||||||
|
</div>
|
||||||
|
<div className='grupo2'>
|
||||||
|
<li><a href="">Nosotros</a></li>
|
||||||
|
<li><a href="">Visión</a></li>
|
||||||
|
<li><a href="">Misión</a></li>
|
||||||
|
<li><a href="">Instalaciones</a></li>
|
||||||
|
</div>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
/*<div className="contenedor">
|
||||||
<div className="banner">
|
<div className="banner">
|
||||||
<nav>
|
<nav>
|
||||||
<h1>Universidad de Huacoxla</h1>
|
<h1>Universidad de Huacoxla</h1>
|
||||||
|
@ -17,7 +33,8 @@ const Encabezado = () => {
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>*/
|
||||||
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -2,9 +2,12 @@ h1.tituloOE{
|
||||||
color: rgba(36, 15, 103, 0.922);
|
color: rgba(36, 15, 103, 0.922);
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
padding-inline:initial;
|
padding-inline:initial;
|
||||||
margin-top:15%;
|
margin-top: 5%;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 60px;
|
||||||
|
|
||||||
}
|
}
|
||||||
header.headerOE{
|
/*header.headerOE{
|
||||||
display: inline;
|
display: inline;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 18%;
|
height: 18%;
|
||||||
|
@ -40,7 +43,7 @@ nav ul li {
|
||||||
li a{
|
li a{
|
||||||
background-color: #D5EEBB;
|
background-color: #D5EEBB;
|
||||||
color:rgb(172, 104, 9);
|
color:rgb(172, 104, 9);
|
||||||
}
|
}*/
|
||||||
.container{
|
.container{
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: auto auto auto auto;
|
grid-template-columns: auto auto auto auto;
|
||||||
|
|
|
@ -1,25 +1,9 @@
|
||||||
import './OfertaEducativa.css'
|
import './OfertaEducativa.css'
|
||||||
|
|
||||||
function OfertaEducativa (){
|
const OfertaEducativa = () => {
|
||||||
return (
|
return(
|
||||||
<>
|
<>
|
||||||
<body>
|
<body>
|
||||||
<header className='headerOE'>
|
|
||||||
<nav>
|
|
||||||
<ul>
|
|
||||||
<div className='grupo1'>
|
|
||||||
<img id='logo' src="logo.png" alt='Imagen'/>
|
|
||||||
<li className='tit'>Universidad Filadelfia de México</li>
|
|
||||||
</div>
|
|
||||||
<div className='grupo2'>
|
|
||||||
<li><a href="">Nosotros</a></li>
|
|
||||||
<li><a href="">Visión</a></li>
|
|
||||||
<li><a href="">Misión</a></li>
|
|
||||||
<li><a href="">Instalaciones</a></li>
|
|
||||||
</div>
|
|
||||||
</ul>
|
|
||||||
</nav>
|
|
||||||
</header>
|
|
||||||
<h1 className='tituloOE'>Oferta Educativa</h1>
|
<h1 className='tituloOE'>Oferta Educativa</h1>
|
||||||
<div className='container'>
|
<div className='container'>
|
||||||
<div className='area'>
|
<div className='area'>
|
||||||
|
@ -72,3 +56,20 @@ function OfertaEducativa (){
|
||||||
}
|
}
|
||||||
|
|
||||||
export default OfertaEducativa
|
export default OfertaEducativa
|
||||||
|
|
||||||
|
/*<header className='headerOE'>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<div className='grupo1'>
|
||||||
|
<img id='logo' src="logo.png" alt='Imagen'/>
|
||||||
|
<li className='tit'>Universidad Filadelfia de México</li>
|
||||||
|
</div>
|
||||||
|
<div className='grupo2'>
|
||||||
|
<li><a href="">Nosotros</a></li>
|
||||||
|
<li><a href="">Visión</a></li>
|
||||||
|
<li><a href="">Misión</a></li>
|
||||||
|
<li><a href="">Instalaciones</a></li>
|
||||||
|
</div>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>*/
|
|
@ -11,11 +11,12 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.imgColum {
|
.imgColum {
|
||||||
margin-top: auto;
|
padding-left:30%;
|
||||||
|
margin-top: 25%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.Formulario {
|
form.Formulario {
|
||||||
|
margin-left: 195px;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
width:400px;
|
width:400px;
|
||||||
height: 315px;
|
height: 315px;
|
||||||
|
@ -28,13 +29,13 @@ input[type="text"], input[type="password"]{
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
display: block;
|
display: block;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
padding-left: 10px;
|
padding-left: 1px;
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
margin-left: auto;
|
margin-left: 0px;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
font-size: large;
|
font-size: large;
|
||||||
}
|
}
|
||||||
header {
|
header.encabezado {
|
||||||
color: rgba(36, 15, 103, 0.922);
|
color: rgba(36, 15, 103, 0.922);
|
||||||
background-color: #D5EEBB;
|
background-color: #D5EEBB;
|
||||||
padding: 20px 0; /* Espaciado interno del encabezado */
|
padding: 20px 0; /* Espaciado interno del encabezado */
|
||||||
|
@ -43,7 +44,8 @@ header {
|
||||||
top: 0; /* Lo posiciona en la parte superior */
|
top: 0; /* Lo posiciona en la parte superior */
|
||||||
z-index: 1000; /* Asegura que esté por encima del contenido */
|
z-index: 1000; /* Asegura que esté por encima del contenido */
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
font-size: x-large;
|
font-size:xx-large;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
font{
|
font{
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
@ -52,17 +54,13 @@ font{
|
||||||
min-height: 89vh;
|
min-height: 89vh;
|
||||||
}*/
|
}*/
|
||||||
|
|
||||||
form{
|
h1.titLogin{
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1{
|
|
||||||
color: rgb(172, 104, 9);
|
color: rgb(172, 104, 9);
|
||||||
font-family: Jockey One;
|
font-family: Jockey One;
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
margin-top: 30%;
|
margin-top: 20%;
|
||||||
padding-left: 30%;
|
padding-left: 20%;
|
||||||
|
font-size: 60px;
|
||||||
}
|
}
|
||||||
#button{
|
#button{
|
||||||
background-color: #D5EEBB;
|
background-color: #D5EEBB;
|
||||||
|
|
|
@ -10,13 +10,15 @@ function Login() {
|
||||||
<img src="imagen.jpg" alt='Imagen'/>
|
<img src="imagen.jpg" alt='Imagen'/>
|
||||||
</div>
|
</div>
|
||||||
<div className='loginColum'>
|
<div className='loginColum'>
|
||||||
<h1>Bienvenido</h1>
|
<h1 className='titLogin'>Bienvenido</h1>
|
||||||
<form className='Formulario'>
|
<form className='Formulario'>
|
||||||
<label id='usuario'>Usuario:</label>
|
<label id='usuario'>Usuario:</label>
|
||||||
<input type='text' id='usuario'/>
|
<input type='text' id='usuario'/>
|
||||||
<label>Contraseña:</label>
|
<label>Contraseña:</label>
|
||||||
<input type="password" id='password'/>
|
<input type="password" id='password'/>
|
||||||
<button id='button' >Iniciar sesion</button>
|
<div className='divBoton'>
|
||||||
|
<button id='button' >Iniciar sesión</button>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,16 +1,17 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import ReactDOM from 'react-dom/client'
|
import ReactDOM from 'react-dom/client'
|
||||||
import OfertaEducativa from './OfertaEducativa.jsx'
|
import OfertaEducativa from './OfertaEducativa.jsx'
|
||||||
import Preinscripcion from './Preinscripcion.jsx'
|
import Registro from './Registro.jsx'
|
||||||
import SubirPDF from './SubirPDF.jsx'
|
|
||||||
|
|
||||||
import General from './General.jsx'
|
|
||||||
import './Registro.css'
|
import './Registro.css'
|
||||||
import './login.css';
|
import './login.css';
|
||||||
|
|
||||||
|
import Encabezado from './Encabezado.jsx'
|
||||||
|
|
||||||
ReactDOM.createRoot(document.getElementById('root')).render(
|
ReactDOM.createRoot(document.getElementById('root')).render(
|
||||||
<React.StrictMode>
|
<React.StrictMode>
|
||||||
<OfertaEducativa/>
|
|
||||||
|
<Encabezado/>
|
||||||
|
<Registro/>
|
||||||
</React.StrictMode>,
|
</React.StrictMode>,
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue