Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

adding event subpage and link leading to zenodo #211

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

adding event subpage and link leading to zenodo #211

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
217 changes: 217 additions & 0 deletions ar-events.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,217 @@
<!DOCTYPE html>
<html lang="en" dir="rtl">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">

<title>OSCSA</title>
<meta content="" name="description">
<meta content="" name="keywords">

<!-- Facebook Opengraph integration: https://developers.facebook.com/docs/sharing/opengraph -->
<meta property="og:title" content="">
<meta property="og:image" content="">
<meta property="og:url" content="">
<meta property="og:site_name" content="">
<meta property="og:description" content="">

<!-- Twitter Cards integration: https://dev.twitter.com/cards/ -->
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="">
<meta name="twitter:title" content="">
<meta name="twitter:description" content="">
<meta name="twitter:image" content="">

<!-- Favicons -->
<link href="assets/img/team/logo1.png" rel="icon">
<link href="assets/img/team/logo1.png" rel="apple-touch-icon">

<!-- Fontawesome -->
<script src="https://kit.fontawesome.com/fb18aad73b.js" crossorigin="anonymous"></script>
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i|Raleway:300,400,500,700,800" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@100;200;400&family=Noto+Kufi+Arabic:wght@300&display=swap" rel="stylesheet">

<!-- Vendor CSS Files -->
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">

<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
<link href="assets/css/arabic.css" rel="stylesheet">

<!-- =======================================================
* Template Name: Imperial - v5.7.0
* Template URL: https://bootstrapmade.com/imperial-free-onepage-bootstrap-theme/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body>
<!-- ======= Header ======= -->
<header id="header" class="d-flex align-items-center">
<div class="container d-flex align-items-center justify-content-between">

<nav id="navbar" class="navbar">
<ul>
<li><a class="nav-link scrollto" href="ar-index.html">الرئيسية</a></li>
<li><a class="nav-link scrollto" href="ar-index.html">من نحن</a></li>
<li><a class="nav-link scrollto" href="ar-index.html">ماهي العلوم المفتوحة</a></li>
<li><a class="nav-link scrollto" href="ar-index.html">توصيات اليونسكو</a></li>
<li><a class="nav-link scrollto" href="ar-index.html">نشاطاتنا التعليمية</a></li>
<li><a class="nav-link scrollto" href="ar-index.html">المدونة</a></li>
<li><a class="nav-link scrollto" href="ar-index.html">تواصل معنا</a></li>
<li><a class="nav-link scrollto active" href="#events">Events</a></li>
<li><a href="events.html"><i class="bi bi-globe"></i>EN </a></li>
</ul>
</nav><!-- .navbar -->

<a href="index.html" class="logo mr-auto"><img src="assets/img/landing/logo1.webp" alt=""></a>
<!-- Uncomment below if you prefer to use a text logo -->
<!-- <h1 class="logo mr-auto"><a href="index.html">OSCSA</a></h1> -->


</div>
</header><!-- End Header -->

<main>
<section id="events">
<div class="container">
<div class="row">
<h3 class="section-title">Events</h3>
<div class="section-title-divider"></div>
<div class="event-items">

<a href="https://zenodo.org/record/7123473#.Y0SJAFLMLIU" target="_blank">
<div class="event-card">
<div class="event-image">
<img src="assets/img/Capture1.PNG" alt="" srcset="">
</div>
<div class="event-name">
<p>Presentation</p>
</div>
<div class="event-title">
<h2>Leveraging Open Science in Machine Learning and Bioinformatics</h2>
<p class="event-details">September 29, 2022</p>
</div>
<div class="event-speaker">
<p class="event-details">Speaker:</p>
<h4>Batool Almarzouq</h4>
</div>
<div class="event-language">
<p class="event-details">Langauge:</p>
<h5>English</h5>
</div>
</div>
</a>
<a href="https://zenodo.org/record/6988763#.Y0SfuFLMLIU" target="_blank">
<div class="event-card">
<div class="event-image">
<img src="assets/img/Capture2.PNG" alt="" srcset="">
</div>
<div class="event-name">
<p>Presentation</p>
</div>
<div class="event-title">
<h2>Demystifying the Command line</h2>
<p class="event-details">August 13, 2022</p>
</div>
<div class="event-speaker">
<p class="event-details">Speaker:</p>
<h4>Batool Almarzouq</h4>
</div>
<div class="event-language">
<p class="event-details">Langauge:</p>
<h5>Arabic</h5>
</div>
</div>
</a>
<a href="https://zenodo.org/record/6796234" target="_blank">
<div class="event-card">
<div class="event-image">
<img src="assets/img/Capture3.PNG" alt="" srcset="">
</div>
<div class="event-name">
<p>Presentation</p>
</div>
<div class="event-title">
<h2>Beginners Guide for R through Open Data Science Practices</h2>
<p class="event-details">July 2, 2022</p>
</div>
<div class="event-speaker">
<p class="event-details">Speakers:</p>
<h4> Batool Almarzouq; Hussain Alsalman; Abulrahman Alswaji; and others</h4>
</div>
<div class="event-language">
<p class="event-details">Langauge:</p>
<h5>Arabic</h5>
</div>
</div>
</a>
</div>
</div>
</div>
</section>
</main>















