github.com/thanos-io/thanos@v0.32.5/website/static/main.css (about)

     1  .color-yellow {
     2      color: #ad9c26;
     3  }
     4  
     5  .bg-purple {
     6      background-color: #6D41FF;
     7  }
     8  
     9  .color-purple {
    10      color: #6D41FF;
    11  }
    12  
    13  .navbar-brand img {
    14      height: 32px;
    15      margin-right: 10px;
    16      max-width: 100%;
    17  }
    18  
    19  .navbar-dark .navbar-nav .nav-link {
    20      color: #fff;
    21  }
    22  
    23  .nav-link:hover {
    24      color: rgba(255,255,255,.5)
    25  }
    26  
    27  .btn-outline-secondary {
    28      color: #6D41FF;
    29      border-color: #6D41FF;
    30  }
    31  
    32  .btn-outline-secondary:hover, .btn-outline-secondary:active {
    33      color: #fff;
    34      background-color: #6D41FF !important;
    35      border-color: #6D41FF !important;
    36  }
    37  
    38  a {
    39      color: #6D41FF;
    40  }
    41  
    42  pre {
    43      padding: 1rem;
    44  }
    45  
    46  .list-group-item-docs {
    47      color: #6D41FF;
    48      padding: 0.5rem;
    49      background-color: transparent;
    50  }
    51  
    52  .list-group-item-docs:hover {
    53      color: #6D41FF;
    54  }
    55  
    56  .img-adopter {
    57      padding: 15px;
    58      background-color: #fff;
    59      box-shadow: 0 2px 4px rgba(0,0,0,.1);
    60      border: 1px solid #dee2e6;
    61      margin: 15px 0 15px;
    62      border-radius: .25rem;
    63      display: flex;
    64      align-items: center;
    65      justify-content: center;
    66      height: 100px;
    67  }
    68  
    69  .img-adopter a {
    70      width: 100%;
    71      height: 100%;
    72  }
    73  
    74  .img-adopter a img {
    75      object-fit: contain;
    76      width: 100%;
    77      height: 100%;
    78  }
    79  
    80  .header-anchor { font-size: 100%; visibility: hidden;}
    81  h1:hover a, h2:hover a, h3:hover a, h4:hover a { visibility: visible}
    82  
    83  /* seaarchBox */
    84  .searchBox {
    85      position: relative;
    86      height: 100%;
    87      display: flex;
    88      align-items: center;
    89  }
    90  
    91  input[type="search"] {
    92      height: 30px;
    93      line-height: 30px;
    94      box-sizing: border-box;
    95      padding: 0 15px 0 30px;
    96      border: 1px solid #e3e3e3;
    97      color: #ffffff;
    98      outline: none;
    99      border-radius: 15px;
   100      margin-right: 10px;
   101      transition: border-color 0.2s ease;
   102      background-color: transparent;
   103      background-size: 15px;
   104      vertical-align: middle !important;
   105  }
   106  
   107  .searchbtn {
   108  	position: absolute;
   109  	font-size: 15px;
   110  	color: #66757f;
   111  	background-color: transparent;
   112  	border:none;
   113  	left: 2%;
   114  	top: 4px;
   115  	outline: none;
   116  	padding: 4px;
   117  }
   118  
   119  input[type="search"]:focus {
   120      border-color: #42b983;
   121      background-color: #fff;
   122      color: #273849;
   123  }
   124  
   125  input[type="search"]::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
   126      color: #fff;
   127    }
   128  
   129  /* SideMenu Collapse */
   130  .docs-menu{
   131      text-transform: capitalize;
   132  }
   133  
   134  .menuinput {
   135      display: none;
   136  }
   137  
   138  .menulabel-docs {
   139      cursor: pointer;
   140      display: flex;
   141      align-items: center;
   142  }
   143  
   144  .caret-expand {
   145      width: 16px;
   146      margin-left: 8px;
   147      margin-bottom: 0.2rem;
   148      transition: transform 0.2s ease-out;
   149  }
   150  
   151  .menuinput:checked + label .caret-expand {
   152      transform: rotateX(180deg);
   153  }
   154  
   155  .sidemenu-docs .list-group {
   156      transform: scaleY(0);
   157      height: 0;
   158  }
   159  
   160  .menuinput:checked ~ .list-group {
   161      transform: scaleY(1);
   162      height: auto;
   163  }
   164  
   165  @media (max-width: 990px){
   166      .searchbtn {
   167          top: 0px;
   168          left: 1%;
   169      }
   170  
   171      /* navbar toggle icon */
   172      .fa-bars{
   173          display: inline-block;
   174          height: 1em;
   175          vertical-align: middle;
   176          width: 1em;
   177      }
   178  }
   179  
   180  @media (max-width: 580px) {
   181      .list-inline-item {
   182          margin-bottom: 1rem;
   183      }
   184  }
   185  
   186  @media (max-width: 767px) {
   187      .hero-logo-container {
   188          flex-grow: 1;
   189          max-width: 100%;
   190      }
   191      
   192      .footer-container {
   193          flex-direction: column;
   194      }
   195  
   196      .about-section {
   197          padding-top: 20px;
   198          padding-bottom: 15px;
   199      }
   200  }
   201  
   202  .blog-post img {
   203      width: 100%;
   204  }