Difference between revisions of "Team:Tec-Chihuahua/Entrepreneurship"

Line 23: Line 23:
 
<div id="one" class="tabcontent">
 
<div id="one" class="tabcontent">
 
   <h3 align="center">Client</h3>
 
   <h3 align="center">Client</h3>
  <div class="a"><p align="justify">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p></div>
 
 
</div>
 
</div>
  
 
<div id="two" class="tabcontent">
 
<div id="two" class="tabcontent">
 
   <h3 align="center">Necessities</h3>
 
   <h3 align="center">Necessities</h3>
  <div class="a"><p align="justify">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p></div>
 
 
</div>
 
</div>
  
 
<div id="three" class="tabcontent">
 
<div id="three" class="tabcontent">
 
   <h3 align="center">Hypothesis</h3>
 
   <h3 align="center">Hypothesis</h3>
  <div class="a"><p align="justify">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p></div>
 
 
</div>
 
</div>
  
 
<div id="four" class="tabcontent">
 
<div id="four" class="tabcontent">
 
   <h3 align="center">Solutions</h3>
 
   <h3 align="center">Solutions</h3>
  <div class="a"><p align="justify">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p></div>
 
 
</div>
 
</div>
  
Line 121: Line 117:
 
<html>
 
<html>
 
<div class="container">
 
<div class="container">
<script>
+
 
// Get the element with id="defaultOpen" and click on it
+
<div class="row">
document.getElementById("defaultOpen1").click();
+
<button class="collapsible0"><h4 align="center">XXXXXX</h4></button>
function openCity(evt, cityName) {
+
  <div class="contentA">
    var i, tabcontent, tablinks;
+
  <h3 align="center">XXXXXX</h3>
    tabcontent = document.getElementsByClassName("tabcontent1");
+
      <p align="justify">XXXXXX</p>
    for (i = 0; i < tabcontent.length; i++) {
+
  </div>
        tabcontent[i].style.display = "none";
+
<button class="collapsible1"><h4 align="center">XXXXXX</h4></button>
    }
+
  <div class="contentA">
    tablinks = document.getElementsByClassName("tablinks1");
+
  <h3 align="center">XXXXXX</h3>
    for (i = 0; i < tablinks.length; i++) {
+
      <p align="justify">XXXXXX</p>
        tablinks[i].className = tablinks[i].className.replace(" active", "");
+
  </div>
    }
+
<button class="collapsible2"><h4 align="center">XXXXXX</h4></button>
    document.getElementById(cityName1).style.display = "block";
+
  <div class="contentA">
    evt.currentTarget.className += " active";
+
  <h3 align="center">XXXXXX</h3>
}
+
      <p align="justify">XXXXXX</p>
</script>
+
  </div>
 +
<button class="collapsible3"><h4 align="center">XXXXXX</h4></button>
 +
  <div class="contentA">
 +
  <h3 align="center">XXXXXX</h3>
 +
      <p align="justify">XXXXXX</p>
 +
  </div>
 +
</div>
 +
<br>
 +
 
 
<style>
 
<style>
.tab1 ul li {
+
.contentA {
  list-style: none;
+
    padding: 0 18px;
  text-align: center;
+
    display: none;
  position: relative;
+
    overflow: hidden;
 +
    background-color: #ffffff;
 +
    border-radius: 25px;
 +
    width: 100%;
 
}
 
}
  
/* Style the tab */
+
.collapsible0 {
.tab1 {
+
     background-color: rgb(252,101,8);
     float: middle;
+
     color: white;
     position: relative;
+
     cursor: pointer;
     overflow: hidden;
+
     padding: 18px;
     border-left: 100px solid #fff;
+
     width: 25%;
     border-right: 100px solid #fff;
+
     border: 5px solid #fff;
     background-color: #fff;
+
     text-align: left;
     box-shadow: 0px 0px;
+
     outline: none;
     shadow-color: #000;
+
     font-size: 15px;
     border-radius: 15px;
+
     border-radius: 25px;
     padding-right:-45px;
+
    padding-left: -45px;
+
 
}
 
}
  
