znamenica/dneslov

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

Summary

Maintainability
Test Coverage
@import "defines";

body {
   .description {
      strong {
         font-weight: bolder;
      }

      em {
         font-style: italic;
      }

      p, ul, ol, h1, h2, h3, h4 {
         padding-top: 0.5rem;
         margin: 0;

         &:first-child {
            padding-top: 0;
            margin-top: 0;
         }
      }

      ul, ol {
         padding-left: 2rem;
         display: block;
         -webkit-margin-start: 0;
         -webkit-margin-end: 0;
         -webkit-padding-start: 2rem;

         ul {
            li {
               display: list-item;
               text-align: -webkit-match-parent;
            }
         }
      }

      ul {
         li {
            list-style-type: circle;
         }
      }

      h1 {
         font-size: 200%;
         margin: 0;
         padding-bottom: 1rem;
      }

      h2 {
         font-size: 150%;
         margin: 0;
         padding-bottom: 0.8rem;
      }

      h3 {
         font-weight: bolder;
         font-size: 100%;
         margin: 0;
         padding-bottom: 0.5rem;
      }

      h4 {
         font-style: italic;
         font-size: 100%;
         margin: 0;
         padding-bottom: 0.2rem;
      }
   }

   .name {
      margin: 0;

      &.short {
         font-weight: 500;
      }

      &.first {
         font-weight: 500;
      }

      &.nick {
         font-weight: 500;

         &::before {
            //content: '«';
         }

         &::after {
            //content: '»';
         }
      }

      &.last {
         font-style: italic;

         &::before {
            content: '(';
         }

         &::after {
            content: ')';
            padding-right: 0.2rem;
         }
      }

      &.feat {
         font-weight: 500;
      }

      &::after {
         content: ' ';
      }

      &:empty {
         display: none;

         &::before {
            content: none;
            display: none;
         }

         &::after {
            content: none;
            display: none;
         }
      }
   }

   input:not([type]),
   input[type=text]:not(.browser-default),
   input[type=password]:not(.browser-default),
   input[type=email]:not(.browser-default),
   input[type=url]:not(.browser-default),
   input[type=time]:not(.browser-default),
   input[type=date]:not(.browser-default),
   input[type=datetime]:not(.browser-default),
   input[type=datetime-local]:not(.browser-default),
   input[type=tel]:not(.browser-default),
   input[type=number]:not(.browser-default),
   input[type=search]:not(.browser-default),
   textarea.materialize-textarea {
      font-size: inherit;
   }

   .collection {
      .collection-item {
         &.memory, &.event, &.description {
            min-height: auto;
            padding: 0;
            line-height: inherit;
            background-color: $book;
            color: $dark;

            .collapsible-header {
               padding: 0 1rem 0 1rem;
               line-height: 300%;
               background-color: $book;
               min-height: 3.3rem;
               display: block;

               &:only-child {
                  cursor: default;
                  //pointer-events: none;
                  background-color: #f9f9f9;
               }
            }

            .collapsible-body {
               cursor: pointer !important;

               padding: 1rem;
               height: 0;
               max-height: 0;

               &:empty {
                  display: none !important;
               }

               .row {
                  margin-bottom: 0;
               }

               .container {
                  width: 100%;
               }
            }
         }

         &.memory {
            .collapsible-header {
               padding-left: 3.5rem;
            }
         }

         &.active {
            .collapsible-body {
               height: auto;
               max-height: unset;
               display: inline-block;
            }
         }

         &.avatar:not(.circle-clipper) > .circle,
         &.avatar :not(.circle-clipper) > .circle {
            left: 0.1rem;
            top: 0.1rem;
            height: 3rem;
            width: 3rem;
            font-size: 150%;
            line-height: 200%;
         }
      }
   }

   .collection.popout {
      .collection-item {
         &.active {
            margin: 1rem 0.2rem;
         }
      }
   }

   .dates {
      padding-left: 2rem;

      .date.fixed-action-btn {
         position: relative;
         display: inline-block;
         padding: 0;
         top: 0;

         & > .chip {
            background-color: aliceblue;
         }

         ul {
            z-index: 1000;
            bottom: 1rem;

            .chip {
               background-color: antiquewhite;
            }
         }
      }
   }

   .carousel.compact {
      height: 16rem;

      .carousel-item {
         width: auto;
         cursor: pointer !important;
         display: block;
      }
   }

   .introjs-tooltipReferenceLayer {
      .begin {
         left: 1.5rem !important;
      }

      .introjs-button {
         font-size: 0.8rem;
      }

      .introjs-donebutton {
         color: black;
      }
   }

   .scriptum p {
      margin: 0;
   }
}