KGRKJGETMRETU895U-589TY5MIGM5JGB5SDFESFREWTGR54TY
Server : Apache/2.4.62
System : FreeBSD fbsdweb2.web.rcn.net 14.1-RELEASE FreeBSD 14.1-RELEASE releng/14.1-n267679-10e31f0946d8 GENERIC amd64
User : www ( 80)
PHP Version : 8.3.8
Disable Function : NONE
Directory :  /domains/nostrada/bootstrap/

Upload File :
current_dir [ Writeable ] document_root [ Writeable ]

 

Current File : /domains/nostrada/bootstrap/proof-o-concept5.html
<!DOCTYPE html>
<html>

<head>

		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">

<title>proof o concept</title>

<!--bootstrap-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!--my css-->
<link href="poc.css" rel="stylesheet" type="text/css">

<!--NOTE: javascript at bottom of BODY-->

</head>

<body id="poc2">

<div id="menu"> 
<p>Top menu goes here</p>
</div>

<div class="container">

<div class="row">

	<div class=" hidden-xs col-sm-4 col-md-3 col-lg-2" id="toc">
    <h3>Directory of all artists</h3>

    <!--secondary nav from Megosinarso's book-->
    <!--html is identical with the mobile toc-->
    <nav class="navbar navbar-inverse">
  			<div class="container-fluid">
    			<div class="navbar-header">
    				<button type="button" class="navbar-toggle" 
                    data-toggle="collapse" data-target="#myNavbar">
        				<span class="icon-bar"></span>
        				<span class="icon-bar"></span>
        				<span class="icon-bar"></span>
      				</button> 
      				<a class="navbar-brand" href="#">Directoy of All Artists</a>
    			</div>

    			<div class="collapse navbar-collapse" id="myNavbar">
      				<ul class="nav navbar-nav">
        				<li class="dropdown">
        					<a href="#" class="dropdown-toggle" 
                            data-toggle="dropdown">Ethiopia<b class="caret"></b></a>
          					<ul class="dropdown-menu">
								<li><a href="#">Skunder</a></li>
								<li><a href="#">Gedamu</a></li>
								<li><a href="#">Kosrof</a></li>        
							</ul>        
        				</li>
        				<li class="dropdown">
        					<a href="#" class="dropdown-toggle" 
                            data-toggle="dropdown">Ghana<b class="caret"></b></a>
          					<ul class="dropdown-menu">
								<li><a href="#">Artist 1</a></li>
								<li><a href="#">Artist 2</a></li>
								<li><a href="#">Artist 3</a></li>        
							</ul>        
        				</li>
        				<li class="dropdown">
        					<a href="#" class="dropdown-toggle" 
                            data-toggle="dropdown">Ivory Coast<b class="caret">
                            </b></a>
          					<ul class="dropdown-menu">
								<li><a href="#">Artist 1</a></li>
								<li><a href="#">Artist 2</a></li>
								<li><a href="#">Artist 3</a></li>         
							</ul>        
        				</li>
      				</ul>
      			</div>
  			</div>
		</nav>

	<p>&nbsp;</p>
	</div> <!--end of col 1-->

	<div class="col-xs-12 col-sm-8 col-md-9 col-lg-10" >
    
    	<div id="topper"><img class="img-responsive center-block" 
        src="caag_logo.jpg" alt="caa logo"></div>
    
    
        <div id="mobile-toc" class="hidden-sm hidden-md hidden-lg" >
        
        <!--secondary nav frm Megosinarso's book-->
        <nav class="navbar navbar-inverse">
  			<div class="container-fluid">
    			<div class="navbar-header">
    				<button type="button" class="navbar-toggle" 
                    data-toggle="collapse" data-target="#myNavbar">
        				<span class="icon-bar"></span>
        				<span class="icon-bar"></span>
        				<span class="icon-bar"></span>
      				</button> 
      				<a class="navbar-brand" href="#">Directoy of All Artists</a>
    			</div>

    			<div class="collapse navbar-collapse" id="myNavbar">
      				<ul class="nav navbar-nav">
        				<li class="dropdown">
        					<a href="#" class="dropdown-toggle" 
                            data-toggle="dropdown">Ethiopia<b class="caret"></b></a>
          					<ul class="dropdown-menu">
								<li><a href="#">Skunder</a></li>
								<li><a href="#">Gedamu</a></li>
								<li><a href="#">Kosrof</a></li>        
							</ul>        
        				</li>
        				<li class="dropdown">
        					<a href="#" class="dropdown-toggle" 
                            data-toggle="dropdown">Ghana<b class="caret"></b></a>
          					<ul class="dropdown-menu">
								<li><a href="#">Artist 1</a></li>
								<li><a href="#">Artist 2</a></li>
								<li><a href="#">Artist 3</a></li>        
							</ul>        
        				</li>
        				<li class="dropdown">
        					<a href="#" class="dropdown-toggle" 
                            data-toggle="dropdown">Ivory Coast<b class="caret">
                            </b></a>
          					<ul class="dropdown-menu">
								<li><a href="#">Artist 1</a></li>
								<li><a href="#">Artist 2</a></li>
								<li><a href="#">Artist 3</a></li>         
							</ul>        
        				</li>
      				</ul>
      			</div>
  			</div>
		</nav>  <!--end of NAV-->
        
        </div> <!--end of hidden navigation DIV-->
    
    
    <!--pix from a given artist-->
	<div id="pix-panel" class="skunder">
    	<H2>Ethiopia</H2>
        <H3>Skunder Boghossian</h3>
        <p class="bio"> Skunder Boghossian may be the best known African artist. His permanent collection short list includes: The Museum of Modern Art, New York; Musee d’Art Moderne, Paris; The Studio Museum in Harlem and the National Museum Of African Art, Washington. His formal training at the School of Paris influenced his skill but never touched his heart or imagination. Although he spent most of his adult life in America an only three years of that time in Ethiopia, he is the most Ethiopian of Ethiopian painters.</p>
   	 
       <div class="artwork">
       	  <div class="artwork-title">
          	<p>Artwork Title</p>
       	  </div>
          <img src="tn000.jpg" alt="Art pic here">
        	    <p class="medium"><span class="artwork-label">Medium: </span>Oil</p>
				<p class="size"><span class="artwork-label">Size: </span>Oil</p>
                <p class="edition"><span class="artwork-label">Edition: </span>Oil</p>
                
