style.scss

---
---

//
// IMPORTS
//
@import "variables";
@import "bulma";
//@import "reset";

// Syntax highlighting @import is at the bottom of this file

/**************/
/* BASE RULES */
/**************/


/*hr{
	-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #aaa -moz-use-text-color -moz-use-text-color;
    border-image: none;
    border-style: dotted none none;
    border-width: 1px 0 0;
    box-sizing: content-box;
    height: 0;
}*/
    
    
    
    
/**************/
/* index     */
/**************/


/**************/
/* Footer     */
/**************/

.footer{
	border-top: solid 1px $mi-pink;
	
	.menu-list{
		a{
			padding-left: 0;
			font-size: $bfs * 0.6;
		}
	}
}

/**************/
/* Content    */
/**************/

*{
	word-wrap: normal;
	hyphens: auto;
}
	
.section{
	padding-top: $bfs;
}

.section:nth-of-type(2){
	padding-top: $bfs *2;
}



.content{
	
	p, li{
		max-width: $bfs * 36;		
	}



	h1{ font-size: $bfs * 1.4; font-weight: 500;}
	h2{ font-size: $bfs * 1.2; font-weight: 500;}
	h3{ font-size: $bfs * 1.1; font-weight: 500;}
	h4{ font-size: $bfs; font-weight: 600;}
	h5{ font-size: $bfs; font-weight: 600;}
	h6{ font-size: $bfs; font-weight: 600; }
	
	ul{
		margin-left: 1em;
	}
	
	dt {
		display: block;
		float: left;
		min-width: 10px;
		padding: $bfs /4 0;
		font-weight: bold;
		color: $info;
	}
	
	dd{
		border-bottom: solid 1px $grey-light;
		padding: $bfs /4 0;
		
	}
	
	dt::after{
		content: ":";
		display: inline-block;
		padding-right: $bfs /4;
  }
  
  dt.long-item{
    float: none;
    padding-bottom: 0;
  }

  dd.long-item{
    padding-top: 0;
  }
	
	table{

		a, a:not(.button){ border: none; }
		th{ font-weight: 600; }
		.border{
			th, td{
				border: none;
			}
    }
    .no-wrap{
      white-space: nowrap
    }

    & .is-tight{
      td{
        padding-top: $bfs / 4;
        padding-bottom: $bfs / 4;
      }
    }

    & .is-tight.last-item{
      td{
        padding-bottom: $bfs / 2;
      }
    }

    &.is-naked{
			th, td{
				border: none;
      }
      .has-top-border{
        border-top: solid 1px $border;
      }
    }
	}
	
	table{
    @extend .table;
    
	}
	
	table.tab-schwerpunktmodule{
		th{
			width: 40%;
		}
		
		th + th + th{
			width: 20%;
		}
	}
	
	.footnotes{
		border-top: solid 1px #9313ce;
		padding-bottom: $bfs;
		border-bottom: solid 1px #9313ce;
	}
	
	.img-responsive{
		width: 100%;
	}
	
	figure{
		border-top: dotted 1px $mi-gruen;
		padding-top: $bfs;
		margin-top: $bfs;
		figcaption{
			display: block;
			padding-bottom: $bfs /2;
			padding-top: $bfs;
			margin-bottom: $bfs;
			font-style: normal;
			color: $mi-gruen;
			border-top: dotted 1px $mi-gruen;
		}		
	}

	
	td.pm{
		background-color: $mi-blau;
	}
	
	td.spp{
		background-color: $mi-gruen;
	}
	
	td.spmw, td.spm{
		background-color: $mi-pink;
	}
	
	td.pm-grau, td.wpm{
		background-color: lighten($mi-black, 50%);
	}
	
	.lighten{
		* {
			color: #aaa;
		}
	}
	
}

#selbstbericht{
	
	
	
	counter-reset: h1counter;
    
    h1{
	    counter-increment: h1counter;
	    counter-reset: h2counter; 
	    &:before{ content: counter(h1counter) ".\0000a0"; }
    }
    
    h2{
		counter-increment: h2counter;
		counter-reset: h3counter;
		&:before{ content: counter(h1counter) "." counter(h2counter) ".\0000a0"; }
    }
    
    h3{
		counter-increment: h3counter;
		&:before{ content: counter(h1counter) "." counter(h2counter) "." counter(h3counter) ".\0000a0"; }
    }
    
    h4{
		counter-increment: h4counter;
		&:before{ content: counter(h1counter) "." counter(h2counter) "." counter(h3counter) "." counter(h4counter) ".\0000a0"; }
    }


}

.modulbeschreibung{
	h2{
		border-top: dotted 1px $grey-light;
		padding-top: $bfs;
	}
}

.toc{
	border-left: solid 1px $mi-pink;
	
	.menu-list{
		padding-left: $bfs *2;
	}
}

.is-old *{
	color: $mi-gruen !important;
}

.is-passive *{
	color: $mi-lila !important;
}

.is-small{
	font-size: 80%;
}

.is-less-important{
	opacity: 0.7;
}

.is-hidden{
	display: none;
}


.more-button{
	font-size: $bfs * 1.5 !important;
	display: inline-block;
	margin-left: $bfs /2;
	transition: all 0.5s;
	&:hover{
		cursor: pointer;
	}
	
	&.active{
		transform: rotate(180deg);
	}
}

@media (max-width: 640px) { 
	html, body{
		font-size: 80%;
		
		.content{
			h1{ font-size: $bfs * 1.2; font-weight: 500;}
			h2{ font-size: $bfs * 1.1; font-weight: 500;}
			h3{ font-size: $bfs * 1.1; font-weight: 500;}
			h4{ font-size: $bfs; font-weight: 600;}
			h5{ font-size: $bfs; font-weight: 600;}
			h6{ font-size: $bfs; font-weight: 600; }
		}
	}
}

@media print {
	html, body{
		font-size: 8pt !important;
	}
   section.hero, .is-non-print{
	   display: none;
   }
}

@media screen {
   .is-print{
	   display: none;
   }
}


// Settled on moving the import of syntax highlighting to the bottom of the CSS
// ... Otherwise it really bloats up the top of the CSS file and makes it difficult to find the start
//@import "highlights";
@import "svg-icons";

.highlight {
    background-color: $mi-pink;
    color: #fff;
    border: none;
    box-shadow: none;
    margin: 20px 0;
    overflow: auto;
    padding: 7px 7px 7px 10px;
}

pre code{
	background-color: transparent;
	color: #fff;
}

/* Für die fianle Version werden ein paar Angaben nicht gezeigt */
.bearbeiten, .doc-status{
	display: none;
}

#admin{
	padding: $bfs 0;
}

.content .subtitle{
	margin-top: -$bfs !important;
	color: $mi-blau !important;
	margin-bottom: $bfs * 2;
}

.content{
	h3.module-title{
		font-size: $bfs * 0.8;
		margin-bottom: $bfs * 0.25;
	}
}

.studienverlaufsplan{
	font-size: smaller;
	
	th, td{
		padding: 0 2px !important;
	}

	th{
		font-weight: normal !important;

		ul{
			margin-top: 0;
			margin-bottom: 2px;
		}
	}

	td{
		text-align: center;
	}

	.is-fs-1,.is-fs-3, .is-fs-5{
		background-color: rgba(0,0,0,0.1);
	}

	.unit{
		th, td{
			background-color: rgba(0,0,0,0.7);
			color: #fff;
			padding: 2px 5px !important;
		}
	}

	thead{
		tr{
			background-color: $mi-black;
			td, th{
				color: #fff;
				padding: 2px 5px !important;
				font-weight: bold;;
			}
		}
	}
}