add BOD

consiglio-direttivo.php

@@ -3,21 +3,32 @@
         <div class="section-title">Consiglio Direttivo</div>
     </div>
 
-    <div class="col-12 file-list">
-       <div class="item-title pt-4">
-            <div class=" row">
-                <div class="title col-6 col-sm-8 font-bold">nome del file</div>
-                <div class="size col-2 font-bold">dimensione</div>
-                <div class="date text-right col-4 col-sm-2 font-bold">ultima mod.</div>
+    <div class="col-11 mx-auto">
+        <?php
+            $q=mysqli_query($conn,"SELECT * FROM bod ORDER BY priority, name");
+            while($r=mysqli_fetch_array($q)){
+        ?>
+        
+        <div class="row bod my-4">
+            <div class="col-1 pl-0">
+              <a class="cboxElement" href="<?= $r['avatar'];?>">
+                <img class="avatar" src="<?= $r['avatar'];?>">
+              </a>
+            </div>
+            <div class="col-4">
+              <?= $r['role'];?>
             </div>
+            <div class="col-2">
+              <?= $r['title'];?>
             </div>
+            <div class="col-5">
+              <?= $r['name'];?>
+            </div>
+        </div>
+          
         <?php
-            $q=mysqli_query($conn,"SELECT * FROM files WHERE path='/docs/modulistica/pubblica'");
-            while($r=mysqli_fetch_array($q)){
-                item_file($r);
             }
         ?>
     </div>
 </div>
 
-<a class="cboxElement" href="/images/male.png">dsafg</a>

css/styles.css

@@ -14478,8 +14478,28 @@ a.text-gray-dark:focus, a.text-gray-dark:hover {
   cursor: pointer;
 }
 
-/*.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
-.cboxIframe{background:#fff; width:100%; height:100%; display:block; border:0; padding:0; margin:0;}*/
+/* line 58, colorbox.scss */
+.cboxPhoto {
+  float: left;
+  margin: auto;
+  border: 0;
+  display: block;
+  max-width: none;
+  -ms-interpolation-mode: bicubic;
+  border-radius: 5px;
+}
+
+/* line 59, colorbox.scss */
+.cboxIframe {
+  background: #fff;
+  width: 100%;
+  height: 100%;
+  display: block;
+  border: 0;
+  padding: 0;
+  margin: 0;
+}
+
 /* line 60, colorbox.scss */
 #colorbox,
 #cboxContent,
@@ -14498,7 +14518,7 @@ a.text-gray-dark:focus, a.text-gray-dark:hover {
 #cboxContent {
   background: #fff;
   overflow: hidden;
-  border: 10px solid #4e984a;
+  border: 10px solid white;
   border-radius: 15px;
   padding: 5px;
 }
@@ -14568,7 +14588,7 @@ a.text-gray-dark:focus, a.text-gray-dark:hover {
   content: '\f057';
   font-family: 'FontAwesome';
   font-size: 20px;
-  color: #4e984a;
+  color: black;
 }
 
 /* line 143, colorbox.scss */
@@ -15282,6 +15302,16 @@ header .breadcrumb .container .crumbs a:hover {
   padding: 8px 10px;
 }
 
+/* line 2, sections/bod.scss */
+.bod {
+  border-bottom: 1px solid #d1efb5;
+}
+/* line 5, sections/bod.scss */
+.bod .avatar {
+  max-width: 40px;
+  max-height: 40px;
+}
+
 @media only screen and (min-width: 768px) {
   /* line 5, mediaqueries/viewports/_768up.scss */
   header {

scss/colorbox.scss

@@ -55,8 +55,8 @@
   cursor:pointer;
 }
 
-/*.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
-.cboxIframe{background:#fff; width:100%; height:100%; display:block; border:0; padding:0; margin:0;}*/
+.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;border-radius: 5px;}
+.cboxIframe{background:#fff; width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
 #colorbox, 
 #cboxContent, 
 #cboxLoadedContent{
@@ -72,7 +72,7 @@
 #cboxContent{
   background:#fff; 
   overflow:hidden; 
-  border: 10px solid $green; 
+  border: 10px solid white; 
   border-radius: 15px;
   padding: 5px;
 }
@@ -134,7 +134,7 @@
     content: '\f057';
     font-family: 'FontAwesome';
     font-size: 20px;
-    color: $green;
+    color: black;
   }
   
 }

scss/sections/bod.scss

@@ -0,0 +1,9 @@
+
+.bod{
+  border-bottom: 1px solid $light-grey;
+  
+  .avatar{
+    max-width: 40px;
+    max-height: 40px;
+  }
+} 

scss/sections/sections.scss

@@ -2,3 +2,4 @@
 @import "homepage"; 
 @import "news"; 
 @import "lists"; 
+@import "bod";