Difference between revisions of "Template:Tartu TUIT/style"

 
(5 intermediate revisions by the same user not shown)
Line 16: Line 16:
 
   cursor: pointer; }
 
   cursor: pointer; }
  
.cols::after, header.header::after, #process .content::after, #molecule .map .card::after, .notebook .images-two::after, .notebook .images-height::after, .notebook .event .details::after, .clearfix::after {
+
.cols::after, .experiment::after, header.header::after, #process .content::after, #molecule .map .card::after, .notebook .images-two::after, .notebook .images-height::after, .notebook .event .details::after, .clearfix::after {
 
   content: '';
 
   content: '';
 
   display: table;
 
   display: table;
Line 62: Line 62:
  
 
body h2, body h2, body h3, body h4 {
 
body h2, body h2, body h3, body h4 {
   color: #dde5ee; }
+
   color: #dde5ee;
 +
  font-family: 'Roboto' !important; }
 +
 
 +
body li {
 +
  margin-bottom: 0; }
  
 
h2, .article h2 {
 
h2, .article h2 {
Line 106: Line 110:
 
     vertical-align: super;
 
     vertical-align: super;
 
     padding: 0px 0px; }
 
     padding: 0px 0px; }
 +
  .article img {
 +
    max-width: 100%; }
 
   .article ol.fancy.cols {
 
   .article ol.fancy.cols {
 
     margin-left: -2%;
 
     margin-left: -2%;
Line 218: Line 224:
 
     box-shadow: 0 0 5px #fff, 0 0 10px #50b1be, 0 0 15px #50b1be, 0 0 17px #50b1be, 0 0 30px #50b1be; }
 
     box-shadow: 0 0 5px #fff, 0 0 10px #50b1be, 0 0 15px #50b1be, 0 0 17px #50b1be, 0 0 30px #50b1be; }
  
.interview {
+
.interviews .interview {
 
   display: none; }
 
   display: none; }
  .interview ul {
+
 
    list-style-type: none;
+
.interview ul {
    margin: 0; }
+
  list-style-type: none;
    .interview ul li {
+
  margin: 0; }
      padding: 3px 0;
+
  .interview ul li {
      line-height: 25px;
+
    padding: 3px 0;
      position: relative; }
+
    line-height: 25px;
      .interview ul li::before {
+
    position: relative; }
        text-shadow: 0 0 5px #50b1be, 0 0 10px #50b1be;
+
    .interview ul li::before {
        content: '?';
+
      text-shadow: 0 0 5px #50b1be, 0 0 10px #50b1be;
        border-radius: 100%;
+
      content: '?';
        color: #dde5ee;
+
      border-radius: 100%;
        font-weight: 900;
+
      color: #dde5ee;
        font-size: 24px;
+
      font-weight: 900;
        padding: 3px;
+
      font-size: 24px;
        line-height: 20px;
+
      padding: 3px;
        left: -30px;
+
      line-height: 20px;
        top: 5px;
+
      left: -30px;
        position: absolute; }
+
      top: 5px;
      .interview ul li::after {
+
      position: absolute; }
        content: '';
+
    .interview ul li::after {
        clear: both;
+
      content: '';
        display: table; }
+
      clear: both;
  .interview img {
+
      display: table; }
    float: left;
+
 
    height: 150px;
+
.interview .person img {
    margin-right: 40px;
+
  float: left;
    margin-bottom: 40px;
+
  height: 150px;
    border-top-left-radius: 50px; }
+
  margin-right: 40px;
  .interview .name {
+
  margin-bottom: 40px;
    font-weight: 100;
+
  border-top-left-radius: 50px; }
    font-size: 36px;
+
 
    padding-bottom: 10px; }
+
.interview .person .name {
  .interview .position {
+
  font-weight: 100;
    font-size: 16px; }
+
  font-size: 36px;
  .interview .questions {
+
  padding-bottom: 10px; }
    clear: both; }
+
 
  .interview .question {
+
.interview .person .position {
    font-style: italic;
+
  font-size: 16px; }
    margin-bottom: 10px;
+
 
    color: #9ad2da; }
+
.interview .questions {
   .interview .answer {
+
  clear: both; }
     margin-bottom: 30px; }
+
 
 +
.interview .question {
 +
  font-style: italic;
 +
  margin-bottom: 10px;
 +
  color: #9ad2da; }
 +
 
 +
.interview .answer {
 +
  margin-bottom: 30px; }
 +
   .interview .answer img {
 +
     max-width: 100%; }
 +
 
 +
.experiment .time {
 +
  text-align: center;
 +
  padding-bottom: 30px; }
 +
  .experiment .time i {
 +
    padding-right: 7px; }
 +
 
 +
.experiment .ingredients, .experiment .tools {
 +
  width: 50%;
 +
  float: left;
 +
  padding-left: 5%; }
 +
  .experiment .ingredients li, .experiment .tools li {
 +
    text-align: left; }
 +
 
 +
.experiment .steps::before {
 +
  content: '';
 +
  clear: both;
 +
  display: table; }
  
 
header.header {
 
header.header {
Line 432: Line 465:
 
       top: 0px;
 
       top: 0px;
 
       z-index: 1; }
 
       z-index: 1; }
     .nav-shown .navigation {
+
     .nav-shown header.header .navigation {
 
       opacity: 1;
 
       opacity: 1;
 
       transform: translateX(0); }
 
       transform: translateX(0); }
     .nav-shown .nav-button i {
+
     .nav-shown header.header .nav-button i {
 
       background-color: transparent; }
 
       background-color: transparent; }
     .nav-shown .nav-button i::before {
+
     .nav-shown header.header .nav-button i::before {
 
       transform: translateY(0) rotate(-45deg); }
 
       transform: translateY(0) rotate(-45deg); }
     .nav-shown .nav-button i::after {
+
     .nav-shown header.header .nav-button i::after {
 
       transform: translateY(0) rotate(45deg); } }
 
       transform: translateY(0) rotate(45deg); } }
  
Line 844: Line 877:
 
   box-shadow: 0 0 5px #fff, 0 0 10px #50b1be, 0 0 15px #50b1be, 0 0 17px #50b1be, 0 0 30px #50b1be; }
 
   box-shadow: 0 0 5px #fff, 0 0 10px #50b1be, 0 0 15px #50b1be, 0 0 17px #50b1be, 0 0 30px #50b1be; }
  
.notebook-blue .actions {
+
.actions {
 
   text-align: center;
 
   text-align: center;
 
   padding: 50px; }
 
   padding: 50px; }
   .notebook-blue .actions .button {
+
   .actions .button {
 
     box-shadow: 0 0 5px #fff, 0 0 10px #50b1be, 0 0 15px #50b1be, 0 0 17px #50b1be, 0 0 30px #50b1be;
 
     box-shadow: 0 0 5px #fff, 0 0 10px #50b1be, 0 0 15px #50b1be, 0 0 17px #50b1be, 0 0 30px #50b1be;
 
     background-color: #dde5ee;
 
     background-color: #dde5ee;
Line 853: Line 886:
 
     text-decoration: none;
 
     text-decoration: none;
 
     padding: 20px; }
 
     padding: 20px; }
 
  
 
</style>
 
</style>

Latest revision as of 12:38, 5 November 2018