Merge pull request #2 from dis-delft/rowdy/initial-redesign

Initial Redesign
dis-delft · Jun 24, 2024 · 78656b4 · 78656b4
2 parents a4b233f + 187c912
commit 78656b4
Show file tree

Hide file tree

Showing 7 changed files with 191 additions and 64 deletions.
diff --git a/_includes/filter-people.html b/_includes/filter-people.html
@@ -36,35 +36,44 @@
     {% endif %}
 
     <div class="col-lg-4 col-md-6">
-        <div class="blockquote-box blockquote-people animated {{animationType}} clearfix">
-            <div class="square pull-left">
-                {% if people.image contains 'http://' or people.image contains 'https://' %}
-                <div class="person-image" style="background-image:url('{{ people.image }}')"></div>
-                {% else %}
-                <div class="person-image" style="background-image:url('{{ site.baseurl }}/assets/img/people/{{ people.image }}')"></div>
-                {% endif %}
-            </div>
-            <h4>
-                <a class="people-item-name" href="{{site.baseurl}}{{people.url}}">{{people.name}}</a>
-            </h4>
-
-            <p>
-                {{people.role}} {% if people.team contains 'cel' %} @ CEL {% endif %}
-            </p>
 
-            <p>
-                Room {{people.office}}
-                <a href="mailto:{{people.email}}" target="_blank">{{people.email}}</a>
-                <br>
-                {% assign empty_linkedin = people.linkedin | strip %}
-                {% unless empty_linkedin == '' %}
-                <a class="pr-2" href="{{people.linkedin}}"
-                    target="_blank" title="LinkedIn">
+        <div class="card animated {{animationType}}">
+            <div class="card-header clearfix">
+                <div class="square pull-left">
+                    {% if people.image contains 'http://' or people.image contains 'https://' %}
+                    <div class="person-image" style="background-image:url('{{ people.image }}')"></div>
+                    {% else %}
+                    <div class="person-image"
+                         style="background-image:url('{{ site.baseurl }}/assets/img/people/{{ people.image }}')"></div>
+                    {% endif %}
+                </div>
+                <div class="text-left">
+                    <h4>
+                        <a class="people-item-name" href="{{site.baseurl}}{{people.url}}">{{people.name}}</a>
+                    </h4>
+                    <p>{{people.role}} {% if people.team contains 'cel' %} @ CEL {% endif %}</p>
+                </div>
+            </div>
+            <div class="card-body text-center">
+                <p>{{people.office}}</p>
+                <p>
+                    <a href="mailto:{{people.email}}" target="_blank"><i class="fa-solid fa-lg fa-envelope"></i></a>
+                    {% assign empty_linkedin = people.linkedin | strip %}
+                    {% unless empty_linkedin == '' %}
+                    | <a href="{{people.linkedin}}"
+                         target="_blank" title="LinkedIn">
                     <i class="fa-brands fa-lg fa-linkedin"></i>
-                </a>
-                {% endunless %}
-            </p>
-
+                    </a>
+                    {% endunless %}
+                    {% assign empty_github = people.github | strip %}
+                    {% unless empty_github == '' %}
+                    | <a href="{{people.github}}"
+                         target="_blank" title="GitHub">
+                    <i class="fa-brands fa-lg fa-github"></i>
+                    </a>
+                    {% endunless %}
+                </p>
+            </div>
         </div>
 
     </div>

diff --git a/_people/chotkan.md b/_people/chotkan.md
@@ -0,0 +1,61 @@
+---
+# !!!!
+# The NAME of the file should be your LASTNAME (e.g. houben.md)
+# Do NOT delete any field, only fill in the required information
+# !!!! 
+
+# Your full name (Firstname, Lastname)
+name: Rowdy Chotkan
+
+# The members are displayed in a hierarchical way, so please choose the role (e.g. Full Professor, Assistant Professor etc) 
+# and filter number (e.g. 1, 2, 3) from this list and fill in the role and filter from below:
+
+# (Affiliated) Full Professor - 1
+# Associate Professor - 2
+# Assistant Professor - 3
+# Postdoctoral Researcher - 4
+# PhD Candidate - 5
+# Research Engineer - 6 
+# Guest Researcher - 7
+# Secretary - 8
+role: PhD Candidate
+filter: 5
+
+# same as filter
+theme-filter: 5
+
+# choose your team(s) from the following list: delta, kappa, epsilon, lambda, cel
+team: []
+
+# provide social URLs (if any)
+linkedin: https://www.linkedin.com/in/rowdy-chotkan/
+twitter: 
+github: https://github.com/InvictusRMC
+
+# look for your image here: https://github.com/dis-delft/dis-delft.github.io/tree/master/assets/img/people 
+# if your image doesn't exist, upload it in assets/img/people 
+# write the exact name of the image as it appears in GitHub  
+image: chotkan.jpg
+
+# the TUD email address
+email: [email protected]
+
+# Room number (e.g Room - 840 West 4rd floor)
+office: 1E400
+
+# The name of this file with .html extension instead of .md (If the filename is ionescu.md, the "back" field will be ionescu.html)
+back: 
+
+# Go to https://purexml-open.ewi.tudelft.nl 
+# choose Query Type = Person, search term = your name, Style = as a list
+# generate url and copy the link in the publications_link field below
+publications_link: 
+
+---
+
+## About
+
+
+
+
+
diff --git a/_people/template.md b/_people/template.md
@@ -32,15 +32,15 @@ linkedin:
 twitter: 
 github: 
 
