Browse Source

wrapped up banner homepage

master
JoBCB 4 years ago
parent
commit
a703ea215f
  1. 52
      static/css/style.css
  2. 3
      templates/about.html
  3. 14
      templates/home.html

52
static/css/style.css

@ -583,9 +583,10 @@ a.paginate_button.next:after {
div#home-top-div{
height: 661px;
width: 100%;
border:blue solid 1px;
overflow: hidden;
position: relative;
border-bottom: solid black 3px;
}
.heading_A {
@ -605,13 +606,41 @@ div#home-top-div{
position: static;
max-width: 634px;
}
#home-top-div p {
margin-bottom: 0px;
}
#home-top-div #wrapper-bt-vid {
display: flex;
flex-direction: row;
justify-content: space-between;
}
#home-top-div #wrapper-vid {
margin: 0px 150px 0px 0px;
position: static;
width: 50%;
}
#home-top-div #wrapper-bt{
margin: 36px 26px 0px 150px;
position: static;
width: 50%;
}
#home-top-div #wrapper-vid video {
max-width: 600px;
width: 100%;
height: auto;
}
#home-top-div #wrapper-top-buttons{
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 26px;
}
#home-top-div .primary-button {
/*#home-top-div .primary-button {
margin-left: 150px;
margin-bottom: 26px;
position: static;
@ -619,7 +648,7 @@ div#home-top-div{
#home-top-div .secondary-button {
margin-left: 150px;
position: static;
}
}*/
#home-top-div img {
position: absolute;
@ -658,16 +687,16 @@ div#home-top-div{
@keyframes move {
0% {
-webkit-transform: translateX(0px);
-ms-transform: translateX(0px);
-moz-transform: translateX(0px);
transform: translateX(0px);
-webkit-transform: translateX(0vw);
-ms-transform: translateX(0vw);
-moz-transform: translateX(0vw);
transform: translateX(0vw);
}
100% {
-webkit-transform: translateX(1650px); /* 250vw*/
-ms-transform: translateX(1650px);
-moz-transform: translateX(1650px);
transform: translateX(1650px);
-webkit-transform: translateX(200vw); /* 250vw*/
-ms-transform: translateX(200vw);
-moz-transform: translateX(200vw);
transform: translateX(200vw);
}
}
@ -686,6 +715,7 @@ div#home-top-div{
}
}
/* ARCHIVE PREVIEW */
img.home-recent-imgs, img.browsethearchive-imgs{
width: 100%;

3
templates/about.html

@ -5,12 +5,15 @@
<div class="pagetitle" id="about-title">About: Digital Archive of Artists Publishing (DAAP)</div>
<div id="about-content">
<div id="about-content-top">
<div id="about-content-top-left">The Digital Archive of Artists Publishing (DAAP) is an interactive, user-driven, searchable database of Artists’ Books and publications, that acts as a hub to engage with others, built by artists, publishers, and a community of producers in contemporary Artists’ Publishing, developed via an ethically driven design process and open-data methodology.
</div>
<div id="about-content-top-right">
<img src="{{ url_for('static', filename='/imgs/Pages/bannerrepeater.png') }}">
</div>
</div>
<div id="about-content-bottom">

14
templates/home.html

@ -25,9 +25,19 @@
<p class="heading_A">The Digital Archive of Artists Publishing is an interactive, user-driven, searchable database of Artist's Books and publications</p>
<div id="wrapper-top-buttons" class="primary-button" id=""><span>SEE EXAMPLE SEARCH FOR ZINES</span></div>
<div id="wrapper-top-buttons" class="secondary-button" id=""><span>LEARN MORE ABOUT ADVANCED SEARCH TOOLS</span></div>
<div id="wrapper-bt-vid">
<div id="wrapper-bt">
<div id="wrapper-top-buttons" class="primary-button"><span>SEE EXAMPLE SEARCH FOR ZINES</span></div>
<div id="wrapper-top-buttons" class="secondary-button"><span>LEARN MORE ABOUT ADVANCED SEARCH TOOLS</span></div>
</div>
<div id="wrapper-vid">
<video preload="meta" autoplay="" loop="">
<source src="vid/archive-links-video-temp.mp4" type="video/mp4">
</video>
</div>
</div>
</div>

Loading…
Cancel
Save