Difference between revisions of "Team:KSA KOREA"

(move modernizr up)
(include demo style)
Line 194: Line 194:
  
 
</style>
 
</style>
 +
 +
 +
 +
<style>
 +
@font-face {
 +
  font-family: 'arrows';
 +
  src: url('../fonts/arrows/arrows.eot');
 +
  src: url('../fonts/arrows/arrows.eot?#iefix') format('embedded-opentype'),
 +
    url('../fonts/arrows/arrows.woff') format('woff'),
 +
    url('../fonts/arrows/arrows.ttf') format('truetype'),
 +
    url('../fonts/arrows/arrows.svg#arrows') format('svg');
 +
  font-weight: normal;
 +
  font-style: normal;
 +
}
 +
 +
.bb-custom-wrapper {
 +
  width: 100%;
 +
  height: 100%;
 +
  position: relative;
 +
  /* box-sizing: border-box; */
 +
}
 +
 +
.bb-custom-wrapper .bb-bookblock {
 +
  width: 100%;
 +
  height: 100%;
 +
  -webkit-perspective: 2000px;
 +
  perspective: 2000px;
 +
}
 +
 +
.bb-custom-side {
 +
  width: 50%;
 +
  float: left;
 +
  height: 100%;
 +
  overflow: hidden;
 +
  background: #93D1D5;
 +
  /* Centering with flexbox */
 +
  display: -webkit-box;
 +
  display: -moz-box;
 +
  display: -webkit-flex;
 +
  display: flex;
 +
  -webkit-flex-direction: row;
 +
  flex-direction: row;
 +
  -webkit-flex-wrap: wrap;
 +
  flex-wrap: wrap;
 +
  -webkit-box-pack: center;
 +
  -moz-box-pack: center;
 +
  -webkit-justify-content: center;
 +
  justify-content: center;
 +
  -webkit-box-align: center;
 +
  -moz-box-align: center;
 +
  -webkit-align-items: center;
 +
  align-items: center;
 +
}
 +
 +
.bb-custom-firstpage h1 {
 +
  font-size: 2.625em;
 +
  line-height: 1.3;
 +
  margin: 0;
 +
  font-weight: 300;
 +
  background: #93D1D5;
 +
}
 +
 +
.bb-custom-firstpage h1 span {
 +
  display: block;
 +
  font-size: 60%;
 +
  opacity: 0.3;
 +
  padding: 0 0 0.6em 0.1em;
 +
}
 +
 +
.bb-custom-firstpage {
 +
  text-align: center;
 +
  padding-top: 15%;
 +
  width: 50%;
 +
  float: left;
 +
  height: 100%;
 +
}
 +
 +
.bb-custom-side p {
 +
  padding: 8%;
 +
  font-size: 1.8em;
 +
  font-weight: 300;
 +
}
 +
 +
.bb-custom-wrapper h3 {
 +
  font-size: 1.4em;
 +
  font-weight: 300;
 +
  margin: 0.4em 0 1em;
 +
}
 +
 +
.bb-custom-wrapper>nav {
 +
  width: 100%;
 +
  height: 40px;
 +
  margin: 1em auto 0;
 +
  position: fixed;
 +
  bottom: 20px;
 +
  z-index: 1000;
 +
  text-align: center;
 +
}
 +
 +
#page-nav {
 +
  width: 100%;
 +
  height: 40px;
 +
  margin: 1em auto 0;
 +
  position: fixed;
 +
  bottom: 20px;
 +
  z-index: 1000;
 +
  text-align: center;
 +
}
 +
 +
#page-nav a {
 +
  display: inline-block;
 +
  width: 40px;
 +
  height: 40px;
 +
  text-align: center;
 +
  border-radius: 2px;
 +
  background: #93D1D5;
 +
  color: #fff;
 +
  font-size: 0;
 +
  margin: 2px;
 +
}
 +
 +
.bb-custom-wrapper>nav a {
 +
  display: inline-block;
 +
  width: 40px;
 +
  height: 40px;
 +
  text-align: center;
 +
  border-radius: 2px;
 +
  background: #93D1D5;
 +
  color: #fff;
 +
  font-size: 0;
 +
  margin: 2px;
 +
}
 +
 +
#page-nav a:hover {
 +
  opacity: 0.6;
 +
}
 +
 +
.bb-custom-wrapper>nav a:hover {
 +
  opacity: 0.6;
 +
}
 +
 +
.bb-custom-icon:before {
 +
  font-family: 'arrows';
 +
  speak: none;
 +
  font-style: normal;
 +
  font-weight: normal;
 +
  font-variant: normal;
 +
  text-transform: none;
 +
  line-height: 1;
 +
  font-size: 30px;
 +
  line-height: 40px;
 +
  display: block;
 +
  -webkit-font-smoothing: antialiased;
 +
}
 +
 +
.bb-custom-icon-first:before,
 +
.bb-custom-icon-last:before {
 +
  content: "\e002";
 +
}
 +
 +
.bb-custom-icon-arrow-left:before,
 +
.bb-custom-icon-arrow-right:before {
 +
  content: "\e003";
 +
}
 +
 +
.bb-custom-icon-arrow-left:before,
 +
.bb-custom-icon-first:before {
 +
  -webkit-transform: rotate(180deg);
 +
  transform: rotate(180deg);
 +
}
 +
 +
/* No JS */
 +
.no-js .bb-custom-wrapper {
 +
  height: auto;
 +
}
 +
 +
.no-js .bb-custom-content {
 +
  height: 470px;
 +
}
 +
 +
@media screen and (max-width: 61.75em) {
 +
  .bb-custom-side {
 +
    font-size: 70%;
 +
  }
 +
}
 +
 +
@media screen and (max-width: 33em) {
 +
  .bb-custom-side {
 +
    font-size: 60%;
 +
  }
 +
}
 +
</style>
 +
 +
  
 
<style>
 
<style>
Line 1,645: Line 1,839:
 
(function($){
 
(function($){
 
var isPhantom = /Phantom/.test(navigator.userAgent),
 
var isPhantom = /Phantom/.test(navigator.userAgent),
supportTouch = !isPhantom && "ontouchend" in document,
+
supportTouch = !isPhantom && ("ontouchend" in document),
 
scrollEvent = "touchmove scroll",
 
scrollEvent = "touchmove scroll",
 
// Use touch events or map it to mouse events
 
// Use touch events or map it to mouse events

Revision as of 12:43, 27 October 2020

KSA Korea Wiki Page