<p class="sold">sold</p>
        </div> <!--end of artwork-->
            
  <div class="artwork">
       	  <div class="artwork-title">
          	<p>Artwork Title Lorum Ipsum Dolor Simit Foobar Freshlunginer</p>
       	  </div>
       	  <img src="tn114.jpg" width="71" height="275">
<p class="medium"><span class="artwork-label">Medium: </span>Oil</p>
			   <p class="size"><span class="artwork-label">Size: </span>Oil</p>
          <p class="edition"><span class="artwork-label">Edition: </span>Oil</p>
        </div> <!--end of artwork-->
            
  <div class="artwork">
       	  <div class="artwork-title">
          	<p>Artwork Title Freshlunginer</p>
       	  </div>
          <img src="tn101.jpg" alt="Art pic here">
               <p class="medium"><span class="artwork-label">Medium: </span>Oil</p>
			   <p class="size"><span class="artwork-label">Size: </span>Oil</p>
          <p class="edition"><span class="artwork-label">Edition: </span>Oil</p>
        </div> <!--end of artwork-->
            
  <div class="artwork">
       	  <div class="artwork-title">
          	<p>Artwork Title  Foobar Freshlunginer</p>
       	  </div>
          <img src="TN030.jpg" alt="Art pic here">
               <p class="medium"><span class="artwork-label">Medium: </span>Oil</p>
			   <p class="size"><span class="artwork-label">Size: </span>Oil</p>
          <p class="edition"><span class="artwork-label">Edition: </span>Oil</p>
        </div> <!--end of artwork-->

  <div class="artwork">
       	  <div class="artwork-title">
          	<p>Artwork Title Lorum Ipsum Dolor Freshlunginer</p>
       	  </div>
          <img src="tn084.jpg" alt="Art pic here">
               <p class="medium"><span class="artwork-label">Medium: </span>Oil</p>
			   <p class="size"><span class="artwork-label">Size: </span>Oil</p>
          <p class="edition"><span class="artwork-label">Edition: </span>Oil</p>
        </div> <!--end of artwork-->

    	<div style='clear:both;'></div>  <!--pushdown-->
            
    </div>  <!--end of BIG PIX panel for a given artist-->
    
    </div> <!--end col 2-->
    
</div> <!--end ROW-->
</div> <!--end CONTAINER-->

<!--jQuery-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<!--bootstrap-->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>4
</body>

</html>

Anon7 - 2021