andersdamsgaard.com

my photography webpage
git clone git://src.adamsgaard.dk/andersdamsgaard.com # fast
git clone https://src.adamsgaard.dk/andersdamsgaard.com.git # slow
Log | Files | Refs | Submodules | README | LICENSE Back to index

_layout.scss (1281B)

      1 .container {
      2   margin: 0 auto;
      3   max-width: 800px;
      4   width: 80%;
      5 }
      6 
      7 main,
      8 footer,
      9 .nav-container {
     10   display: block;
     11   margin: 0 auto;
     12   max-width: 800px;
     13   width: 80%;
     14 }
     15 
     16 .nav {
     17   box-shadow: 0 2px 2px -2px $shadow-color;
     18   overflow: auto;
     19 
     20   &-container {
     21     margin: 1rem auto;
     22     position: relative;
     23     text-align: center;
     24   }
     25 
     26   &-title {
     27     @include transition(all .2s ease-out);
     28     color: $default-color;
     29     display: inline-block;
     30     margin: 0;
     31     padding-right: .2rem;
     32 
     33     &:hover,
     34     &:focus {
     35       opacity: .6;
     36     }
     37   }
     38 
     39   ul {
     40     list-style-type: none;
     41     margin: 1rem 0 0;
     42     padding: 0;
     43     text-align: center;
     44   }
     45 
     46   li {
     47     @include transition(all .2s ease-out);
     48     color: $default-color;
     49     display: inline-block;
     50     opacity: .6;
     51     padding: 0 2rem 0 0;
     52 
     53     &:last-child {
     54       padding-right: 0;
     55     }
     56 
     57     &:hover,
     58     &:focus {
     59       opacity: 1;
     60     }
     61   }
     62 
     63   a {
     64     color: $default-color;
     65     font-family: $sans-serif;
     66   }
     67 }
     68 
     69 @media (min-width: 600px) {
     70   .nav {
     71     &-container {
     72       text-align: left;
     73     }
     74 
     75     ul {
     76       bottom: 0;
     77       position: absolute;
     78       right: 0;
     79     }
     80   }
     81 }
     82 
     83 footer {
     84   font-family: $serif-secondary;
     85   padding: 2rem 0;
     86   text-align: center;
     87 
     88   span {
     89     color: $default-color;
     90     font-size: .8rem;
     91   }
     92 }