styled fiex and some mediaqueries added
authorStefania Trabucchi <info@trabucchi.de>
Thu, 23 Jan 2014 14:49:17 +0100
changeset 2124610f9f5ee5b
parent 211 326c1a9fc102
child 213 1871ef3bee34
child 215 76d113bdb8c7
styled fiex and some mediaqueries added
static/css/bootstrap.css
static/less/pymove3d.less
     1.1 --- a/static/css/bootstrap.css	Thu Jan 23 14:47:35 2014 +0100
     1.2 +++ b/static/css/bootstrap.css	Thu Jan 23 14:49:17 2014 +0100
     1.3 @@ -206,7 +206,7 @@
     1.4    img {
     1.5      max-width: 100% !important;
     1.6    }
     1.7 -  @page {
     1.8 +  @page  {
     1.9      margin: 2cm .5cm;
    1.10    }
    1.11    p,
    1.12 @@ -1577,6 +1577,7 @@
    1.13    margin: 4px 0 0;
    1.14    margin-top: 1px \9;
    1.15    /* IE8-9 */
    1.16 +
    1.17    line-height: normal;
    1.18  }
    1.19  input[type="file"] {
    1.20 @@ -5989,6 +5990,7 @@
    1.21  ------------------------------------ */
    1.22  #wrap > .container {
    1.23    /*padding: 60px 15px 0;*/
    1.24 +
    1.25  }
    1.26  img {
    1.27    vertical-align: middle;
    1.28 @@ -6044,10 +6046,13 @@
    1.29  .module-course {
    1.30    background-color: #f5f5f5;
    1.31  }
    1.32 -.module-cite {
    1.33 +.module-info {
    1.34    border-bottom: 1px solid #fdc91a;
    1.35    padding-bottom: 20px;
    1.36  }
    1.37 +.module-cite {
    1.38 +  padding-bottom: 20px;
    1.39 +}
    1.40  .cite {
    1.41    position: relative;
    1.42  }
    1.43 @@ -6060,9 +6065,45 @@
    1.44  .cite-right svg {
    1.45    margin-top: -48px;
    1.46  }
    1.47 +.module-impression {
    1.48 +  background: #125883;
    1.49 +}
    1.50 +.module-impression a {
    1.51 +  color: white;
    1.52 +}
    1.53 +.module-thumbnail,
    1.54 +.module-impression h3 {
    1.55 +  margin-top: 20px;
    1.56 +}
    1.57 +.module-footer .headline {
    1.58 +  padding: 20px 0;
    1.59 +}
    1.60 +/* Video
    1.61 +------------------------------------ */.flex-video {
    1.62 +  position: relative;
    1.63 +  padding-top: 25px;
    1.64 +  padding-bottom: 67.5%;
    1.65 +  height: 0;
    1.66 +  margin-bottom: 16px;
    1.67 +  overflow: hidden;
    1.68 +}
    1.69 +.flex-video.widescreen {
    1.70 +  padding-bottom: 57.25%;
    1.71 +}
    1.72 +.flex-video.vimeo {
    1.73 +  padding-top: 0;
    1.74 +}
    1.75 +.flex-video iframe,
    1.76 +.flex-video object,
    1.77 +.flex-video embed {
    1.78 +  position: absolute;
    1.79 +  top: 0;
    1.80 +  left: 0;
    1.81 +  width: 100%;
    1.82 +  height: 100%;
    1.83 +}
    1.84  /* Footer
    1.85 ------------------------------------- */
    1.86 -#footer {
    1.87 +------------------------------------ */#footer {
    1.88    height: 60px;
    1.89  }
    1.90  .sponsor {
    1.91 @@ -6084,3 +6125,17 @@
    1.92    border-top: 1px solid #f5f5f5;
    1.93    padding: 20px 0;
    1.94  }
    1.95 +/* media queries
    1.96 +------------------------------------ */@media (max-width: 767px) {
    1.97 +  .module-gallery .module-content {
    1.98 +    height: 376px;
    1.99 +  }
   1.100 +  .module-impression svg {
   1.101 +    display: none;
   1.102 +  }
   1.103 +}
   1.104 +@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
   1.105 +  .flex-video {
   1.106 +    padding-top: 0;
   1.107 +  }
   1.108 +}
     2.1 --- a/static/less/pymove3d.less	Thu Jan 23 14:47:35 2014 +0100
     2.2 +++ b/static/less/pymove3d.less	Thu Jan 23 14:49:17 2014 +0100
     2.3 @@ -85,22 +85,53 @@
     2.4  li.module-language a:first-child {border-right:1px solid @blue;}
     2.5  .module-course {background-color: #f5f5f5;}
     2.6  
     2.7 -.module-cite {border-bottom:1px solid @yellow;padding-bottom:20px;}
     2.8 +.module-info {border-bottom:1px solid @yellow;padding-bottom:20px;}
     2.9 +.module-cite {padding-bottom:20px;}
    2.10 +
    2.11  
    2.12  .cite {position:relative;}
    2.13  .cite-left {top: 6px;}
    2.14  .cite-right {top:48px;}
    2.15  .cite-right svg {margin-top: -48px;}
    2.16 +
    2.17 +.module-impression {background:@blue;}
    2.18 +.module-impression a {color:white;}
    2.19 +.module-thumbnail,
    2.20 +.module-impression h3 {margin-top:20px;}
    2.21 +.module-footer .headline {padding:20px 0;}
    2.22 +
    2.23 +/* Video
    2.24 +------------------------------------ */ 
    2.25 +.flex-video {
    2.26 +position: relative;
    2.27 +padding-top: 25px;
    2.28 +padding-bottom: 67.5%;
    2.29 +height: 0;
    2.30 +margin-bottom: 16px;
    2.31 +overflow: hidden;
    2.32 +}
    2.33 + 
    2.34 +.flex-video.widescreen { padding-bottom: 57.25%; }
    2.35 +.flex-video.vimeo { padding-top: 0; }
    2.36 + 
    2.37 +.flex-video iframe,
    2.38 +.flex-video object,
    2.39 +.flex-video embed {
    2.40 +position: absolute;
    2.41 +top: 0;
    2.42 +left: 0;
    2.43 +width: 100%;
    2.44 +height: 100%;
    2.45 +}
    2.46 +
    2.47  /* Footer
    2.48  ------------------------------------ */ 
    2.49  #footer {
    2.50    height: 60px;
    2.51  }
    2.52 -
    2.53  .sponsor{
    2.54    height: 50px;
    2.55  }
    2.56 -
    2.57  #footer > .container {
    2.58    padding-left: 15px;
    2.59    padding-right: 15px;
    2.60 @@ -113,4 +144,17 @@
    2.61    background-image:none;
    2.62    filter: 0;
    2.63  }
    2.64 -.module-imprint {border-top:1px solid #f5f5f5; padding:20px 0;}
    2.65 \ No newline at end of file
    2.66 +.module-imprint {border-top:1px solid #f5f5f5; padding:20px 0;}
    2.67 +
    2.68 +/* media queries
    2.69 +------------------------------------ */ 
    2.70 +@media (max-width: 767px) {
    2.71 +.module-gallery .module-content {
    2.72 +    height: 376px;
    2.73 +    }
    2.74 +.module-impression svg {display:none;}
    2.75 +}
    2.76 +
    2.77 +@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
    2.78 +.flex-video { padding-top: 0; }
    2.79 +}
    2.80 \ No newline at end of file
Impressum Datenschutzerklärung