/* Style the buttons inside the tab */
+
.collapsible1 {
.tab1 button {
+
     background-color: rgb(253,148,9);
     background-color: #fff;
+
     color: white;
     float: middle;
+
     cursor: pointer;
     position: relative;
+
    padding: 18px;
     border: none;
+
    width: 25%;
 +
     border: 5px solid #fff;
 +
    text-align: left;
 
     outline: none;
 
     outline: none;
    cursor: pointer;
+
     font-size: 15px;
    padding: 14px 16px;
+
     border-radius: 25px;
    transition: 0.3s;
+
     font-size: 17px;
+
     border-radius: 15px;
+
 
}
 
}
  
/* Change background color of buttons on hover */
+
.collapsible2 {
.tab button:hover {
+
     background-color: rgb(253,174,9);
     background-color: #fff;
+
    color: white;
 +
    cursor: pointer;
 +
    padding: 18px;
 +
    width: 25%;
 +
    border: 5px solid #fff;
 +
    text-align: left;
 +
    outline: none;
 +
    font-size: 15px;
 +
    border-radius: 25px;
 
}
 
}
  
/* Create an active/current tablink class */
+
.collapsible3 {
.tab button.active {
+
     background-color: #777;
     background-color: #fff;
+
    color: white;
 +
    cursor: pointer;
 +
    padding: 18px;
 +
    width: 25%;
 +
    border: 5px solid #fff;
 +
    text-align: left;
 +
    outline: none;
 +
    font-size: 15px;
 +
    border-radius: 25px;
 
}
 
}
  
/* Style the tab content */
+
.active, .collapsible3:hover {
.tabcontent1 {
+
     background-color: #555;
     display: none;
+
    padding: 6px 6px;
+
    border: 1px solid #fff;
+
    border-top: none;
+
 
}
 
}
 
</style>
 
</style>
 +
<script>
 +
var coll = document.getElementsByClassName("collapsible0");
 +
var i;
  
;
+
for (i = 0; i < coll.length; i++) {
 
+
  coll[i].addEventListener("click", function() {
 
+
    this.classList.toggle("active");
 
+
    var content = this.nextElementSibling;
 
+
    if (content.style.display === "block") {
 
+
      content.style.display = "none";
 
+
    } else {
 
+
      content.style.display = "block";
 
+
    }
 
+
  });
 
+
}
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
  
 +
var coll = document.getElementsByClassName("collapsible1");
 +
var i;
  
 +
for (i = 0; i < coll.length; i++) {
 +
  coll[i].addEventListener("click", function() {
 +
    this.classList.toggle("active");
 +
    var content = this.nextElementSibling;
 +
    if (content.style.display === "block") {
 +
      content.style.display = "none";
 +
    } else {
 +
      content.style.display = "block";
 +
    }
 +
  });
 +
}
  
 +
var coll = document.getElementsByClassName("collapsible2");
 +
var i;
  
 +
for (i = 0; i < coll.length; i++) {
 +
  coll[i].addEventListener("click", function() {
 +
    this.classList.toggle("active");
 +
    var content = this.nextElementSibling;
 +
    if (content.style.display === "block") {
 +
      content.style.display = "none";
 +
    } else {
 +
      content.style.display = "block";
 +
    }
 +
  });
 +
}
  
 +
var coll = document.getElementsByClassName("collapsible3");
 +
var i;
  
 +
for (i = 0; i < coll.length; i++) {
 +
  coll[i].addEventListener("click", function() {
 +
    this.classList.toggle("active");
 +
    var content = this.nextElementSibling;
 +
    if (content.style.display === "block") {
 +
      content.style.display = "none";
 +
    } else {
 +
      content.style.display = "block";
 +
    }
 +
  });
 +
}
 +
</script>
 
</div>
 
</div>
 
</html>
 
</html>
 
{{:Team:Tec-Chihuahua/Templates/footer}}
 
{{:Team:Tec-Chihuahua/Templates/footer}}

Revision as of 02:35, 6 October 2018

Erwinions



Overview

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Client

Necessities

Hypothesis

Solutions


XXXXXX

XXXXXX

XXXXXX

XXXXXX

XXXXXX

XXXXXX

XXXXXX

XXXXXX