mirror of
https://github.com/changkun/modern-cpp-tutorial.git
synced 2025-12-17 12:44:40 +03:00
151 lines
2.6 KiB
Stylus
Executable File
151 lines
2.6 KiB
Stylus
Executable File
@import "_common"
|
|
@import "_header"
|
|
@import "_sidebar"
|
|
|
|
$width = 900px
|
|
|
|
body
|
|
background-color: #fff
|
|
margin-bottom: 200px
|
|
#logo
|
|
span
|
|
font-size: 1.2em
|
|
img
|
|
display: none
|
|
|
|
.sidebar
|
|
display: none
|
|
|
|
#mobile-bar
|
|
&.top
|
|
background-color: $theme
|
|
box-shadow: none
|
|
.logo
|
|
display: none
|
|
|
|
#hero
|
|
padding: 100px 40px 40px 200px
|
|
background-color: #fff
|
|
.inner
|
|
max-width: $width
|
|
margin: 0 auto
|
|
.left, .right
|
|
display: inline-block
|
|
vertical-align: top
|
|
.left
|
|
width: 45%
|
|
.right
|
|
width: 55%
|
|
.hero-logo
|
|
width: 290px
|
|
float: right
|
|
margin-right: 60px
|
|
border-radius: 5px
|
|
box-shadow: 0 20px 80px rgba(0, 0, 0, 0.4)
|
|
h1
|
|
text-transform: uppercase
|
|
font-weight: 500
|
|
margin: 10px 0px
|
|
margin-top: 0px
|
|
font-size: 3.2em
|
|
h2
|
|
text-transform: uppercase
|
|
font-weight: 300
|
|
font-size: 2.4em
|
|
margin: 0 0 10px
|
|
h4
|
|
font-style: oblique
|
|
font-weight: 200
|
|
margin-bottom: 0px
|
|
font-size: 2em
|
|
.button
|
|
margin: 1em 0
|
|
font-size: 1.05em
|
|
font-weight: 600
|
|
letter-spacing: .1em
|
|
min-width: 8em
|
|
text-align: center
|
|
&:first-child
|
|
margin-right: 1em
|
|
.social-buttons
|
|
list-style-type: none
|
|
padding: 0
|
|
li
|
|
display: inline-block
|
|
vertical-align: middle
|
|
margin-right: 15px
|
|
|
|
#highlights
|
|
background-color: #fff
|
|
padding-bottom: 70px
|
|
.inner
|
|
max-width: $width
|
|
margin: 0 auto
|
|
text-align: center
|
|
.point
|
|
width: 33%
|
|
display: inline-block
|
|
vertical-align: top
|
|
box-sizing: border-box
|
|
padding: 0 2em
|
|
h2
|
|
color: $theme
|
|
font-size: 1.5em
|
|
font-weight: 400
|
|
margin: 0
|
|
padding: .5em 0
|
|
p
|
|
color: $light
|
|
|
|
#footer
|
|
background-color: #1e2318
|
|
bottom: 0
|
|
padding: 10px 0
|
|
position: fixed
|
|
width: 100%
|
|
color: #fff
|
|
text-align: center
|
|
a
|
|
font-weight: 700
|
|
color: #fff
|
|
|
|
@media screen and (max-width: $width)
|
|
body
|
|
-webkit-text-size-adjust: none
|
|
font-size: 14px
|
|
margin-bottom: 200px
|
|
.sidebar
|
|
display: block
|
|
#header
|
|
display: none
|
|
#mobile-bar
|
|
display: block
|
|
#hero
|
|
padding: 70px 40px 50px
|
|
.hero-logo
|
|
float: none
|
|
margin: 30px 0 30px
|
|
width: 200px
|
|
.left, .right
|
|
text-align: center
|
|
width: 100%
|
|
h1
|
|
text-transform: capitalize
|
|
font-size: 2.0em
|
|
display: block
|
|
h2
|
|
font-size: 1.0em
|
|
.button
|
|
font-size: .9em
|
|
h4
|
|
font-size: 0.9em
|
|
#highlights
|
|
.point
|
|
display: block
|
|
margin: 0 auto
|
|
width: 300px
|
|
padding: 0 40px 30px
|
|
&:before
|
|
content: "—"
|
|
color: $theme
|