| Line 182: | Line 182: | ||
} | } | ||
| + | |||
| + | <!-- click to enlarge image css --> | ||
| + | /*Eliminates padding, centers the thumbnail */ | ||
| + | |||
| + | body, html { | ||
| + | padding: 0; | ||
| + | margin: 0; | ||
| + | text-align: center; | ||
| + | } | ||
| + | |||
| + | /* Styles the thumbnail */ | ||
| + | |||
| + | a.lightbox img { | ||
| + | height: 150px; | ||
| + | border: 3px solid white; | ||
| + | box-shadow: 0px 0px 8px rgba(0,0,0,.3); | ||
| + | margin: 94px 10px 10px 10px; | ||
| + | } | ||
| + | |||
| + | /* Styles the lightbox, removes it from sight and adds the fade-in transition */ | ||
| + | |||
| + | .lightbox-target { | ||
| + | position: fixed; | ||
| + | top: -100%; | ||
| + | width: 100%; | ||
| + | background: rgba(0,0,0,.7); | ||
| + | width: 100%; | ||
| + | opacity: 0; | ||
| + | -webkit-transition: opacity .5s ease-in-out; | ||
| + | -moz-transition: opacity .5s ease-in-out; | ||
| + | -o-transition: opacity .5s ease-in-out; | ||
| + | transition: opacity .5s ease-in-out; | ||
| + | overflow: hidden; | ||
| + | } | ||
| + | |||
| + | /* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */ | ||
| + | |||
| + | .lightbox-target img { | ||
| + | margin: auto; | ||
| + | position: absolute; | ||
| + | top: 0; | ||
| + | left:0; | ||
| + | right:0; | ||
| + | bottom: 0; | ||
| + | max-height: 0%; | ||
| + | max-width: 0%; | ||
| + | border: 3px solid white; | ||
| + | box-shadow: 0px 0px 8px rgba(0,0,0,.3); | ||
| + | box-sizing: border-box; | ||
| + | -webkit-transition: .5s ease-in-out; | ||
| + | -moz-transition: .5s ease-in-out; | ||
| + | -o-transition: .5s ease-in-out; | ||
| + | transition: .5s ease-in-out; | ||
| + | } | ||
| + | |||
| + | /* Styles the close link, adds the slide down transition */ | ||
| + | |||
| + | a.lightbox-close { | ||
| + | display: block; | ||
| + | width:50px; | ||
| + | height:50px; | ||
| + | box-sizing: border-box; | ||
| + | background: white; | ||
| + | color: black; | ||
| + | text-decoration: none; | ||
| + | position: absolute; | ||
| + | top: -80px; | ||
| + | right: 0; | ||
| + | -webkit-transition: .5s ease-in-out; | ||
| + | -moz-transition: .5s ease-in-out; | ||
| + | -o-transition: .5s ease-in-out; | ||
| + | transition: .5s ease-in-out; | ||
| + | } | ||
| + | |||
| + | /* Provides part of the "X" to eliminate an image from the close link */ | ||
| + | |||
| + | a.lightbox-close:before { | ||
| + | content: ""; | ||
| + | display: block; | ||
| + | height: 30px; | ||
| + | width: 1px; | ||
| + | background: black; | ||
| + | position: absolute; | ||
| + | left: 26px; | ||
| + | top:10px; | ||
| + | -webkit-transform:rotate(45deg); | ||
| + | -moz-transform:rotate(45deg); | ||
| + | -o-transform:rotate(45deg); | ||
| + | transform:rotate(45deg); | ||
| + | } | ||
| + | |||
| + | /* Provides part of the "X" to eliminate an image from the close link */ | ||
| + | |||
| + | a.lightbox-close:after { | ||
| + | content: ""; | ||
| + | display: block; | ||
| + | height: 30px; | ||
| + | width: 1px; | ||
| + | background: black; | ||
| + | position: absolute; | ||
| + | left: 26px; | ||
| + | top:10px; | ||
| + | -webkit-transform:rotate(-45deg); | ||
| + | -moz-transform:rotate(-45deg); | ||
| + | -o-transform:rotate(-45deg); | ||
| + | transform:rotate(-45deg); | ||
| + | } | ||
| + | |||
| + | /* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */ | ||
| + | |||
| + | .lightbox-target:target { | ||
| + | opacity: 1; | ||
| + | top: 0; | ||
| + | bottom: 0; | ||
| + | } | ||
| + | |||
| + | .lightbox-target:target img { | ||
| + | max-height: 100%; | ||
| + | max-width: 100%; | ||
| + | } | ||
| + | |||
| + | .lightbox-target:target a.lightbox-close { | ||
| + | top: 0px; | ||
| + | } | ||
</style> | </style> | ||
| Line 237: | Line 361: | ||
<!--<img src="https://static.igem.org/mediawiki/2017/2/27/Lubbock_TTU_032617_1.jpeg" align="left" width="300" hspace="15">--> | <!--<img src="https://static.igem.org/mediawiki/2017/2/27/Lubbock_TTU_032617_1.jpeg" align="left" width="300" hspace="15">--> | ||
<p align="left">The iGEM Raiders team met for the weekly meeting. Strategy and talking points were discussed to prepare members for recruiting funding from potential donors. Additionally, fundraising, university sponsor, and outreach updates were discussed.</p> | <p align="left">The iGEM Raiders team met for the weekly meeting. Strategy and talking points were discussed to prepare members for recruiting funding from potential donors. Additionally, fundraising, university sponsor, and outreach updates were discussed.</p> | ||
| − | < | + | |
| − | < | + | <a class="lightbox" href="#dog"><img src="http://i.huffpost.com/gen/749263/original.jpg"/></a> |
| + | <div class="lightbox-target" id="dog"> | ||
| + | <img src="http://i.huffpost.com/gen/749263/original.jpg"/><a class="lightbox-close" href="#"></a> | ||
| + | </div> | ||
| + | |||
| + | <a class="lightbox" href="#dog"><img src="http://i.huffpost.com/gen/749263/original.jpg"/></a> | ||
| + | <div class="lightbox-target" id="dog"> | ||
| + | <img src="http://i.huffpost.com/gen/749263/original.jpg"/><a class="lightbox-close" href="#"></a> | ||
| + | </div> | ||
| + | |||
</br></br><b>Tip:</b> Click any image to enlarge.</div> | </br></br><b>Tip:</b> Click any image to enlarge.</div> | ||
</div> | </div> | ||
The iGEM Raiders team held a meeting to create a promotional flyer to be used for acquiring support and fundraising. Team members were assigned blurbs to write for the flyer covering topics including what iGEM is, what our project is, why iGEM should continue at Texas Tech, why it should be supported, and our prospective goals such as being published. Team member Kaitlyn was assigned the task of designing the flyer. View our flyer here.
The iGEM Raiders team met for the weekly meeting. Officer elections were held and the team discussed funding for team registration, bio-curriculum to be taught at ULabs, and delegated tasks to members. Check our our members here!
The iGEM Raiders team attended a dinner to get to know one another.
