ben
/
bitshift
mirror of https://github.com/earwig/bitshift
1
1
Fork 0
Code Releases 1 Activity
A semantic search engine for source code https://bitshift.benkurtovic.com/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
369 Commits
2 Branches
18 MiB
 
 
 
 
 
 
Tree: 54cbd29e42
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from '54cbd29e42'
${ noResults }
bitshift/static/sass/about.sass

129 lines
2.5 KiB
Raw Blame History 

  1. /*

  2.  Stylesheet for `templates/about.html`

  3.  */

  4. 

  5. @import mixins

  6. @import variables

  7. 

  8. $centered-section-min-width: 500px

  9. 

  10. div.bg

  11.     $img-height: 650px

  12. 

  13.     position: fixed

  14.     width: 100%

  15.     left: 0

  16.     z-index: -1

  17. 

  18.     &#img-1

  19.         background: url(../img/about/bg1.png) no-repeat

  20.         background-size: cover

  21.         height: 600px

  22.         top: -300px

  23. 

  24.     &#img-2

  25.         background: url(../img/about/bg2.png) no-repeat

  26.         background-size: cover

  27.         height: $img-height + 300

  28.         top: 1150px

  29. 

  30.     &#img-3

  31.         background: url(../img/about/bg3.png) no-repeat

  32.         background-size: cover

  33.         height: $img-height + 300

  34.         top: 2050px

  35. 

  36.     &#img-4

  37.         background: url(../img/about/bg4.png) no-repeat

  38.         background-size: cover

  39.         height: $img-height + 400

  40.         top: 3200px

  41. 

  42. div.section

  43.     background-color: white

  44.     border: 1px solid $baseColor2

  45.     margin-bottom: 200px

  46.     margin-top: 300px

  47.     padding-bottom: 80px

  48.     padding-top: 20px

  49.     overflow: hidden

  50. 

  51.     &#top

  52.         margin-top: 0px

  53. 

  54.         iframe#vimeo

  55.             border: 1px solid $baseColor3

  56.             margin-top: 40px

  57. 

  58.     div.centered

  59.         font-size: 110%

  60.         line-height: 150%

  61.         margin-left: auto

  62.         margin-right: auto

  63.         min-width: 500px

  64.         width: 65%

  65. 

  66.         &#how

  67.             b

  68.                 font-family: monospace

  69.                 font-size: 110%

  70. 

  71.             ul

  72.                 list-style: none

  73. 

  74.                 span

  75.                     color: $baseColor1

  76.                     font-weight: bold

  77. 

  78.         h1

  79.             color: $baseColor1

  80. 

  81.             span

  82.                 color: $baseColor2

  83. 

  84.         a

  85.             color: #727070

  86.             font-style: italic

  87.             text-decoration: none

  88. 

  89.             &:hover

  90.                 @extend .t3

  91. 

  92.                 color: #575757

  93. 

  94.         span#title

  95.             color: $baseColor1

  96.             font-weight: bold

  97. 

  98. div.person

  99.     font-size: 80%

  100.     overflow: hidden

  101. 

  102.     &#top

  103.         margin-top: 40px

  104. 

  105.     >div

  106.         $image-min-width: 100px

  107. 

  108.         display: inline-block

  109.         height: 100%

  110.         margin-bottom: 40px

  111.         vertical-align: top

  112. 

  113.         &.photo

  114.             margin-right: 40px

  115.             width: $image-min-width

  116. 

  117.             img

  118.                 display: block

  119.                 height: $image-min-width

  120.                 width: $image-min-width

  121. 

  122.         &.bio

  123.             min-width: $centered-section-min-width - $image-min-width - 50px

  124.             width: 70%

  125. 

  126.             h1

  127.                 font-size: 130%

  128.                 margin: 0