cse110-fa22-group29/source/static/ReviewDetails.css

/* ReviewDetails.css */

body{
  background-color: #13323b;
}

h1 {
  text-align: center;
}
.Top-Bar{
  margin-top: -8cm;
}
.Top-Bar > img{
  position: relative;
  top: 7.85cm;
}
.Top-Bar > h1{
  position: relative;
  top: 2.2cm;
  font-size: 3cm;
  color: #EAA9BC 

}
.Top-Bar > form{
  position: relative;
  left: 32cm;
}

.journal-form {
  font-size: 120%;
  width: 50%;
  display: none;
  margin: auto;
  color: #ccb3bb;
  border: 3px solid rgb(7, 0, 0);
  background-color: #b52754;
}

.meal-name {
  font-size: 150%;
  margin: left;
  width: 50%;
  border: 3px;
  color: rgb(228, 119, 119);
  text-align: left;
}

.hidden,
.rating:not(:checked) > input { /* Hide radio circles while star rating */
  display: none;
}

/* Unchecked stars */
.rating:not(:checked) > label {
  /* Make stars line up sideways and not vertically */
  float: right;

  /* Hide label text */
  width: 1em;
  overflow: hidden;
  white-space: nowrap;

  /* Star default color and size */
  font-size: 200%;
  line-height: 1.2;
  color: #b3b3cc;
}

.rating > label:active {
  position: relative;
}

.rating:not(:checked) > label::before {
  content: "★";
}

/* Checked star color */
.rating > input:checked ~ label {
  color: #ffbf00;
}

.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label {
  color: orangered;
}

.rating > input:checked + label:hover,
.rating > input:checked ~ label:hover,
.rating > input:checked + label:hover ~ label,
.rating > input:checked ~ label:hover ~ label,
.rating > label:hover ~ input:checked ~ label {
  color: orangered;
}