Skip to content
Jump to bottom

Cambios del entregable 3 #1

Merged
merged 3 commits into from Mar 7, 2021
Merged

Cambios del entregable 3 #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
a2123bf
Commit mayor de la entrega 3
juadecha Mar 7, 2021
250b29e
Eliminados algunos archivos innecesarios, estructura cambiada para me…
juadecha Mar 7, 2021
5dff89a
Mejorada estructura de componentes para aumentar la legibilidad. Arre…
juadecha Mar 7, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
8 changes: 8 additions & 0 deletions package.json
View file
Open in desktop
Expand Up @@ -13,11 +13,19 @@
"@types/node": "^12.0.0",
"@types/react": "^17.0.0",
"@types/react-dom": "^17.0.0",
"@types/react-redux": "^7.1.16",
"@types/react-slick": "^0.23.4",
"bootstrap": "^4.6.0",
"native-css": "^2.0.0",
"node-sass": "^5.0.0",
"react": "^17.0.1",
"react-bootstrap": "^1.5.1",
"react-dom": "^17.0.1",
"react-fontawesome": "^1.7.1",
"react-redux": "^7.2.2",
"react-scripts": "4.0.3",
"react-slick": "^0.28.0",
"redux": "^4.0.5",
"typescript": "^4.1.2",
"web-vitals": "^1.0.1"
},
Expand Down
159 changes: 72 additions & 87 deletions src/App.tsx
View file
Open in desktop
@@ -1,111 +1,96 @@
import Advertwrap from './Components/advertwrap'
import Navbar from './Components/navbar'
import Header from './Components/header'
import Slidewrap from './Components/slidewrap'
import Introwrap from './Components/introwrap'
import Showcasewrap from './Components/showcasewrap'
import Bottomwrap from './Components/bottomwrap'
import NB from './containers/navbar'
import Slideshow from './components/slideshow'

import Bottomwrap from './components/bottomwrap'
import Newsshow from './components/newsshow'
import JobComponent from './components/jobComponent'
import useWindowDimensions from './components/setWindowDimensions'
import Mainbottomwrap from './components/mainbottomwrap';
import Backtotop from './components/backtotop';
import Footerwrap from './components/footerwrap';
import Copyrightwrap from './components/copyrightwrap';
import { Action, createStore } from 'redux'
import IGlobalState, { initialState} from './state/globalState'
import { Provider } from 'react-redux'
import { INavbarCollapseAction } from './actions/NavbarActions'

//New SCSS import
import './Inicio_files/scss/custom.scss'


//Inhetired CSS import
import './Inicio_files/inheritedCSS/linea2.css'
import './Inicio_files/inheritedCSS/bootstrap-responsive.css'
import './Inicio_files/inheritedCSS/font-awesome.css';
import './Inicio_files/inheritedCSS/vembed.css';
import './Inicio_files/inheritedCSS/faveffects.css';
import './Inicio_files/inheritedCSS/css.css';
import './Inicio_files/inheritedCSS/favpromote.css';
import './Inicio_files/inheritedCSS/style.css';
import './Inicio_files/inheritedCSS/style.min.css';
import './Inicio_files/inheritedCSS/style(1).css';
import './Inicio_files/inheritedCSS/k2.css';
import './Inicio_files/inheritedCSS/k2style.css';
import './Inicio_files/inheritedCSS/joomla.css';
import './Inicio_files/inheritedCSS/template.css';
import './Inicio_files/inheritedCSS/etsii.css';
import './Inicio_files/inheritedCSS/directorio.css';
import './Inicio_files/inheritedCSS/checkbox.css';
import './Inicio_files/inheritedCSS/calendar-blue.css';
import './Inicio_files/inheritedCSS/balloon.css';
import './Inicio_files/inheritedCSS/estilos.css';



