github.com/rahart/packer@v0.12.2-0.20161229105310-282bb6ad370f/website/source/assets/stylesheets/_header.scss (about)

     1  //
     2  // Header
     3  // - Project Specific
     4  // - edits should be made here
     5  // --------------------------------------------------
     6  
     7  #header {
     8    flex-direction: row;
     9    background-color: $black;
    10    .navbar-brand {
    11      .logo{
    12        color: $green;
    13        padding-left: 36px;
    14        font-size: 22px;
    15        line-height: 77px;
    16        background: image-url('logo-header.png') 0 0 no-repeat;
    17        @include img-retina("../images/logo-header.png", "../images/logo-header@2x.png", $project-logo-width, $project-logo-height);
    18        background-position: 0 center;
    19  
    20        &:hover{
    21          opacity: .6;
    22        }
    23      }
    24  
    25      .by-hashicorp{
    26        &:hover{
    27          svg{
    28            .svg-bg-line{
    29              opacity: .4;
    30            }
    31          }
    32        }
    33      }
    34    }
    35  
    36    .buttons{
    37      margin-top: 2px; //baseline everything
    38  
    39      .navigation-links{
    40          float: right;
    41      }
    42    }
    43  
    44    .main-links,
    45    .external-links {
    46      li > a {
    47        @include project-a-style();
    48      }
    49    }
    50  
    51    .main-links {
    52      li > a {
    53        color: $white;
    54  
    55        &:hover{
    56          color: $green;
    57        }
    58      }
    59    }
    60  }
    61  
    62  @media (max-width: 768px) {
    63    #header {
    64      .navbar-brand {
    65  
    66      }
    67    }
    68  }
    69  
    70  @media (max-width: 414px) {
    71    #header {
    72      .navbar-brand {
    73        .logo{
    74          padding-left: 37px;
    75          font-size: 18px;
    76          @include img-retina("../images/logo-header.png", "../images/logo-header@2x.png", $project-logo-width * .75, $project-logo-height * .75);
    77          //background-position: 0 45%;
    78        }
    79      }
    80    }
    81  }
    82  
    83  
    84  @media (max-width: 320px) {
    85    #header {
    86      .navbar-brand {
    87        .logo{
    88          font-size: 0 !important; //hide terraform text
    89        }
    90      }
    91    }
    92  }