style.css

/******************************************************************************
CSS for the R4Epi textbook
******************************************************************************/

/*
CSS that came with bookdown
*/
p.caption {
  color: #777;
  margin-top: 10px;
}
p code {
  white-space: inherit;
}
pre {
  word-break: normal;
  word-wrap: normal;
}
pre code {
  white-space: inherit;
}

/* 
Font Styles
*/
.large-bold {
  font-size: 2em;
  font-weight: bold;
}

.underline {
  text-decoration: underline;
}

.red-text {
  color: red;
}

.u-orange-text {
  color: #ae6042;
}

.u-blue-text {
  color: #4e738a;
}

.code {
  color: #0365C0;
  font-family: "Courier New", Courier, monospace;
}


/*
Note styles
2023-09-05: Padding needs to be a little different when applying these classes 
to a div vs a p. By default, a div will have more padding on bottom for some
reason. Creating a different style for p and for div prevents me from having
to go back through the chapters and change all of the note and warning p tags
to divs right now.
*/
p.note {
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  background-color: #f0f7fb;
  border: solid 1px #3498db;
  border-radius: 6px;
  line-height: 18px;
  overflow: hidden;
  padding: 15px 15px;
}

div.note {
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  background-color: #f0f7fb;
  border: solid 1px #3498db;
  border-radius: 6px;
  line-height: 18px;
  overflow: hidden;
  padding: 15px 15px 0px 15px;
  margin: 10px 0px 10px 0px;
}

p.warning {
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  background-color: #FEFBEA;
  border: solid 1px #F2E394;
  border-radius: 6px;
  line-height: 18px;
  overflow: hidden;
  padding: 15px 15px;
}

div.warning {
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  background-color: #FEFBEA;
  border: solid 1px #F2E394;
  border-radius: 6px;
  line-height: 18px;
  overflow: hidden;
  padding: 15px 15px 0px 15px;
  margin: 10px 0px 10px 0px;
}


/* 
Text box with construction stripes for chapters under construction.
Helpful websites: 
https://css-tricks.com/stripes-css/
https://stackoverflow.com/questions/10422949/css-background-opacity
*/
.under-construction {
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  /*background-color: rgba(248, 116, 49, 0.4);*/ /* Fourth number is opacity */
  background: repeating-linear-gradient(
    45deg,
    rgba(248, 116, 49, 0.1) /* Fourth number is opacity */,
    rgba(248, 116, 49, 0.1) 10px,
    rgba(169, 169, 169, 0.15) 10px,
    rgba(169, 169, 169, 0.15) 20px
  );
  border: solid 1px #F87431;
  border-radius: 6px;
  line-height: 26px;
  overflow: hidden;
  padding: 15px 15px 0px 15px;
  font-size: 24px;
  margin-bottom: 15px;
}


/*
Disable the title header from the index page.
https://stackoverflow.com/questions/53399095/disable-title-author-in-the-html-output-of-bookdown
*/
#header {
    display: none;
}