import './Inicio_files/simple-line-icons.css'
import './Inicio_files/linea2.css'
import './Inicio_files/bootstrap.min.css'
import './Inicio_files/bootstrap-responsive.css'
import './Inicio_files/font-awesome.css';
import './Inicio_files/favsocial.css';
import './Inicio_files/icomoon.css';
import './Inicio_files/vembed.css';
import './Inicio_files/faveffects.css';
import './Inicio_files/css.css';
import './Inicio_files/favpromote.css';
import './Inicio_files/style.css';
import './Inicio_files/ic_rounded_module.css';
import './Inicio_files/style.min.css';
import './Inicio_files/style(1).css';
import './Inicio_files/k2.css';


import './Inicio_files/k2style.css';
import './Inicio_files/joomla.css';
import './Inicio_files/template.css';



import './Inicio_files/etsii.css';

import './Inicio_files/directorio.css';

import './Inicio_files/checkbox.css';

import './Inicio_files/calendar-blue.css';

import './Inicio_files/balloon.css';

import './Inicio_files/estilos.css';
import Linewrap from './Components/linewrap';
import Mainbottomwrap from './Components/mainbottomwrap';
import Backtotop from './Components/backtotop';
import Footerwrap from './Components/footerwrap';
import Copyrightwrap from './Components/copyrightwrap';
<style type="text/css" dangerouslySetInnerHTML={{__html: "\n\n\t@media (min-width: 1200px) {\n\t\t.row-fluid { \n\t\t\tmax-width: 90%; \n\t\t}\n\t}\n\tbody { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-advertwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-slidewrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-introwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-showcasewrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-promowrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-topwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-maintopwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-mainbottomwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-bottomwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-userwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-footerwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-copyrightwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t#fav-debugwrap { \n\t\tbackground-repeat: repeat;\n\t}\n\t.slogan {\n\t\tfont-family: 'Helvetica Neue', Helvetica, sans-serif ;\n\t}\n\n" }} />


const reducer = (state: IGlobalState = initialState, action: Action) => {
switch(action.type){
case 'COLLAPSED':
const collapsedAction = action as INavbarCollapseAction
return{...state, collapsed: collapsedAction.payload}
}
return state;
}
const store = createStore(reducer, initialState)