<!-- ======= Footer ======= -->
<footer id="footer">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="copyright">
Get in touch:
<a href=""><i class="bi bi-twitter"></i></a>
<a href=""><i class="bi bi-linkedin"></i></a>
<a href=""><i class="bi bi-github"></i></a> <br>
The website content is licensed CC-BY 4.0. <br>
Powered by Imperial Theme from <a href="https://bootstrapmade.com/">BootstrapMade</a><br>
If you want to report a problem in the wesbite, please open an issue on <a href="https://github.com/Open-Science-Community-Saudi-Arabia/OSCSA_Website">our GitHub repository</a>.<br>
</div>
<div class="credits">
<!--
All the links in the footer should remain intact.
You can delete the links only if you purchased the pro version.
Licensing information: https://bootstrapmade.com/license/
Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/buy/?theme=Imperial
-->
<!-- Designed by -->
</div>
</div>
</div>
</div>
</footer><!-- End Footer -->
<div id="preloader"></div>
<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>

<!-- Vendor JS Files -->
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/typed.js/typed.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>

<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
1 change: 1 addition & 0 deletions ar-index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@ <h2>نحن نُعزِز <span class="typed" data-typed-items="النمو الأ
<li><a class="nav-link scrollto" href="#testimonials">توصيات اليونسكو</a></li>
<li><a class="nav-link scrollto" href="#materilas">نشاطاتنا التعليمية</a></li>
<li><a class="nav-link scrollto" href="#contact">تواصل معنا</a></li>
<li><a class="nav-link scrollto" href="events.html">Events</a></li>
<li><a href="index.html"><i class="bi bi-globe"></i>EN </a></li>
</ul>
<i class="bi bi-list mobile-nav-toggle"></i>
Expand Down
98 changes: 98 additions & 0 deletions assets/css/arabic.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,3 +66,101 @@ body {
padding-top: 3cm;
/* padding-bottom: 30px; */
}
}
/* Event */
#events{
background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../img/services-bg.jpeg) fixed center center;
background-size: cover;
min-height: 80vh;
}
.event-items{
margin: 0 1rem;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: .3rem;
}

#events .event-card{
transform: translateY(0);
animation: appear 2s forwards ease-in-out;
max-height: 100%;
min-height: 345px;
width: 297px;
border-radius: 10px;
box-shadow: 1px 1px 1px grey;
margin: 0.2rem .3rem;
transform-origin: center;
transition: transform 2s;
}
.event-image{
margin-right: 0 !important;
width: 100%;
height: 100%;
}
.event-image img{
width: 103%;
height: 100%;
}
#events .event-card:hover{
transform: translateY(-1rem) !important;
}
@keyframes appear {
0%{
transform: scale(0);
}
100%{
transform: scale(1);
}

}
.event-card div{
display: flex;
margin: .9rem .5rem 1rem 1rem;
}
.event-card .event-name p{
padding: .4rem .8rem;
text-transform: uppercase;
font-weight: 800;
border: none;
background-color: #03C4EB;
color: #fff;
border-radius: 18px;
margin-bottom: .1rem;
}
.event-card .event-title, .event-speaker, .event-language{
display: flex;
flex-direction: column;
margin-top: .3rem !important;
margin-bottom: .2rem !important;
}

.event-card .event-title h2{
margin: .1rem 0;
font-size: 1000;
color: #111;
}
.event-card .event-details{
font-weight: 800;
font-size: 70%;
color: gray;
margin-bottom: .1rem;
}
.event-speaker h4{
margin-bottom: .1rem;
color: #111;
font-weight: 800;
font-size: 90%;
}
.event-language h5{
margin-bottom: .1rem;
color: #111;
font-weight: 500;
}
@media screen and (max-width: 996px) {
.event-items{
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
}
Loading