styles.css

Aus Infopedia
Wechseln zu:Navigation, Suche
K
 
(74 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
 +
/* Allgemein */
 
.randnotiz {
 
.randnotiz {
   border-top: solid 0.5rem #888;
+
  clear: right;
   padding: 0 !important;
+
   border-top: solid 0.5rem #aaa;
 +
   padding-top: 0.1rem;
 +
  padding-right: 0.5rem;
 +
  padding-bottom: 0.5rem;
 +
  padding-left: 0.5rem;
 +
  margin-top: 0.5rem;
 +
  overflow-wrap: break-word;
 +
  orphans: 6;
 +
  widows: 6;
 
}
 
}
  
.wichtig {
+
.randnotiz-icon {
 +
  float: left;
 +
  font-size: 1rem;
 +
  margin-top: 0;
 +
  padding: 0;
 +
  border: 0;
 +
  color: #aaa;
 +
  text-align: right;
 +
}
 +
 
 +
.randnotiz.wichtig,
 +
.randnotiz.ppoe {
 
   border-color: #b51f1f;
 
   border-color: #b51f1f;
 +
}
 +
 +
.randnotiz.wichtig i,
 +
.randnotiz.ppoe i {
 +
  color: #b51f1f;
 +
}
 +
 +
.randnotiz.biber {
 +
  border-color: #ad7e42;
 +
}
 +
 +
.randnotiz.biber i {
 +
  color: #ad7e42;
 +
}
 +
 +
.randnotiz.wiwoe {
 +
  border-color: #f7e400;
 +
}
 +
 +
.randnotiz.wiwoe i {
 +
  color: #f7e400;
 +
}
 +
 +
.randnotiz.gusp {
 +
  border-color: #009960;
 +
}
 +
 +
.randnotiz.gusp i {
 +
  color: #009960;
 +
}
 +
 +
.randnotiz.caex {
 +
  border-color: #353990;
 +
}
 +
 +
.randnotiz.caex i {
 +
  color: #353990;
 +
}
 +
 +
.randnotiz.raro {
 +
  border-color: #ce0026;
 +
}
 +
 +
.randnotiz.raro i {
 +
  color: #ce0026;
 +
}
 +
 +
/* Desktop */
 +
@media screen and (max-width: 576px) {
 +
.randnotiz {
 +
  border-bottom: solid 0.1rem #aaa;
 +
  border-left: solid 0.1rem #aaa;
 +
  border-right: solid 0.1rem #aaa;
 +
}
 +
 +
.randnotiz-icon {
 +
  text-align: left;
 +
  margin-right: 0.5rem;
 +
}
 +
}
 +
 +
@media screen and (min-width: 576px) {
 +
.randnotiz {
 +
  margin-left: 3rem !important;
 
}
 
}
  
 
.randnotiz-icon {
 
.randnotiz-icon {
 +
  float: right;
 +
  font-size: 1.5rem;
 
   position: absolute;
 
   position: absolute;
  font-size: 2rem;
+
   left: -3.5rem;
   left: 0rem;
+
   top: -1.4rem;
   top: 0rem;
+
   margin-left: 1rem;
   margin: 0 !important;
 
  padding: 0 !important;
 
 
}
 
}
 
.wichtig i {
 
  color: #b51f1f;
 
 
}
 
}
  
/* Desktop */
 
 
@media screen and (min-width: 1550px) {
 
@media screen and (min-width: 1550px) {
 
.randnotiz {
 
.randnotiz {
Zeile 27: Zeile 107:
 
   right: -200px;
 
   right: -200px;
 
   width: 250px;
 
   width: 250px;
 +
  margin-left: 0 !important;
 
}
 
}
 +
 +
.randnotiz-icon {
 +
  float: right;
 +
  font-size: 2rem;
 +
  position: absolute;
 +
  left: -4rem;
 +
  top: -1.8rem;
 
}
 
}
 +
}
 +
 +
/* Print */
 +
@media print {
 +
.randnotiz {
 +
  float: right;
 +
  position: relative;
 +
  width: 15%;
 +
  right: -20%;
 +
}
 +
 +
.randnotiz-icon {
 +
  float: left;
 +
  font-size: 2rem;
 +
  position: relative;
 +
  top: -1.6rem;
 +
  left: -3.6rem;
 +
  margin-right: -3rem;
 +
}
 +
}
 +
 +
/* Ausblenden Randnotiz in der Druckansicht, wenn Verweis in einer Liste erfolgt */
 +
li > .verweis.randnotiz { display: none !important; }

Aktuelle Version vom 1. Oktober 2022, 22:25 Uhr

/* Allgemein */
.randnotiz {
  clear: right;
  border-top: solid 0.5rem #aaa;
  padding-top: 0.1rem;
  padding-right: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 0.5rem;
  margin-top: 0.5rem;
  overflow-wrap: break-word;
  orphans: 6;
  widows: 6;
}

.randnotiz-icon {
  float: left;
  font-size: 1rem;
  margin-top: 0;
  padding: 0;
  border: 0;
  color: #aaa;
  text-align: right;
}

.randnotiz.wichtig,
.randnotiz.ppoe {
  border-color: #b51f1f;
}

.randnotiz.wichtig i,
.randnotiz.ppoe i {
  color: #b51f1f;
}

.randnotiz.biber {
  border-color: #ad7e42;
}

.randnotiz.biber i {
  color: #ad7e42;
}

.randnotiz.wiwoe {
  border-color: #f7e400;
}

.randnotiz.wiwoe i {
  color: #f7e400;
}

.randnotiz.gusp {
  border-color: #009960;
}

.randnotiz.gusp i {
  color: #009960;
}

.randnotiz.caex {
  border-color: #353990;
}

.randnotiz.caex i {
  color: #353990;
}

.randnotiz.raro {
  border-color: #ce0026;
}

.randnotiz.raro i {
  color: #ce0026;
}

/* Desktop */
@media screen and (max-width: 576px) {
.randnotiz {
  border-bottom: solid 0.1rem #aaa;
  border-left: solid 0.1rem #aaa;
  border-right: solid 0.1rem #aaa;
}

.randnotiz-icon {
  text-align: left;
  margin-right: 0.5rem;
}
}

@media screen and (min-width: 576px) {
.randnotiz {
  margin-left: 3rem !important;
}

.randnotiz-icon {
  float: right;
  font-size: 1.5rem;
  position: absolute;
  left: -3.5rem;
  top: -1.4rem;
  margin-left: 1rem;
}
}

@media screen and (min-width: 1550px) {
.randnotiz {
  position: absolute;
  right: -200px;
  width: 250px;
  margin-left: 0 !important;
}

.randnotiz-icon {
  float: right;
  font-size: 2rem;
  position: absolute;
  left: -4rem;
  top: -1.8rem;
}
}

/* Print */
@media print {
.randnotiz {
  float: right;
  position: relative;
  width: 15%;
  right: -20%;
}

.randnotiz-icon {
  float: left;
  font-size: 2rem;
  position: relative;
  top: -1.6rem;
  left: -3.6rem;
  margin-right: -3rem;
}
}

/* Ausblenden Randnotiz in der Druckansicht, wenn Verweis in einer Liste erfolgt */
li > .verweis.randnotiz { display: none !important; }