我已经安装了https://github.com/styledown/styledown并且我已经开始工作但我无法弄清楚文档......有人可以解释或演示如何包含评论的@example部分吗? / p>
这是我的评论代码
/**
* Component name:
* `.sliding-navigation` - slide out navigation and menu items
*/
这是我想要生成样式指南部分的sass样式:
.sliding-navigation {
.sliding-menu-button {
@include transform(rotate(90deg));
@include position(fixed, 105px 0 0 -45px);
@include transition(all .25s linear);
background-color: $sliding-menu-background;
border-color: $ilios-orange;
border-style: solid;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-width: 1px 1px 0;
box-shadow: 2px 1px 3px rgba(0, 0, 0, .19), inset 1px 0 2px rgba(0, 0, 0, .34);
color: $sliding-menu-color;
display: inline-block;
font-size: $base-font-size * .9;
height: 45px;
margin-bottom: $base-line-height;
margin-top: 10px;
outline: none;
-webkit-overflow-scrolling: touch;
padding-top: .4em;
text-align: center;
width: 120px;
z-index: 201;
i {
@include transform(rotate(-90deg));
margin-right: 10px;
}
&.is-menu-visible {
@include transform(translateX(220px) rotate(90deg));
}
}
.sliding-menu-content {
@include position(fixed, 60px auto 0 0);
@include size(220px 100%);
@include transform(translateX(-230px));
@include transition(all .25s linear);
background: $sliding-menu-background;
border-right: 1px solid $header-grey;
box-shadow: 2px 1px 3px rgba(0, 0, 0, .19), inset 1px 0 2px rgba(0, 0, 0, .34);
color: $sliding-menu-color;
-webkit-overflow-scrolling: touch;
padding-top: 2em;
z-index: 201;
li {
a {
border-bottom: $sliding-menu-border;
color: $sliding-menu-color;
display: inline-block;
padding: .5em;
padding-left: 20px;
width: 100%;
}
&:hover {
background-color: $sliding-menu-background-hover;
color: $sliding-menu-color-hover;
}
}
&.is-menu-visible {
@include transform(translateX(0));
}
}
.menu-screen {
@include position(fixed, 0 0 0 0);
@include transition;
background: $sliding-menu-background;
opacity: 0;
visibility: hidden;
z-index: 200;
&.is-menu-visible {
visibility: visible;
}
}
}