added scriptarchive.html
This commit is contained in:
Karen
parent
2c80c16b14
commit
2e39d8d61a
|
|
@ -26,8 +26,7 @@ ul.tabsInnerRight li a {
|
|||
text-decoration: none;
|
||||
color: #FFB80F;
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
padding: 0 6px;
|
||||
border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/
|
||||
outline: none;
|
||||
|
|
@ -136,3 +135,49 @@ margin-left: 10px;
|
|||
text-align: right;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.productionEach {
|
||||
padding: 0 0 20px 0;
|
||||
}
|
||||
|
||||
.productionEachImg {
|
||||
background: #ccc;
|
||||
min-height: 110px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.productionEachText {
|
||||
padding-left: 20px;
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
.productionEachImg, .productionEachText {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.noteEach {
|
||||
padding: 10px 0 0 0;
|
||||
border-bottom: 1px solid #ffff00;
|
||||
}
|
||||
|
||||
.noteEach:last-of-type {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.noteMetaData {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.resourcesEach {
|
||||
padding: 0 0 20px 0;
|
||||
}
|
||||
|
||||
/*toggleClass*/
|
||||
.toggleLink {
|
||||
|
||||
}
|
||||
|
||||
.toggleDiv {
|
||||
display: none;
|
||||
}
|
||||
/*end toggleClass*/
|
||||
279
itf/templates/test_static_templates/scriptarchive.html
Normal file
279
itf/templates/test_static_templates/scriptarchive.html
Normal file
|
|
@ -0,0 +1,279 @@
|
|||
<link rel="stylesheet" href="/static/css/modules/tabsinnerright.css" type="text/css" />
|
||||
|
||||
<ul class="tabsInnerRight">
|
||||
<li><a href="#synopsis">Synopsis</a></li>
|
||||
<li><a href="#productions">Productions</a></li>
|
||||
<li><a href="#people">People</a></li>
|
||||
<li><a href="#notes">Notes</a></li>
|
||||
<li><a href="#gallery">Gallery</a></li>
|
||||
<li><a href="#resources">Resources</a></li>
|
||||
</ul>
|
||||
|
||||
<div id="synopsis" class="tab_content">
|
||||
|
||||
<h3>Script Name</h3>
|
||||
<p>Writer: Names of writers</p>
|
||||
<p>Language(s): Hindi, Bengali</p>
|
||||
<p>Approximate duration: </p>
|
||||
<p>No of characters: 20; Female: 5, Male: 15</p>
|
||||
|
||||
<br>
|
||||
|
||||
<div>
|
||||
<p class="orange">Synopsis</p>
|
||||
<p>Some copy here that is a synopsis in a paragraph. Some copy here that is a synopsis in a paragraph.
|
||||
Some copy here that is a synopsis in a paragraph. Some copy here that is a synopsis in a paragraph.</p>
|
||||
</div>
|
||||
|
||||
<p><strong>This script may be accessed
|
||||
under the following Creative Commons Licenses:</strong></p>
|
||||
<p class="orange">Adaptation License: Derivative Works allowed</p>
|
||||
<p>Some license information. <span style="color:red;">Does this need to be an accordion?</span></p>
|
||||
<p class="orange">Read legal license</p>
|
||||
<p class="orange">Performance License: Derivative Works allowed</p>
|
||||
<img href={{ image.get_absolute_url }} </img>
|
||||
|
||||
<a href="">Download</a>
|
||||
|
||||
</div> <!-- end synopsis -->
|
||||
|
||||
<div id="productions" class="tab_content">
|
||||
|
||||
<h3 class="orange">Productions</h3>
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Production (2010)</p>
|
||||
<p>Group: Group Name</p>
|
||||
<p>Title Credits: Some copy here <span style="color:red">How much text comes here? Karen</span></p>
|
||||
<p>No. of shows: 50</p>
|
||||
<p>Current(icon) or Upcoming (icon)<span style="color:red">Should we have this just after the title? Karen</span></p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
</div> <!-- end production each -->
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Production (2010)</p>
|
||||
<p>Group: Group Name</p>
|
||||
<p>Title Credits: Some copy here</p>
|
||||
<p>No. of shows: 50</p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div> <!-- end production each -->
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Production (2010)</p>
|
||||
<p>Group: Group Name</p>
|
||||
<p>Title Credits: Some copy here</p>
|
||||
<p>No. of shows: 50</p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div> <!-- end production each -->
|
||||
|
||||
<br />
|
||||
|
||||
<h3 class="orange">Related Productions</h3>
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Production (2010)</p>
|
||||
<p>Group: Group Name</p>
|
||||
<p>Title Credits: Some copy here</p>
|
||||
<p>No. of shows: 50</p>
|
||||
<p>Current(icon) or Upcoming (icon)/p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div> <!-- end production each -->
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Production (2010)</p>
|
||||
<p>Group: Group Name</p>
|
||||
<p>Title Credits: Some copy here</p>
|
||||
<p>No. of shows: 50</p>
|
||||
<p>Current(icon) or Upcoming (icon)/p>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
</div> <!-- end production each -->
|
||||
|
||||
</div> <!-- end productions -->
|
||||
|
||||
<div id="people" class="tab_content">
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Person</p>
|
||||
<p>Writer: Some script</p>
|
||||
<p>Translation of script by playwright</p>
|
||||
<p>From language to language</p>
|
||||
<a href="" class="toggleLink orange">Synopsis</a>
|
||||
<div class="toggleDiv">Lorem ipsum</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
</div> <!-- end production each -->
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Person</p>
|
||||
<p>Writer: Some script</p>
|
||||
<p>Translation of script by playwright</p>
|
||||
<p>From language to language</p>
|
||||
<a href="" class="toggleLink orange">Synopsis</a>
|
||||
<div class="toggleDiv">Lorem ipsum</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
</div> <!-- end production each -->
|
||||
|
||||
<div class="productionEach">
|
||||
<div class="productionEachImg">
|
||||
<img src="" alt="/static/images/150x150.jpg" />
|
||||
</div>
|
||||
|
||||
<div class="productionEachText">
|
||||
<p class="orange">Name of Person</p>
|
||||
<p>Writer: Some script</p>
|
||||
<p>Translation of script by playwright</p>
|
||||
<p>From language to language</p>
|
||||
<a href="" class="toggleLink orange">Synopsis</a>
|
||||
<div class="toggleDiv">Lorem ipsum</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
</div> <!-- end production each -->
|
||||
|
||||
</div> <!-- end people -->
|
||||
|
||||
<div id="notes" class="tab_content">
|
||||
|
||||
<div class="noteEach">
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
|
||||
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit
|
||||
esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis
|
||||
dolore te feugait nulla facilisi.</p>
|
||||
<p class="noteMetaData">- posted by Name, Date, Time</p>
|
||||
</div>
|
||||
|
||||
<div class="noteEach">
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
|
||||
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit
|
||||
esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis
|
||||
dolore te feugait nulla facilisi.</p>
|
||||
<p class="noteMetaData">- posted by Name, Date, Time</p>
|
||||
</div>
|
||||
|
||||
<div class="noteEach">
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
|
||||
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit
|
||||
esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis
|
||||
dolore te feugait nulla facilisi.</p>
|
||||
<p class="noteMetaData">- posted by Name, Date, Time</p>
|
||||
</div>
|
||||
|
||||
<div class="noteEach">
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
|
||||
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit
|
||||
esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis
|
||||
dolore te feugait nulla facilisi.</p>
|
||||
<p class="noteMetaData">- posted by Name, Date, Time</p>
|
||||
</div>
|
||||
|
||||
</div> <!-- end notes -->
|
||||
|
||||
<div id="resources" class="tab_content">
|
||||
|
||||
<div class="resourcesEach">
|
||||
<p class="orange">Title</p>
|
||||
<p>One line description</p>
|
||||
<p><a href="" target="_blank">Url</a></p>
|
||||
<a href="">Download</a>
|
||||
</div>
|
||||
|
||||
<div class="resourcesEach">
|
||||
<p class="orange">Title</p>
|
||||
<p>One line description</p>
|
||||
<p><a href="" target="_blank">Url</a></p>
|
||||
<a href="">Download</a>
|
||||
</div>
|
||||
|
||||
<div class="resourcesEach">
|
||||
<p class="orange">Title</p>
|
||||
<p>One line description</p>
|
||||
<p><a href="" target="_blank">Url</a></p>
|
||||
<a href="">Download</a>
|
||||
</div>
|
||||
|
||||
<div class="resourcesEach">
|
||||
<p class="orange">Title</p>
|
||||
<p>One line description</p>
|
||||
<p><a href="" target="_blank">Url</a></p>
|
||||
<a href="">Download</a>
|
||||
</div>
|
||||
|
||||
</div> <!-- end resources -->
|
||||
|
||||
<div id="gallery" class="tab_content">
|
||||
|
||||
<div class="imgVideoBlock">
|
||||
<h3 class="orange">Photos</h3>
|
||||
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
|
||||
<a href="" class="moreLink">More»</a>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<div class="imgVideoBlock">
|
||||
<h3 class="orange">Videos</h3>
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
<img src="/static/images/150x150.jpg" width="160" height="120" alt="" />
|
||||
|
||||
<a href="" class="moreLink">More»</a>
|
||||
</div>
|
||||
|
||||
</div> <!-- end gallery -->
|
||||
|
||||
<script type="text/javascript" src="/static/js/innertabs.js"></script>
|
||||
Loading…
Reference in New Issue
Block a user