lortza/sorrygirl

View on GitHub
app/assets/stylesheets/apologies.scss

Summary

Maintainability
Test Coverage
@import 'theme';

.show-share-partial { text-align: center; }
$apology-width: 650px;

.apology-wrapper {
  width: $apology-width;
  margin: 0 auto;

  .create-button-wrapper {
    float: right;
    margin-bottom: 10px;
  }
  .index-image {
    width: 40px;
  }
}
.apology-container {
  width: $apology-width;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  font-family: $apology-font;
  border: 1px solid #A1A1A1;
  background-color: #FFF;
  height: 400px;
}
.right-column {
  width: $apology-width / 2;
  padding: 30px 30px 5px 10px;
  overflow-wrap: break-word;
  .note {
    font-family: $apology-font;
    font-size: 1.3em;
    line-height: 140%;
  }
}


/* MEDIA QUERIES */

@media screen and (max-device-width: 480px) and (orientation: portrait) {
  .apology-wrapper {
    width: 100%;
    margin: 0 auto;
  } 
  article {
    .note {
      padding: 20px 20px 5px 20px;
      p {
        font-family: $apology-font;
        font-size: 130%;
        line-height: 150%;
      } 
    } 
    img {
       max-height: 650px;
       width: 100%;
       margin-bottom: 30px;
     } 
  } 
}/* 480px */