Add presentations and new layout (ezsystems#51)

* Add presentations and new layout
ezpublishlegacy · Aug 23, 2018 · fc191f8 · fc191f8
1 parent 6c614cb
commit fc191f8
Show file tree

Hide file tree

Showing 116 changed files with 26,508 additions and 11 deletions.
diff --git a/css/style.css b/css/style.css
@@ -0,0 +1,311 @@
+@import url(https://fonts.googleapis.com/css?family=Maven+Pro:400,500,700,900);
+@import url(https://fonts.googleapis.com/css?family=Roboto);
+
+body {
+    position: relative;
+}
+
+.font-header {
+    font-family: 'Maven Pro', sans-serif;
+    font-weight: 700;
+}
+
+p {
+    font-family: Helvetica, Arial, sans-serif;
+    font-size: 1.25em;
+}
+
+a {
+    color: #f05a22;
+    text-decoration: none;
+    -webkit-backface-visibility: hidden;
+    -webkit-transition: 0.25s;
+    -moz-transition: 0.25s;
+    -o-transition: 0.25s;
+    transition: 0.25s;
+}
+
+a:hover, a:focus {
+    color: #ff8426;
+    text-decoration: none;
+}
+
+::selection {
+    background: #FFA500; /* Safari */
+    color:#fff;
+}
+
+::-moz-selection {
+    background: #FFA500; /* Firefox */
+    color:#fff;
+}
+
+.regular {
+    font-size: 1em;
+}
+
+.list-unstyled li {
+    line-height: 2em;
+}
+
+/*=== Navbar ===*/
+.navbar {
+    height: 4em;
+}
+
+.navbar img {
+    width: 80px;
+    margin-top: -4px;
+}
+
+.navbar h2 {
+    font-family: 'Maven Pro', sans-serif;
+    line-height: .5em;
+}
+
+.ui-header {
+    position: relative;
+    margin-top: -1.4em;
+    font-family: 'Maven Pro', sans-serif;
+    padding: 2em 0;
+    color: #fff;
+    background-color: #ff883e;
+    background-image: linear-gradient(to bottom,#ff883e 0, #f05a22 100%);
+    background-repeat: repeat-x;
+}
+
+.header {
+    text-shadow: 1px 1px rgba(59,59,59,.5);
+    letter-spacing: 1px;
+}
+
+.header-text {
+    padding: 1em 0 .75em 0;
+}
+
+/*=== Right Side NavBar ===*/
+.affix {
+    top: 20px;
+}
+
+.nav {
+    margin-top: 20px;
+    margin-bottom: 20px;
+}
+
+.nav li a {
+    font-weight: bold;
+    color: #3b3b3b;
+}
+
+.nav > .active > a {
+    color: #f05a22;
+}
+
+.nav .active {
+    font-weight: bold;
+}
+
+.nav > li .nav {
+    margin-top: 0px;
+}
+
+.nav .nav {
+    display: none;
+}
+
+.nav .active .nav {
+    display: block;
+}
+
+.nav .nav a {
+    font-weight: normal;
+    font-size: .9em;
+    color: #3b3b3b;
+}
+
+.nav .nav span {
+    margin: 0 5px 0 2px;
+}
+
+.nav .nav .active a,
+.nav .nav .active:hover a,
+.nav .nav .active:focus a {
+    padding-left: 2em;
+    border-left: 4px solid #f05a22;
+    border-radius: 4px;
+    font-weight: bold;
+    background-color: rgba(59,59,59,.15);
+}
+
+.nav .nav .active span,
+.nav .nav .active:hover span,
+.nav .nav .active:focus span {
+    display: none;
+}
+
+.final {
+    margin-top: 3em;
+}
+
+.nav .back-top {
+    margin-left: 1em;
+    color: #3b3b3b;
+    font-weight: bold;
+}
+
+/*=== Content ===*/
+.ui-content-style {
+    padding: 2em 2em 1em 4em;
+}
+
+.content-section {
+    padding-top: 1.5em;
+    padding-bottom: 1.5em;
+}
+
+.sub-section {
+    padding: 2em 3em;
+}
+
+.modules {
+    padding-top: 2em;
+}
+
+.principles {
+    padding-top: 1em;
+}
+
+.text-principles {
+    margin-top: -.5em;
+}
+
+.module-header {
+    font-family: 'Maven Pro', sans-serif;
+    font-weight: 700;
+    text-decoration: underline;
+}
+
+.code {
+    padding: 2px 4px;
+    border-radius: 4px;
+    font-size: 1em;
+    color: #e94b10;
+    background-color: #fce3da;
+}
+
+hr {
+    margin-top: 0;
+    border-top: 1px solid #333;
+}
+
+.flex-wrapper {
+    display: flex;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+    align-content: space-around;
+    margin-bottom: 2rem;
+}
+
+/*==== UTILITIES/HELPERS ====*/
+.top-half-extra {
+    margin-top: 2em;
+}
+
+.top-extra {
+    margin-top: 4em;
+}
+
+.top-low {
+    margin-top: 1.5em;
+}
+
+.top-xlow {
+    margin-top: 1em;
+}
+
+.top-min {
+    margin-top: 0.5em;
+}
+
+.bottom-extra {
+    margin-bottom: 2em;
+}
+
+.bottom-half-extra {
+    margin-bottom: 1.5em;
+}
+
+.u-move-down-xlarge {
+    margin-top: 2em;
+}
+
+.u-move-left-xlarge {
+    margin-left: 2em;
+}
+
+.u-move-left {
+    margin-left: 1em;
+}
+
+.u-move-up-xlarge {
+    margin-top: -2em;
+}
+
+.u-move-up-xsmall {
+    margin-top: -.5em;
+}
+
+/*=== Footer ===*/
+footer {
+    padding-top: 0;
+    padding-bottom: 0;
+    font-size: 15px;
+    z-index: 4;
+}
+
+footer a {
+    font-weight: 300;
+}
+
+footer p {
+    font-size: 15px;
+    line-height: 1em;
+}
+
+footer ul {
+    margin-bottom: 0;
+    padding-left: 0;
+}
+
+footer h4 {
+    color: #fff;
+    font-size: 22px;
+    font-weight: 300;
+}
+
+footer .copyright-content {
+    background: #4b443f;
+    color: #d2c5bd;
+    padding-top: 20px;
+    padding-bottom: 20px;
+    font-weight: 300;
+}
+
+footer .copyright-content a,
+footer .copyright-content a:hover,
+footer .copyright-content a:focus {
+    color: #d69776;
+}
+
+footer .copyright-content ul li {
+    display: inline;
+    list-style-type: none;
+    padding-right: 20px;
+    padding-left: 20px;
+    border-right: 1px solid;
+}
+
+footer .copyright-content ul li:last-child {
+    border: none;
+}
diff --git a/css/typography.css b/css/typography.css
@@ -0,0 +1,44 @@
+@import url('https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i');
+
+body {
+    font-family: 'Noto Sans', sans-serif;
+    font-size: 15px;
+}
+
+h1 {
+    font-size: 2.5em;
+}
+
+h2 {
+    font-size: 2em;
+}
+
+h3 {
+    font-size: 1.75em;
+}
+
+h4 {
+    font-size: 1.5em;
+}
+
+h5 {
+    font-size: 1.25em;
+}
+
+.f-regular {
+    font-weight: 400;
+}
+
+.f-regular-i {
+    font-weight: 400;
+    font-style: italic;
+}
+
+.f-bold {
+    font-weight: 700;
+}
+
+.f-bold-i {
+    font-weight: 700;
+    font-style: italic;
+}