Difference between revisions of "Template:Freiburg/test"
Line 1: | Line 1: | ||
<html> | <html> | ||
<style> | <style> | ||
+ | |||
+ | |||
+ | |||
+ | /* =================== CSS Navigation =================== */ | ||
+ | /* Resetting css coming from wiki itself | ||
+ | /* Clearing DokuWiki elements | ||
+ | /* Declare Fonts for non-Windows machines | ||
+ | /* CSS for Menubar | ||
+ | /* Important Site setup | ||
+ | /* Background | ||
+ | /* Text Styling | ||
+ | /* Full Width Banners | ||
+ | /* Footer | ||
+ | /* | ||
+ | /* Flipcard-CSS for the members-section: inline in https://2015.igem.org/Team:Freiburg/Team | ||
+ | /* CSS-slider: inline for the respective pages. e.g. https://2015.igem.org/wiki/index.php?title=Team:Freiburg/PaP/ScienceFair | ||
+ | /* CSS classes and ids for Human Practice | ||
+ | /* CSS for back-button | ||
+ | /* CSS for the upwards-blob: on wiki_content_start | ||
+ | /* =================== END: CSS Navigation =================== */ | ||
+ | |||
+ | |||
+ | |||
/* ============= Resetting css coming from wiki itself ============= */ | /* ============= Resetting css coming from wiki itself ============= */ | ||
body { | body { | ||
Line 7: | Line 30: | ||
margin: 0px; | margin: 0px; | ||
padding: 0px; | padding: 0px; | ||
− | background-color: # | + | background-color: #FCFCFC; |
line-height: 1.8; | line-height: 1.8; | ||
} | } | ||
Line 31: | Line 54: | ||
#mainContainer { | #mainContainer { | ||
− | + | margin: 0; | |
− | + | width: 100%; | |
} | } | ||
Line 90: | Line 113: | ||
} | } | ||
+ | |||
+ | /* removes URL from current site from the top of the window */ | ||
+ | .firstHeading{ | ||
+ | font-size: 0; | ||
+ | border: 0; | ||
+ | margin-bottom: -8px; | ||
+ | } | ||
/* ============= END: Resetting css coming from wiki itself ============= */ | /* ============= END: Resetting css coming from wiki itself ============= */ | ||
− | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* ============= Clearing DokuWiki elements ============= */ | ||
+ | |||
+ | .tags{ | ||
+ | /* remove tags from bottom */ | ||
+ | font-size: 0; | ||
+ | } | ||
+ | |||
+ | acronym{ | ||
+ | /* remove text-decoration from acronyms*/ | ||
+ | border-bottom: none; | ||
+ | text-decoration: none; | ||
+ | cursor: auto; | ||
+ | } | ||
+ | |||
+ | /* ============= END: Clearing DokuWiki elements ============= */ | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* ============= Declaring Fonts ============= */ | ||
@font-face { | @font-face { | ||
font-family: Candara; | font-family: Candara; | ||
+ | src: url(https://static.igem.org/mediawiki/2015/d/dd/Freiburg_Candara.eot); | ||
src: url(https://static.igem.org/mediawiki/2015/6/6c/Freiburg_Candara.ttf) format('truetype'); | src: url(https://static.igem.org/mediawiki/2015/6/6c/Freiburg_Candara.ttf) format('truetype'); | ||
} | } | ||
− | |||
@font-face { | @font-face { | ||
font-family: Candara; | font-family: Candara; | ||
Line 112: | Line 170: | ||
font-family: Candara; | font-family: Candara; | ||
src: url(https://static.igem.org/mediawiki/2015/3/3e/Freiburg_Candarai.ttf) format('truetype'); | src: url(https://static.igem.org/mediawiki/2015/3/3e/Freiburg_Candarai.ttf) format('truetype'); | ||
− | + | font-weight: normal; | |
− | + | font-style: italic; | |
} | } | ||
@font-face { | @font-face { | ||
font-family: Roboto; | font-family: Roboto; | ||
− | src: url(https://static.igem.org/mediawiki/2015/c/c3/Freiburg_Roboto-Regular.ttf) format('truetype'); | + | src: url(https://static.igem.org/mediawiki/2015/e/ee/Freiburg_Roboto-Regular.eot); |
− | + | src: url(https://static.igem.org/mediawiki/2015/b/bf/Freiburg_Roboto-Regular-webfont.woff) format('woff'), | |
+ | url(https://static.igem.org/mediawiki/2015/c/c3/Freiburg_Roboto-Regular.ttf) format('truetype'), | ||
+ | url('https://static.igem.org/mediawiki/2015/3/38/Freiburg_Roboto-Regular-webfont.svg#RobotoRegular') format('svg'); | ||
+ | } | ||
+ | @font-face { | ||
+ | font-family: Roboto; | ||
+ | src: url(https://static.igem.org/mediawiki/2015/7/7f/Freiburg_Roboto-Light.eot); | ||
+ | src: url(https://static.igem.org/mediawiki/2015/2/28/Freiburg_Roboto-Light-webfont.woff) format('woff'), | ||
+ | url(https://static.igem.org/mediawiki/2015/6/64/Freiburg_Roboto-Light.ttf) format('truetype'), | ||
+ | url('https://static.igem.org/mediawiki/2015/8/87/Freiburg_Roboto-Light-webfont.svg#RobotoLight') format('svg'); | ||
+ | font-style: normal; | ||
+ | font-weight: 300; | ||
+ | |||
} | } | ||
− | |||
@font-face { | @font-face { | ||
font-family: Roboto; | font-family: Roboto; | ||
− | src: url(https://static.igem.org/mediawiki/2015/b/b9/Freiburg_Roboto-Bold.ttf) format('truetype'); | + | src: url(https://static.igem.org/mediawiki/2015/4/40/Freiburg_Roboto-Bold.eot); |
+ | src: url(https://static.igem.org/mediawiki/2015/e/e4/Freiburg_Roboto-Bold-webfont.woff) format('woff'), | ||
+ | url(https://static.igem.org/mediawiki/2015/b/b9/Freiburg_Roboto-Bold.ttf) format('truetype'), | ||
+ | url('https://static.igem.org/mediawiki/2015/4/40/Freiburg_Roboto-Bold-webfont.svg#RobotoBold') format('svg'); | ||
font-weight: bold; | font-weight: bold; | ||
font-style: normal; | font-style: normal; | ||
Line 130: | Line 202: | ||
@font-face { | @font-face { | ||
font-family: Roboto; | font-family: Roboto; | ||
− | src: url(https://static.igem.org/mediawiki/2015/2/2e/Freiburg_Roboto-Italic.ttf) format('truetype'); | + | src: url(https://static.igem.org/mediawiki/2015/0/0f/Freiburg_Roboto-Italic.eot); |
− | + | src: url(https://static.igem.org/mediawiki/2015/6/6f/Freiburg_Roboto-Italic-webfont.woff) format('woff'), url(https://static.igem.org/mediawiki/2015/2/2e/Freiburg_Roboto-Italic.ttf) format('truetype'), | |
− | + | url('https://static.igem.org/mediawiki/2015/8/8f/Freiburg_Roboto-Italic-webfont.svg#RobotoItalic') format('svg'); | |
+ | font-weight: normal; | ||
+ | font-style: italic; | ||
} | } | ||
@font-face { | @font-face { | ||
font-family: Roboto; | font-family: Roboto; | ||
− | src: url(https://static.igem.org/mediawiki/2015/2/2f/Freiburg_Roboto-BoldItalic.ttf) format('truetype'); | + | src: url(https://static.igem.org/mediawiki/2015/c/ce/Freiburg_Roboto-BoldItalic.eot); |
− | + | src: url(https://static.igem.org/mediawiki/2015/8/89/Freiburg_Roboto-BoldItalic-webfont.woff) format('woff'), | |
− | + | url(https://static.igem.org/mediawiki/2015/2/2f/Freiburg_Roboto-BoldItalic.ttf) format('truetype'), | |
+ | url('https://static.igem.org/mediawiki/2015/a/ac/Freiburg_Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg'); | ||
+ | font-weight: bold; | ||
+ | font-style: italic; | ||
} | } | ||
− | /* ============= END: | + | |
+ | /* ============= END: Declaring Fonts ============= */ | ||
+ | |||
+ | |||
+ | |||
Line 151: | Line 232: | ||
#menubar { | #menubar { | ||
font-size: 16px; | font-size: 16px; | ||
− | + | background-color: #5781bd; | |
− | + | display: table; | |
− | + | width: 100%; | |
− | + | height: 70px; | |
− | + | border-collapse: collapse; | |
− | + | border: none; | |
} | } | ||
Line 162: | Line 243: | ||
/*The sub (and subsubs) items of the menu*/ | /*The sub (and subsubs) items of the menu*/ | ||
#menubar ul li ul li{ | #menubar ul li ul li{ | ||
− | + | width: 200px; | |
− | + | height: 30px; | |
− | + | margin-top: 2px; | |
} | } | ||
/*The first (horizontal) line of menu items*/ | /*The first (horizontal) line of menu items*/ | ||
#menubar > ul{ | #menubar > ul{ | ||
− | + | position: relative; | |
− | + | margin-top: 25; | |
− | + | left: 50%; | |
− | + | display: block; | |
− | + | transform: translate(-50%,0%); | |
} | } | ||
#menubar ul ul { | #menubar ul ul { | ||
− | + | background-color: #5781bd; | |
− | + | display: none; | |
− | + | position: absolute; | |
− | + | margin-left: 0px; | |
− | + | float: left; | |
− | + | margin-top:0px; | |
} | } | ||
#menubar ul ul li{ | #menubar ul ul li{ | ||
− | + | display: block; | |
− | + | margin-left: 0px; | |
} | } | ||
#menubar ul li { | #menubar ul li { | ||
− | + | width: 100px; | |
− | + | display: table-cell; | |
− | + | font-family: "Roboto",sans-serif; | |
} | } | ||
#menubar ul a{ | #menubar ul a{ | ||
− | + | text-decoration: none; | |
− | + | color: #FFFFFF; | |
− | + | font-style: bold; | |
− | + | text-align: left; | |
} | } | ||
#menubar ul a:visited{ | #menubar ul a:visited{ | ||
− | + | display: block; | |
− | + | text-decoration: none; | |
− | + | color: #FFFFFF; | |
− | + | font-style: bold; | |
} | } | ||
#menubar ul li:hover > ul{ | #menubar ul li:hover > ul{ | ||
− | + | color: #EEEE00; | |
− | + | display: block; | |
− | + | padding-top: 0px; | |
− | + | padding-left: 20px; | |
} | } | ||
#menubar ul li:hover{ | #menubar ul li:hover{ | ||
− | + | color: #EEEE00; | |
} | } | ||
/* ============= END: CSS for Menubar ============= */ | /* ============= END: CSS for Menubar ============= */ | ||
− | |||
+ | |||
+ | /* ============= Important Site setup ============= */ | ||
+ | |||
+ | /* properties for central text box */ | ||
.content_background_wrapper{ | .content_background_wrapper{ | ||
+ | overflow: hidden; | ||
+ | box-sizing: border-box; | ||
+ | /* REMOVE WITH NEW NAVIGATION */ | ||
+ | /* Avoid layout damage due to old navigation */ | ||
+ | clear: both; | ||
+ | } | ||
− | + | /* flows around all the content in the center of the screen */ | |
− | + | .page_content{ | |
− | + | margin: 20px 5px; | |
+ | box-sizing: border-box; /* allows for efficient paositioning of the elements within */ | ||
+ | } | ||
+ | /* flows around text in the page_content */ | ||
+ | .content_box{ | ||
+ | border-radius: 30px 60px; | ||
+ | overflow: hidden; | ||
+ | padding: 4%; | ||
+ | margin: 2em 0; | ||
+ | margin-bottom: 0; | ||
} | } | ||
− | . | + | |
− | + | ||
− | max-width: | + | /* flexbox: contains the whole dokuwiki image part and renders it readable |
+ | /* flexbox images are placed in one row and break the text. | ||
+ | /* allow placing of several images including caption in one row */ | ||
+ | .flexbox .thumb2 .thumbinner .thumbcaption { /*circumvents the iGEM tag thumbcaption*/ | ||
+ | font-size: 70%; | ||
+ | padding: 0 10px; | ||
+ | text-align: justify; | ||
+ | } | ||
+ | |||
+ | .image_box .thumb2 .thumbinner img{ | ||
+ | max-width: 100%; | ||
+ | } | ||
+ | |||
+ | /* see: https://css-tricks.com/snippets/css/a-guide-to-flexbox/*/ | ||
+ | .flexbox{ | ||
+ | display: flex; | ||
+ | margin: 5% 0; | ||
+ | justify-content: space-around; | ||
+ | flex-wrap: wrap; | ||
+ | align-content: center; | ||
+ | } | ||
+ | |||
+ | /* for DokuWiki image boxes this prevents a zickzack positioning of the flexbox childs when wrap occurs */ | ||
+ | a.media{ | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | |||
+ | /* contains images where text shall float around */ | ||
+ | .image_box{ | ||
+ | margin: 0.4em 0; | ||
+ | overflow: hidden; | ||
+ | font-size: 70%; | ||
+ | text-align: justify; | ||
+ | } | ||
+ | |||
+ | .image_box.left{ | ||
float: left; | float: left; | ||
− | + | margin-right: 3%; | |
− | + | ||
} | } | ||
− | . | + | .image_box.right{ |
− | + | float: right; | |
− | + | margin-left: 3% | |
− | + | ||
− | left: | + | |
} | } | ||
− | /* | + | /* prevents the floating of images out of the DokuWiki-sections */ |
+ | .level1, | ||
+ | .level2{ | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | |||
+ | /* references coming from DokuWiki */ | ||
+ | .footnotes{ | ||
+ | width: 90%; | ||
+ | margin: 2em auto 0 auto; | ||
+ | } | ||
+ | |||
+ | /* styling tables coming from dokuwiki */ | ||
+ | .content_box .table{ | ||
+ | margin: 2em 5%; | ||
+ | } | ||
+ | |||
+ | /* the element that can be used to style the table */ | ||
+ | .content_box .table .inline{ | ||
+ | font-size: 90%; | ||
+ | width: 100%; | ||
+ | border-collapse: collapse; | ||
+ | } | ||
+ | |||
+ | /* grey background for the header line */ | ||
+ | .content_box .table th{ | ||
+ | background-color: #DDD; | ||
+ | } | ||
+ | |||
+ | /* greyish background for every second row */ | ||
+ | .content_box .table tr:nth-child(odd){ | ||
+ | background-color: #EEE; | ||
+ | } | ||
+ | |||
+ | /* move text away from cell borders */ | ||
+ | .content_box .table td, | ||
+ | .content_box .table th{ | ||
+ | padding: 0 10px; | ||
+ | } | ||
+ | |||
+ | /* hovering efects */ | ||
+ | .content_box .table tr:hover{ | ||
+ | background-color: #D2D4F3; | ||
+ | } | ||
+ | |||
+ | /* === content_box2 for brick layout === */ | ||
+ | |||
+ | /* two content boxes in same line (sb) */ | ||
+ | .content_box2_parent { | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | .content_box2_child { | ||
+ | border-radius: 30px 60px; | ||
+ | display: inline-block; | ||
+ | background-color: #FFFFFF; | ||
+ | text-align: justify; | ||
+ | vertical-align: middle; | ||
+ | box-shadow: 1px 1px 10px #888; | ||
+ | -webkit-box-shadow: 1px 1px 10px #888; | ||
+ | -moz-box-shadow: 1px 1px 10px #888; | ||
+ | padding: 4%; | ||
+ | } | ||
+ | |||
+ | @media screen and (min-width: 601px){ | ||
+ | .content_box2_child{ | ||
+ | margin: 2em 1em 2em 1em; | ||
+ | width: 35%; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 600px){ | ||
+ | .content_box2_child{ | ||
+ | margin: 1em 0 0; | ||
+ | width: auto; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* === Floatboxes for two column layout === */ | ||
+ | |||
+ | .floatbox{ | ||
+ | width: 48%; /* 100% - 2*48% = 4% padding*/ | ||
+ | } | ||
+ | |||
+ | @media screen and (min-width: 601px){ | ||
+ | .floatbox.left{ | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | .floatbox.right{ | ||
+ | float: right; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 600px){ | ||
+ | .floatbox{ | ||
+ | float: none; | ||
+ | width: auto; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* ============= END: Important Site setup ============= */ | ||
Line 256: | Line 488: | ||
.page_content{ | .page_content{ | ||
− | color: # | + | color: #666666; |
− | font-family: | + | font-family: 'Roboto',sans-serif; |
− | font-style: normal; | + | font-style: normal; |
− | font-size: | + | font-weight: 300; |
− | line-height: 1. | + | font-size: 120%; |
+ | text-align: justify; | ||
+ | } | ||
+ | |||
+ | .page_content p{ | ||
+ | line-height: 1.8em; | ||
+ | margin-bottom: 2em; /*move next paragraph away vertically */ | ||
} | } | ||
− | |||
h1, h2, h3{ | h1, h2, h3{ | ||
− | + | ||
+ | font-family: "Roboto", sans-serif; | ||
+ | color: #C5162F; | ||
+ | font-size: 25px; | ||
+ | clear: both; | ||
+ | font-weight: 400; | ||
+ | line-height: 1.2; | ||
+ | border-bottom: 0; | ||
} | } | ||
+ | |||
+ | /* flows around text in the page_content */ | ||
+ | .content_box{ | ||
+ | background-color: #FFFFFF; | ||
+ | text-align: justify; | ||
+ | box-shadow: 1px 1px 10px #888; | ||
+ | -webkit-box-shadow: 1px 1px 10px #888; | ||
+ | -moz-box-shadow: 1px 1px 10px #888; | ||
+ | } | ||
+ | |||
+ | /* properties for central text box */ | ||
+ | .content_background_wrapper{ | ||
+ | |||
+ | /*background: #EEEDED;*/ | ||
+ | background: #FCFCFC; /*by mauri*/ | ||
+ | } | ||
+ | |||
+ | /* references coming from DokuWiki */ | ||
+ | .footnotes{ | ||
+ | font-size: 80%; | ||
+ | font-style: italic; | ||
+ | } | ||
+ | |||
+ | /* KOMMENTARFUNKTION */ | ||
+ | .kommentar{ | ||
+ | background-color: red; | ||
+ | color: black; | ||
+ | border: 2px solid black; | ||
+ | width: 100%; | ||
+ | clear: both; | ||
+ | } | ||
+ | .kommentar_stefan{ | ||
+ | background-color: #ff1493; | ||
+ | color: black; | ||
+ | font-size: 14px; | ||
+ | font-family: "Comic Sans MS"; | ||
+ | border: 2px solid black; | ||
+ | width: 100%; | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | /* ============= END: Text Styling ============= */ | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* ============= Background ============= */ | ||
+ | |||
+ | /* use central position as anchor for the vertical position of the side images */ | ||
+ | .central_position_wrap{ | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | /* define width and positioning of side images */ | ||
+ | .background_image_left, | ||
+ | .background_image_right{ | ||
+ | width: 150px; | ||
+ | position: absolute; | ||
+ | } | ||
+ | |||
+ | .background_image_left{ | ||
+ | top: 20% | ||
+ | } | ||
+ | |||
+ | .background_image_right{ | ||
+ | bottom: -20px; | ||
+ | right: 0; | ||
+ | } | ||
+ | |||
+ | /* float the right image to the right s.t. it fits to the window border */ | ||
+ | .background_image_right img{ | ||
+ | float: right; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* === Background: Responsive Design === */ | ||
+ | |||
+ | /* hide side images if screen is too small */ | ||
+ | @media only screen and (max-width: 1320px){ | ||
+ | .background_image_left, | ||
+ | .background_image_right{ | ||
+ | display: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* adapt box width s.t. it fits the screen but has a maximum width of 1000px --jb*/ | ||
+ | @media only screen and (min-width: 1021px){ | ||
+ | /* style for browsers wider than 1000px */ | ||
+ | /* the 20px come from the scrollbar */ | ||
+ | .page_content{ | ||
+ | width: 1000px; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | } | ||
+ | @media only screen and (max-width: 1020px){ | ||
+ | /* style for browsers smaller than 1000px */ | ||
+ | .page_content{ | ||
+ | width: intrinsic; | ||
+ | width: moz-fit-content; | ||
+ | width: -webkit-fit-content; | ||
+ | width: fit-content; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* === END: Background: Responsive Design === */ | ||
+ | |||
+ | /* ============= END: Background ============= */ | ||
+ | |||
+ | |||
+ | |||
Line 272: | Line 632: | ||
/* ============= Full Width Banners ============= */ | /* ============= Full Width Banners ============= */ | ||
#banner_home{ | #banner_home{ | ||
− | + | margin:0; | |
− | + | padding: 0px; | |
− | + | background-image: url("../wiki/images/8/89/Freiburg_frontpage_banner.jpg"); | |
− | + | background-repeat: no-repeat; | |
− | + | background-size: cover; | |
− | + | width: 100%; | |
− | + | height: 400px; | |
} | } | ||
#banner_team{ | #banner_team{ | ||
− | + | margin:0; | |
− | + | padding: 0px; | |
− | + | background-image: url("../wiki/images/e/e7/FreiburgTeam2015.jpg"); | |
− | + | background-repeat: no-repeat; | |
− | + | background-size: cover; | |
− | + | width: 100%; | |
− | + | height: 400px; | |
} | } | ||
#banner_labjournal{ | #banner_labjournal{ | ||
− | + | margin:0; | |
− | + | padding: 0px; | |
− | + | background-image: url("https://static.igem.org/mediawiki/2015/d/dc/Labjournal.jpg"); | |
− | + | background-repeat: no-repeat; | |
− | + | background-size: cover; | |
− | + | width: 100%; | |
− | + | height: 400px; | |
} | } | ||
/* ============= END: Full Width Banners ============= */ | /* ============= END: Full Width Banners ============= */ | ||
− | + | ||
− | + | ||
− | */ | + | |
− | . | + | |
− | + | /* =================== Footer =================== */ | |
− | + | ||
− | + | .content_footer{ | |
− | + | background: #0051A2 scroll; | |
+ | width: 100%; | ||
+ | height: 75px; | ||
} | } | ||
− | . | + | .contacts{ |
− | width: | + | width: 320px; |
− | + | margin: 0 auto; | |
− | + | display: flex; | |
− | - | + | justify-content: space-around; |
− | + | display: -webkit-flex; /*Safari*/ | |
− | + | -webkit-justify-content: space-around; /* Safari 6.1+ */ | |
− | + | ||
− | -webkit- | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | #uni a img, | |
− | + | #bioss a img, | |
+ | #facebook a img, | ||
+ | #email a img{ | ||
+ | max-height: 40px | ||
} | } | ||
− | + | #uni, | |
− | + | #bioss, | |
− | + | #facebook, | |
− | + | #email{ | |
− | - | + | padding-top: 15px; |
− | - | + | padding-right:10px; |
− | + | ||
− | + | ||
} | } | ||
− | + | /* gap between social links and uni links */ | |
− | + | #facebook{ | |
− | + | padding-right: 40px; | |
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | /* The html for the footer is included in wiki_content-end! */ | |
− | + | ||
− | + | /* =================== END: Footer =================== */ | |
− | + | ||
− | + | #head { | |
− | + | height: 0px; | |
} | } | ||
− | + | ||
− | + | ||
− | + | /* ============== BEGIN:CSS classes and ids for Human Practice =============*/ | |
+ | #recipe { | ||
+ | width: 80%; | ||
} | } | ||
+ | /* ============== END:CSS classes and ids for Human Practice =============*/ | ||
− | + | ||
− | + | /* ============== BEGIN:CSS for back-button =============*/ | |
− | + | .button_back { | |
− | + | margin-left: -14%; | |
+ | margin-top: 5%; | ||
+ | padding: 3px 5px 5px 0px; | ||
+ | width: 10%; | ||
+ | line-height: 1.5em; | ||
+ | text-align: center; | ||
+ | background-color: #0051A2; | ||
+ | border-radius: 30px 15px 15px 30px; | ||
+ | border: 1px groove #004081; | ||
+ | float: left; | ||
} | } | ||
− | . | + | |
− | + | .white_link { | |
+ | color: #FFF; | ||
} | } | ||
+ | /* ============== END:CSS for back-button =============*/ | ||
+ | |||
+ | </style> | ||
+ | |||
+ | <!-- INITIALIZE UPWARDS BLOB, SO ITS TOP REFERENCES TO DOCUMENT TOP --> | ||
+ | |||
+ | <style> | ||
+ | |||
+ | /* upwards navigation blob */ | ||
− | + | #upwards_blob{ | |
− | + | display: none; | |
− | + | } | |
+ | |||
+ | /* min-width is chosen so the blob does just not interfere with the content box */ | ||
+ | /* 1021 content_box-width + 46 blob-width + 20 scrollbar + some buffer space */ | ||
+ | @media screen and (min-width: 1144px){ | ||
+ | #upwards_blob{ | ||
+ | transition: transform 0.5s ease; | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | right: -100px; | ||
+ | z-index: 1000; | ||
+ | } | ||
} | } | ||
− | |||
− | |||
− | |||
</style> | </style> | ||
− | < | + | <div id="upwards_blob"><a href="#globalWrapper"><img src="https://static.igem.org/mediawiki/2015/9/93/Freiburg_upwards_blob.png"></a></div> |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</html> | </html> |
Revision as of 23:10, 9 September 2015