blog.html

<!doctype html>
<html lang="en">
  <head>
   <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/all.min.css">
    <link rel="stylesheet" href="css/varnalab.css">
    <link rel="preconnect" href="https://fonts.gstatic.com">
		<title>VarnaLab v2</title>
  </head>
  <body>
  	<header>
  		<div class="container">
  			<div class="row">
  				<div class="col">
						<nav class="navbar navbar-expand-md navbar-dark">
						    <a class="navbar-brand" href="#">
					     		<!-- <img src="img/varnalab_logo_small.png"> -->
					     		<img src="img/varnalab_logo_small_text.png" alt="">
						    </a>
						    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown">
						        <span class="navbar-toggler-icon"></span>
						    </button>
						    <div class="collapse navbar-collapse" id="navbarNavDropdown">
						        <ul class="navbar-nav justify-content-end ml-auto">
								      <li class="nav-item active">
								        <a class="nav-link" href="index.html"><i class="fas fa-flask"></i> За VarnaLab</a>
								      </li>
								      <li class="nav-item">
								        <a class="nav-link" href="#"><i class="fas fa-calendar-alt"></i> Събития</a>
								      </li>
								      <li class="nav-item">
								        <a class="nav-link" href="blog.html"><i class="far fa-newspaper"></i></i> Блог</a>
								      </li>
								      <li class="nav-item dropdown">
								        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								          <i class="fas fa-project-diagram"></i> Връзки
								        </a>
								        <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
								          <a class="dropdown-item" href="#"><i class="fas fa-info-circle"></i> ЧЗВ</a>
								          <a class="dropdown-item" href="#"><i class="fas fa-book"></i> Правила</a>
								          <a class="dropdown-item" href="#"><i class="fas fa-users"></i> Лабъри</a>
								        </div>
								      </li>
								      <li class="nav-item">
								        <a class="nav-link" href="#"><i class="fas fa-hand-holding-usd"></i> Дарения</a>
								      </li>
								      <li class="nav-item">
								        <a class="nav-link" href="#"><i class="fas fa-map-marker-alt"></i> Контакти</a>
								      </li>
								      <li class="nav-item dropdown">
								        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
								          <i class="fas fa-user-alt"></i> ГОСТ
								        </a>
								        <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
														<form>
														  <div class="form-group">
														    <label for="InputEmail1">Въведи Email</label>
														    <input type="email" class="form-control" id="InputEmail1" aria-describedby="emailHelp">
														  </div>
														  <div class="form-group">
														    <label for="InputPassword1">Въведи Парола</label>
														    <input type="password" class="form-control" id="InputPassword1">
														  </div>
														  <button type="submit" class="btn btn-dark">Вход</button>
														</form>
														<p class="userOptions">
														  <a class="dropdown-item" href="#"><i class="fas fa-user-plus"></i> Нова регистрация</a>
														  <a class="dropdown-item" href="#"><i class="fas fa-key"></i> Забравена парола?</a>
														</p>
								        </div>
								      </li>
								      <li class="nav-item">
								        <a class="nav-link" href="#"><img src="img/en_flag.png" alt=""></a>
								      </li>
						        </ul>
						    </div>
						</nav>  					
  				</div>
  			</div>
  		</div>
		</header>
		<div class="bg">
			<div class="overlay"></div>
			<div class="gradient"></div>	
		</div>
		<main>
			<div class="container">
			  <div class="row">
			    <div class="col-9">
						<article class="blog">
							<div class="d-flex">
								<div class="number align-self-start mr-2"><span>01</span> 11.2020</div>
									<div class="trend-contents">
									<h2><a href="blog-single.html">Какво е VarnaLab?</a></h2>
									<div class="post-meta">
										<span class="d-block">Написано от от <a href="#">Гост Гостов</a> в <a href="#">Новини</a></span>
									</div>
								</div>
							</div>
							<hr>
              <div class="section-item">
                <p>
                  VarnaLab е създаден на 15.06.2011г. и е част от хакерспейс мрежата на
                  <a href="http://hackerspaces.org/">hackerspaces.org</a>,
                  като според wiki страницата им, по света има над 2300 такива места,
                  а в България те са 5-6 и могат да се видят в
                  <a href="https://wiki.hackerspaces.org/Bulgaria">списъка с хакерспейси в България</a>.
                </p>
                <div class="hackermaps">
                  <a href="https://wiki.hackerspaces.org/List_of_ALL_Hacker_Spaces" title="хакерспейси по света">
                    <img src="img/hackerspacesWorldwide.jpg" alt="хакерспейси по света" width="100%">
                  </a>
                </div>
              </div>
              <div class="text-right">
             		<button type="button" class="btn btn-dark mt-2">Прочети още</button>             	
              </div>
            </article>
						<article class="blog">
							<div class="d-flex">
								<div class="number align-self-start mr-2"><span>01</span> 11.2020</div>
									<div class="trend-contents">
									<h2><a href="blog-single.html">Какво е VarnaLab?</a></h2>
									<div class="post-meta">
										<span class="d-block">Написано от от <a href="#">Гост Гостов</a> в <a href="#">Новини</a></span>
									</div>
								</div>
							</div>
							<hr>
              <div class="section-item">
                <p>
                  VarnaLab е създаден на 15.06.2011г. и е част от хакерспейс мрежата на
                  <a href="http://hackerspaces.org/">hackerspaces.org</a>,
                  като според wiki страницата им, по света има над 2300 такива места,
                  а в България те са 5-6 и могат да се видят в
                  <a href="https://wiki.hackerspaces.org/Bulgaria">списъка с хакерспейси в България</a>.
                </p>
                <div class="hackermaps">
                  <a href="https://wiki.hackerspaces.org/List_of_ALL_Hacker_Spaces" title="хакерспейси по света">
                    <img src="img/hackerspacesWorldwide.jpg" alt="хакерспейси по света" width="100%">
                  </a>
                </div>
              </div>
              <div class="text-right">
             		<button type="button" class="btn btn-dark mt-2">Прочети още</button>             	
              </div>
            </article>
						<nav aria-label="Page navigation">
						  <ul class="pagination justify-content-center">
						    <li class="page-item disabled">
						      <a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous</a>
						    </li>
						    <li class="page-item"><a class="page-link" href="#">1</a></li>
						    <li class="page-item"><a class="page-link" href="#">2</a></li>
						    <li class="page-item"><a class="page-link" href="#">3</a></li>
						    <li class="page-item">
						      <a class="page-link" href="#">Next</a>
						    </li>
						  </ul>
						</nav>          
			    </div>
			    <div class="col-3 boxbottom">
			    	<section>
					 	<h3><i class="fas fa-newspaper"></i> Категории</h3>
						 	<ul>
						 		<li>Новини</li>
						 		<li>Други</li>
						 	</ul>
					 	</section>
			    	<section>
					 	<h3><i class="fas fa-desktop"></i> Кой е в Лаба?</h3>
						 	<ul>
						 		<li><i class="fas fa-microchip"></i> lora-gw-04.varnalab.org</li>
						 		<li><i class="fas fa-microchip"></i> lora-gw-01.varnalab.org</li>
						 		<li><i class="fas fa-microchip"></i> ESP-Easy</li>
						 		<li>OnePlusNord</li>
						 		<li>stefan-ThinkPad-P1</li>
						 	</ul>
					 	</section>

			    	<section>
					 	<h3><i class="fas fa-thermometer-half"></i> Температурата в лаба</h3>
					 		<b>Стая 1:</b>
						 	<ul>
						 		<li>Температура: 20 °C</li>
						 		<li>Влажност: 60%</li>
						 	</ul>
					 		<b>Стая 2:</b>
						 	<ul>
						 		<li>Температура: 20 °C</li>
						 		<li>Влажност: 60%</li>
						 	</ul>
					 	</section>
					 	<section>
					 		<h3><i class="fas fa-hashtag"></i> Намерете ни в:</h3>
					 		<ul>
					 			<li><a href="#"><i class="fab fa-facebook-square"></i> facebook<a></li>
					 			<li><a href="#"><i class="fab fa-slack-hash"></i> Slack<a></li>
					 			<li><a href="#"><i class="fab fa-discord"></i> Discord</li>
					 			<li><a href="#"><i class="fab fa-twitter-square"></i> Twitter<a></li>
					 			<li><a href="#"><i class="fab fa-instagram"></i> Instagram<a></li>
					 			<li><a href="#"><i class="fab fa-youtube"></i> YouTube<a></li>
					 			<li><a href="#"><i class="fab fa-twitch"></i> Twitch<a></li>
					 		</ul>
					 	</section>
					 	<iframe src="https://discordapp.com/widget?id=361281062472777728&amp;theme=dark" allowtransparency="true" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts" width="100%" height="450" frameborder="0"></iframe>
			    </div>
			  </div>
			</div>
		</main>

    <footer>
      <div class="container">
        <div class="row row-cols-4">
          <div class="col">
            <h6 class="text-uppercase font-weight-bold">Контакт</h6>
            <p>
              <i class="fas fa-home"></i> гр. Варна, България
            </p>
            <p>
              ул. Пенчо Славейков №50
            </p>
            <p>
              <i class="fas fa-envelope"></i> hq@varnalab.org
            </p>
            <p>
              <i class="fas fa-phone-alt"></i> + 359 / 123 456
            </p>
          </div>
          <div class="col">
            <h6 class="text-uppercase font-weight-bold">Галерия</h6>
            <div class="images-gallery">
              <ul>
                <li><a href="#"><img src="http://placehold.it/100x100" alt="Instagram 01"></a></li>
                <li><a href="#"><img src="http://placehold.it/100x100" alt="Instagram 02"></a></li>
                <li><a href="#"><img src="http://placehold.it/100x100" alt="Instagram 03"></a></li>
                <li><a href="#"><img src="http://placehold.it/100x100" alt="Instagram 04"></a></li>
              </ul>
            </div>            
          </div>
          <div class="col">
            <h6 class="text-uppercase font-weight-bold">Бързи връзки</h6>
							<ul class="footerUrls">
								<li><a href="#">Wiki</a></li>
								<li><a href="#">Trello</a></li>
							</ul>
            <h6 class="text-uppercase font-weight-bold">Приятели</h6>
							<ul class="footerUrls">
								<li><a href="#">initLab</a> <small><i>(София)</i></small></li>
								<li><a href="#">BurgasLab</a> <small><i>(Бургас)</i></small></li>
								<li><a href="#">ZaraLab</a> <small><i>(Стара Загора)</i></small></li>
							</ul>
          </div>
          <div class="col">
            <h6 class="text-uppercase font-weight-bold">Бюлетин</h6>
            <form class="text-center">
              <div class="form-group">
                <input type="email" class="form-control" id="InputEmail" placeholder="Въведете e-mail...">
              </div>
              <div class="form-group form-check">
                <input type="checkbox" class="form-check-input" id="Check1">
                <label class="form-check-label" for="Check1">Желая да получавам информация за събития и новини за лаба</label>
              </div>
              <button type="submit" class="btn btn-dark">Запиши ме</button>
            </form>
          </div>
        </div>
        <hr> 
        <div class="row">
          <div class="col">
            <div class="media">
              <img src="img/vlab_logo.png" alt="">
              <div class="media-body">
                Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem consectetur atque iusto esse, natus distinctio quae harum nam. Ipsam autem architecto doloremque impedit temporibus, quam cupiditate quidem commodi unde asperiores.  
              </div>
            </div>
          </div>

        </div>
        <hr>
        <div class="row">
          <div class="col text-center">
            <p class="copyright">Направено с <i class="fas fa-heart" style="color: #ff3535;"></i> от <b>VarnaLab</b> &copy; 2020</p>            
          </div>
        </div>
      </div>      
    </footer>

    <script src="js/jquery-3.5.1.slim.min.js"></script>
    <script src="js/bootstrap.bundle.min.js"></script>

  </body>
</html>