-# look for your image here: https://github.com/wis-delft/wis-delft.github.io/tree/master/assets/img/people 
+# look for your image here: https://github.com/dis-delft/dis-delft.github.io/tree/master/assets/img/people 
 # if your image doesn't exist, upload it in assets/img/people 
 # write the exact name of the image as it appears in GitHub  
 image: member1.png
 
 # the TUD email address
 email: 
 
-# Room number (e.g Room - 840 West 4rd floor)
+# Room number (e.g., 840 West 4rd floor)
 office: 
 
 # The name of this file with .html extension instead of .md (If the filename is ionescu.md, the "back" field will be ionescu.html)

diff --git a/assets/css/style.css b/assets/css/style.css
@@ -1267,3 +1267,56 @@ header {
 header h1 {
     padding-top: 140px;
 }
+
+/* Card */
+.card {
+    background-color: white;
+    border-radius: 15px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    padding: 15px;
+    margin: 10px 0;
+    height: 275px; /* Enforcing a fixed height for all cards */
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+
+p {
+    margin-bottom: 0px;
+}
+
+}
+.person-image {
+    width: 100px;
+    height: 150px;
+    background-size: cover;
+    background-position: top;
+    border-radius: 10px;
+    margin-right: 15px;
+}
+
+.card-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 15px;
+    padding: 12px;
+}
+
+.card-body {
+    padding-top: 0;
+    flex-grow: 1;
+}
+
+.people-item-name {
+    color: #333;
+    text-decoration: none;
+    font-size: 1.2em;
+    margin-bottom: 5px;
+}
+
+.people-item-name:hover {
+    text-decoration: underline;
+}
+
+.card-footer a {
+    margin-right: 10px;
+}
diff --git a/assets/img/people/Chotkan.jpg b/assets/img/people/Chotkan.jpg
diff --git a/index.html b/index.html
@@ -8,42 +8,46 @@ <h1 class="container text-white">Data-Intensive Systems</h1>
 </header>
 
 <div class="container">
-  <div class="margin-top-4 margin-bottom-2">
-    <p>
-      The Data-Intensive Systems (DIS) group is one of the sections of the
-      Department of Software Technology (ST) of the Faculty Electrical
-      Engineering, Mathematics, and Computer Science (EEMCS) of Delft University
-      of Technology. Until 2023, the DIS group was called the Distributed
-      Systems (DS) group.
-    </p>
+    <div class="margin-top-4 margin-bottom-2">
+        <p>
+            The Data-Intensive Systems (DIS) group is one of the sections of the
+            Department of Software Technology (ST) of the Faculty Electrical
+            Engineering, Mathematics, and Computer Science (EEMCS) of Delft University
+            of Technology. Until 2023, the DIS group was called the Distributed
+            Systems (DS) group.
+        </p>
 
-    <p>
-      The <strong>mission</strong> of the DiS group is to model, design,
-      implement, and analyze distributed systems and algorithms. Its
-      <strong>research</strong> is fundamental, aimed at the development and
-      evaluation of new generic concepts in systems software, and
-      application-driven, motivated by important application areas, such as
-      e-science, big data processing, blockchains, large-scale machine learning,
-      and online social networks. Much of it is experimental, validating the
-      proposed new concepts by means of implementation and deployment in
-      prototypes that are used in the real world. The
-      <strong>two research areas</strong> of the DIS group are
-      <strong>distributed machine-learning systems</strong> and
-      <strong>cooperative systems</strong> (with a strong focus on
-      <strong>blockchain technology</strong>). The Section Data-Intensive
-      Systems leads the
-      <a href="http://www.tudelft.nl/delft-blockchain-lab" target="_blank"
-        >Delft Blockchain Lab</a
-      >.
-    </p>
+        <p>
+            The <strong>mission</strong> of the DiS group is to model, design,
+            implement, and analyze distributed systems and algorithms. Its
+            <strong>research</strong> is fundamental, aimed at the development and
+            evaluation of new generic concepts in systems software, and
+            application-driven, motivated by important application areas, such as
+            e-science, big data processing, blockchains, large-scale machine learning,
+            and online social networks. Much of it is experimental, validating the
+            proposed new concepts by means of implementation and deployment in
+            prototypes that are used in the real world. The
+            <strong>two research areas</strong> of the DIS group are
+            <strong>distributed machine-learning systems</strong> and
+            <strong>cooperative systems</strong> (with a strong focus on
+            <strong>blockchain technology</strong>). The Section Data-Intensive
+            Systems leads the
+            <a href="http://www.tudelft.nl/delft-blockchain-lab" target="_blank"
+            >Delft Blockchain Lab</a
+            >.
+        </p>
 
-    <p>
-      The <strong>teaching</strong> of the DIS group consists of BSc courses on
-      networks and operating systems, and of MSc courses on Blockchain
-      Engineering, Cloud Computing, Distributed Algorithms, Distributed Systems
-      and Performance Analysis of Computer Systems.
-    </p>
-  </div>
+        <p>
+            The <strong>teaching</strong> of the DIS group consists of BSc courses on
+            networks and operating systems, and of MSc courses on Blockchain
+            Engineering, Cloud Computing, Distributed Algorithms, Distributed Systems
+            and Performance Analysis of Computer Systems.
+        </p>
+    </div>
+
+    <div class="margin-top-4 margin-bottom-2 text-center">
+        <img style="height: 250px" src="assets/img/dis-logo.png" class="img-fluid" alt="DIS Logo">
+    </div>
 </div>
 
 <!--End Main Container -->
diff --git a/people.html b/people.html
@@ -7,7 +7,7 @@
 <div class="container">
     <div class="row justify-content-center">
         <div class="services-header">
-            <h2 class="services-header-title">Our {{page.title}}</h2>
+            <h2 class="services-header-title">OUR TEAM</h2>
         </div>
     </div>