Skip to content

GitLab

Commit bba0d039 authored by Elias2049's avatar Elias2049 Committed by Artemiy
Browse files

CSS menu and timeline

parent 6ce283b2
Show whitespace changes
Inline Side-by-side
Showing with 104 additions and 29 deletions
src/blog.ml
View file @ bba0d039
......@@ -281,31 +281,26 @@ let links_to_home_pages =
Format.sprintf
{|
<div class="row">
<div class="col-6 col-lg-4" align="left">
<p class="toplinks2">
<div class="col-4">
<p class="toplinks">
<a href="/blog">
Home
</a>
</p>
<p class="toplinks">
<img class="blogimg" src="/blog/assets/img/icon_home.svg"/>
</a>
</p>
</div>
<div class="col-6 col-lg-4" align="center">
<div class="col-4">
<p class="toplinks">
<a href="/blog/feed">
<img class="blogimg" src="/blog/assets/img/icon_atom_feed.svg"/>
</a>
</p>
</div>
<div class="col-6 col-lg-4" align="right">
<p class="toplinks3">
<img class="blogimg" src="/blog/assets/img/icon_categories.svg"/>
</p>
<div class="col-4">
<p class="toplinks">
<a href="/blog/category">
Categories
</p>
<img class="blogimg" src="/blog/assets/img/icon_categories.svg"/>
</a>
</p>
</div>
......
src/content/assets/css/style.css
View file @ bba0d039
......@@ -35,6 +35,7 @@ p img {
font-size: 1em;
font-family: 'Fontin';
margin-left: 10px;
text-align: center;
}
.toplinks2 {
......@@ -236,6 +237,82 @@ img.feed {
}
/*************** Navbar Elements *********************/
/* Remove border from toggler */
.navbar-toggler {
border: 0;
}
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
outline: none;
box-shadow: none;
border: 0;
}
/* Lines of the Toggler */
.toggler-icon{
width: 30px;
height: 3px;
background-color: #e74c3c;
display: block;
transition: all 0.2s;
}
/* Adds Space between the lines */
.middle-bar{
margin: 5px auto;
}
/* State when navbar is opened (START) */
.navbar-toggler .top-bar {
transform: rotate(45deg);
transform-origin: 10% 10%;
}
.navbar-toggler .middle-bar {
opacity: 0;
filter: alpha(opacity=0);
}
.navbar-toggler .bottom-bar {
transform: rotate(-45deg);
transform-origin: 10% 90%;
}
/* State when navbar is opened (END) */
/* State when navbar is collapsed (START) */
.navbar-toggler.collapsed .top-bar {
transform: rotate(0);
}
.navbar-toggler.collapsed .middle-bar {
opacity: 1;
filter: alpha(opacity=100);
}
.navbar-toggler.collapsed .bottom-bar {
transform: rotate(0);
}
/* State when navbar is collapsed (END) */
/* Color of Toggler when collapsed */
.navbar-toggler.collapsed .toggler-icon {
background-color: white;
}
.dropdown-menu {
background-color: #69abbf;
}
.dropdown-menu-dark .dropdown-item {
color: white;
}
/************** Navbar Elements **************************/
/**************Animation File Start Here (animate.css)****************/
/**************Copy and Save this in another file (animate.css)****************/
......@@ -1977,8 +2054,8 @@ img.feed {
}
#timeline .timeline-movement .timeline-item .timeline-panel.credits .timeline-panel-ul .righting-wrap {
float: left;
width: 70%;
height: 130px;
width: 75%; /*70%*/ /*75%*/
height: 325px; /*250px*/ /*325px*/
padding: 0 12px 0 0;
display: flex;
flex-direction: column;
......
src/content/index.md
View file @ bba0d039
......@@ -227,7 +227,7 @@ We cater to very specific needs. For example, we can translate a “black box”
</div>
<div class="righting-wrap">
<li><a href="#" class="importo">April 1, 2011</a></li>
<li><span class="causale" style="color:#000; font-weight: 600;">OcamlPro is founded </span> </li>
<li><span class="causale" style="color:#000; font-weight: 600;">OCamlPro is founded </span> </li>
<li><span class="causale">OCamlPro is founded to help spread the OCaml language in the industry. <br>
Fabrice le Fessant, a researcher and member of the French Inria Institute, founds OCamlPro to boost the development of OCaml and promote it in the industry.</span> </li>
</div>
......@@ -251,8 +251,8 @@ We cater to very specific needs. For example, we can translate a “black box”
</div>
<div class="righting-wrap">
<li><a href="#" class="importo">May 1, 2011</a></li>
<li><span class="causale" style="color:#000; font-weight: 600;">Long-term collaboration with Jane Street on Ocaml tooling </span> </li>
<li><span class="causale">Jane Street supports the diffusion of Ocaml, and becomes OcamlPro's most important client.</span> </li>
<li><span class="causale" style="color:#000; font-weight: 600;">Long-term collaboration with Jane Street on OCaml tooling </span> </li>
<li><span class="causale">Jane Street supports the diffusion of OCaml, and becomes OCamlPro's most important client.</span> </li>
</div>
<div class="clear"></div>
</ul>
......@@ -274,8 +274,8 @@ We cater to very specific needs. For example, we can translate a “black box”
</div>
<div class="righting-wrap">
<li><a href="#" class="importo">February 28, 2012</a></li>
<li><span class="causale" style="color:#000; font-weight: 600;">OcamlPro contributes Open Source developer tools under the codename TypeRex! </span> </li>
<li><span class="causale">The TypeRex programming studio is a set of open source tools for developing applications in Ocaml.</span> </li>
<li><span class="causale" style="color:#000; font-weight: 600;">OCamlPro contributes Open Source developer tools under the codename TypeRex! </span> </li>
<li><span class="causale">The TypeRex programming studio is a set of open source tools for developing applications in OCaml.</span> </li>
</div>
<div class="clear"></div>
</ul>
......@@ -303,7 +303,7 @@ We cater to very specific needs. For example, we can translate a “black box”
<div class="righting-wrap">
<li><a href="#" class="importo">March 1, 2013</a></li>
<li><span class="causale" style="color:#000; font-weight: 600;">First official release of OPAM 1.0 </span> </li>
<li><span class="causale">The Ocaml Package Manager is officially released as OPAM 1.0. </span> </li>
<li><span class="causale">The OCaml Package Manager is officially released as OPAM 1.0. </span> </li>
</div>
<div class="clear"></div>
</ul>
......@@ -326,7 +326,7 @@ We cater to very specific needs. For example, we can translate a “black box”
<div class="righting-wrap">
<li><a href="#" class="importo">December 1, 2014</a></li>
<li><span class="causale" style="color:#000; font-weight: 600;">Release of the Flambda optimizing compiler </span> </li>
<li><span class="causale">The first Flambda is proposed into Ocaml by Pierre Chambart and Mark Shinwell in PR #132 - work funded by Jane Street. </span> </li>
<li><span class="causale">The first Flambda is proposed into OCaml by Pierre Chambart and Mark Shinwell in PR #132 - work funded by Jane Street. </span> </li>
<li><p><small class="text-muted"><i class="glyphicon glyphicon-time"></i> 11/01/2018, 13:05"</small></p> </li>
</div>
<div class="clear"></div>
......@@ -349,7 +349,7 @@ We cater to very specific needs. For example, we can translate a “black box”
</div>
<div class="righting-wrap">
<li><a href="#" class="importo">July 1, 2015</a></li>
<li><span class="causale" style="color:#000; font-weight: 600;">Université Paris 7 appoints OcamlPro to implement the exercise platform of the Ocaml MOOC on France Université Numérique</span> </li>
<li><span class="causale" style="color:#000; font-weight: 600;">Université Paris 7 appoints OCamlPro to implement the exercise platform of the OCaml MOOC on France Université Numérique</span> </li>
<li><span class="causale">OCamlPro implements the first version of the exercise autocorrecting platform of the OCaml MOOC on France Université Numérique for Université Paris 7, based on TryOCaml, integrates to the OpenEDX/FUN and designs some of the exercices of the course, in close collaboration with Roberto Di Cosmo and Yann-Régis Gianas at Irill.</span> </li>
</div>
<div class="clear"></div>
......
src/content/template.html
View file @ bba0d039
......@@ -6,23 +6,26 @@
<meta name="description" content="![description]" />
<meta name="keywords" content="![keywords]" />
<link rel="icon" type="image/svg+xml" href="/assets/img/logo_ocp_icon.svg">
<link href="/assets/css/bootstrap.min.css" rel="stylesheet" />
<link href="/assets/css/prism.css" rel="stylesheet" />
<link href="/assets/css/bootstrap.min.css" rel="stylesheet">
<link href="/assets/css/prism.css" rel="stylesheet">
<link href="/assets/css/style.css" rel="stylesheet">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<header>
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<nav class="navbar navbar-expand-lg navbar-dark fixed-top bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/"><img src="/assets/img/logo_ocamlpro.png" alt="OCamlPro" height="42" /></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse"
aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
<button class="navbar-toggler collapsed" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<span class="toggler-icon top-bar"></span>
<span class="toggler-icon middle-bar"></span>
<span class="toggler-icon bottom-bar"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav me-auto mb-2 mb-md-0">
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="/research-and-development">R&amp;D</a>
</li>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment