User Tools

Site Tools


sugarcane_css

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

sugarcane_css [2014/12/09 01:21]
l created
sugarcane_css [2017/10/09 20:39]
Line 1: Line 1:
-=====Sugarcane default CSS===== 
  
-The following is the default CSS code contained in Sugarcane stories, which you, the story author, may accompany with your own [[stylesheet]]s'​ CSS. 
- 
-====Base CSS==== 
- 
-This is fundamental CSS which provides a base page structure to the story. 
-<code css> 
-/* Sidebar */ 
-#sidebar { 
- position: fixed; 
- list-style:​ none; 
- width: 12em; 
-} 
-#sidebar #title, #sidebar #​credits ​ { 
- cursor: auto; 
-} 
-#sidebar #​storySubtitle,​ #sidebar #storyMenu { 
- display: block; 
-} 
-.menu { 
- position: absolute; 
- display: none; 
- z-index: 5; 
-} 
-/* Passages container */ 
-#passages { 
- margin-left:​ 18.2em; 
- position:​relative;​ 
-} 
-/* Links */ 
-.passage a { 
- color: #4d6ad8; 
-} 
-a.internalLink,​ a.externalLink,​ a.back, a.return, [data-passage],​ .menu div { 
- cursor: pointer; 
-} 
-a.brokenLink { 
- background-color:​ red; 
- color: #000; 
-} 
-.marked { 
- background-color:​ #f66; 
- color: #000; 
-} 
-.marked[title] { 
- cursor: help; 
-} 
-.passage li[data-bullet] { 
- list-style-type:​ none; 
-} 
-.passage li[data-bullet]:​before { 
- content: attr(data-bullet);​ 
- position: relative; 
- left: -1em; 
-} 
-#storeArea { 
- display: none; 
-} 
-#noscript { 
- margin-left:​ 18.2em; 
- font-size: 1.2em; 
- font-weight:​ bold; 
-} 
-/* HTML4 compatibility */ 
-img { 
- vertical-align:​bottom;​ 
-} 
-@media screen and (max-width: 640px) { 
- #sidebar { 
- position: static; 
- margin: 0 auto; 
- padding: 0; 
- } 
- body #sidebar li  { 
- text-align:​ center; 
- } 
- #passages { 
- min-height:​ 100vh; 
- margin-left:​ 0em; 
- } 
-} 
-#loadingbar { 
- position:​fixed;​ 
- top:0; 
- left:0; 
- border-top:​ solid #4d6ad8 6px; 
- transition:​ width 0.5s; 
-}</​code>​ 
-====Default CSS==== 
-This CSS completes the default Sugarcane look-and-feel. This code is removed if you select "​Don'​t use the Story Format'​s default CSS" in [[StorySettings]],​ or if the words "blank stylesheet"​ appear anywhere within a comment in your story'​s stylesheets,​ 
-<code css> 
-body { 
- background-color:​ #000; 
- color: #fff; 
- font-family:​ Verdana,​sans-serif;​ 
- font-size: 62.5%; 
- margin: 4em 15% 5% 5em; 
-} 
-#sidebar { 
- left: 7.5em; 
- margin: 0; 
- padding: 0 1em 0 0; 
- font: bold 1.1em Verdana,​sans-serif;​ 
-} 
-#sidebar ul { 
- padding: 0; 
-} 
-#sidebar li { 
- color: #333; 
- text-align:​ right; 
- background-repeat:​ no-repeat; 
- margin-bottom:​ 1em; 
- line-height:​ 1.4em; 
- list-style:​ none; 
-} 
-#sidebar li a { 
- color: #333; 
- text-decoration:​ none; 
-} 
-#sidebar li a:hover, #sidebar #title a:hover, #​snapback:​hover,​ #​restart:​hover { 
- color: #fff; 
- cursor: pointer; 
- text-decoration:​ none; 
-} 
-#sidebar #title { 
- font-size: 150%; 
-} 
-#sidebar #title, #sidebar #​title:​hover,​ #sidebar #title a { 
- color: #999; 
-} 
-#sidebar #​storySubtitle { 
- font-size: 75%; 
-} 
-#​storyAuthor { 
- font-size: 50%; 
-} 
-#sidebar #storyMenu { 
- line-height:​ 2.5em; 
- margin-bottom:​ .5em; 
- color: #999; 
- cursor: auto; 
-} 
-#sidebar #credits { 
- padding-top:​ 2em; 
- font-weight:​ normal; 
- font-size: 80%; 
-} 
-#sidebar #​credits:​hover { 
- color: #333; 
-} 
-#sidebar #credits a { 
- text-decoration:​ none; 
-} 
-#passages { 
- border-left:​ 1px solid #333; 
- padding-left:​ 1.5em; 
-} 
-.menu { 
- background-color:​ #343434; 
- color: #fff; 
- opacity: .9; 
- border: 1px solid #fff; 
- text-align:​ left; 
- font: 1.1em Verdana; 
- line-height:​ 2em; 
-} 
-.menu div { 
- padding: 0 .4em; 
-} 
-.menu div:hover { 
- cursor: pointer; 
- background-color:​ #fff; 
- color: #343434; 
-} 
-.passage { 
- font-size: 1.2em; 
- line-height:​ 175%; 
- margin-bottom:​ 2em; 
- text-align:​ left; 
-} 
-.passage a { 
- font-weight:​ bold; 
- text-decoration:​ none; 
-} 
-.passage a:hover { 
- color: #8ea6ff; 
- text-decoration:​ underline; 
-} 
-.content > ul { 
- padding-top:​ 1.3em; 
-} 
-.passage ul, .passage ol { 
- margin-left:​ .5em; 
- padding-left:​ 1.5em; 
-} 
-.passage li { 
- margin-right:​ 6em; 
-} 
-.passage table { 
- border-collapse:​ collapse; 
- font-size: 100%; 
- margin: .8em 1.0em; 
-} 
-.passage th,.passage td,.passage tr,.passage caption { 
- padding: 3px; 
-} 
-.passage hr { 
- height: 1px; 
-} 
-.passage center { 
- max-width:​50%;​ 
- margin:​auto;​ 
-} 
-.marked { 
- margin-right:​ 12px; 
- padding: 3px; 
-} 
-.disabled { 
- font-weight:​ bold; 
- color: #333; 
-} 
-@media screen and (max-width: 640px) { 
- body { 
- margin: 5%; 
- } 
- #sidebar { 
- width:​100%;​ 
- margin: 0; 
- border-bottom:​ 1px solid #333; 
- } 
- #passages { 
- padding-top:​ 2em; 
- border-left:​ 0; 
- } 
-} 
-</​code>​ 
sugarcane_css.txt ยท Last modified: 2017/10/09 20:39 (external edit)