function App() {
return (
<div style={{margin: 'auto'}}>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />

<Advertwrap />

<Navbar />

const { width } = useWindowDimensions();

<Header />

<Slidewrap />
return (
<Provider store={store}>
<div id="home" style={{margin: 'auto'}}>
<link
rel="stylesheet"
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css"
/>
<link
rel="stylesheet"
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css"
/>

<Introwrap />
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
<NB />
<Slideshow />
<Newsshow width={width}/>
<JobComponent />

<Showcasewrap />

<Bottomwrap />

<Linewrap />

<Mainbottomwrap />

<Backtotop />

<Footerwrap />

{/* Backtotop mobile */}
<div className="container-fluid">
<div className="row-fluid">
<div id="fav-backtotop-mobile" className="span12">
<a href="https://www.informatica.us.es/" className="backtop" title="BACK TO TOP"><i className="fa fa-angle-up" />
</a>
</div>
</div>
</div>


{/* Copyright */}
<Copyrightwrap />
{/* Debug */}
<div className="container-fluid" id="fav-debugwrap">
<div className="row-fluid">
<div id="fav-debug" className="span12 ">
</div>
</div>
</div>
<div className="container-fluid">
<div className="row-fluid">
</div>
</div>
{/*[if lte IE 7]><![endif]*/}

<noscript>&lt;strong&gt;JavaScript is currently disabled.&lt;/strong&gt;Please enable it for a better experience of &lt;a href="http://2glux.com/projects/jumi"&gt;Jumi&lt;/a&gt;.</noscript>
</div>
</Provider>
);
}

Expand Down
29 changes: 0 additions & 29 deletions src/Components/advertwrap.tsx
View file
Open in desktop

This file was deleted.

42 changes: 27 additions & 15 deletions src/Components/backtotop.tsx
View file
Open in desktop
@@ -1,18 +1,30 @@
import React from 'react'

class Backtotop extends React.Component {
public render () {

return(
<div className="container-fluid">
<div className="row-fluid">
<div id="fav-backtotop" className="span12">
<a href="localhost:3000" className="backtop" title="BACK TO TOP"><i className="fa fa-angle-up" />
</a>
</div>
</div>
import React, {useState} from 'react';


const ScrollButton = () =>{

//Controlamos con un Hook si debemos mostrar el botón
const [showScroll, setShowScroll] = useState(false)

const checkScrollTop = () => {
if (!showScroll && window.pageYOffset > 400){
setShowScroll(true)
} else if (showScroll && window.pageYOffset <= 400){
setShowScroll(false)
}
};

const scrollTop = () =>{
window.scrollTo({top: 0, behavior: 'smooth'});
};

window.addEventListener('scroll', checkScrollTop)

return (
<div>
<i className="fa fa-arrow-circle-up fa-3x scrollTop" onClick={scrollTop} style={{display: showScroll ? 'flex' : 'none'}}/>
</div>
) }
);
}

export default Backtotop;
export default ScrollButton;
42 changes: 21 additions & 21 deletions src/Components/bottomwrap.tsx
View file
Open in desktop
@@ -1,18 +1,21 @@
import React from 'react'
import footer1 from '../Inicio_files/cita-secretaria.png'
import footer2 from '../Inicio_files/TFG.png'
import footer3 from '../Inicio_files/etsiiorienta.png'
import footer4 from '../Inicio_files/expon-us250A.png'
import footer1 from '../Inicio_files/img/cita-secretaria.png'
import footer2 from '../Inicio_files/img/TFG.png'
import footer3 from '../Inicio_files/img/etsiiorienta.png'
import footer4 from '../Inicio_files/img/expon-us250A.png'


class Bottomwrap extends React.Component {
public render () {

return(
<div className="container-fluid" id="fav-topwrap">
<div className="row-fluid">
<div className="container-fluid" id="fav-topwrap">
<div className="title topwrapTitle">
<h2 className="cardTitleText">Enlaces de Interés</h2>
</div>
<div className="row-fluid topwrapImgsDiv">
<div id="fav-top" className="clearfix">
<div id="fav-top1" className="span3">


<BottomwrapElement img={footer1} classname="favpromote400" link="https://www.informatica.us.es/index.php/secretaria" dsihtml=".favpromote400 { background-color: #FFFFFF; border: 1px solid #DDDDDD; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }.favpromote400:hover { background-color: #B8B8B8; }"/>
</div>
<div id="fav-top2" className="span3">
Expand All @@ -30,22 +33,19 @@ class Bottomwrap extends React.Component {
) }
}


interface IBottomwrapElementProps {
dsihtml: string,
classname: string,
link: string,
img: string,



}

interface IBottomwrapElementState {
dsihtml: string,
classname: string,
link: string,
img: string,

}

class BottomwrapElement extends React.Component<IBottomwrapElementProps, IBottomwrapElementState> {
Expand All @@ -58,15 +58,15 @@ class BottomwrapElement extends React.Component<IBottomwrapElementProps, IBottom
public render(){
return (
<div className="moduletable">
<style type="text/css" dangerouslySetInnerHTML={{__html: this.state.dsihtml}}/>
<div id="favpromote" className={this.state.classname}>
<div id="favpromote-uploadimage" style={{height: '100%', textAlign: 'center'}}>
<a href={this.state.link} target="_self">
<img src={this.state.img} alt=""/>
</a>
</div>
</div>
</div>)
<style type="text/css" dangerouslySetInnerHTML={{__html: this.state.dsihtml}}/>
<div id="favpromote" className={this.state.classname}>
<div id="favpromote-uploadimage" className="topwrapImgs">
<a href={this.state.link} target="_self">
<img src={this.state.img} alt=""/>
</a>
</div>
</div>
</div>)
}
}

Expand Down