totole/sapper
1
0
Fork 0
mirror of https://github.com/kevin-DL/sapper.git synced 2026-01-12 03:05:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix some styles

Browse Source
This commit is contained in:
Richard Harris
2019-04-28 22:06:02 -04:00
parent 381af86f04
commit 63251c6733
4 changed files with 29 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
site/content/docs/00-introduction.md
View File

@@ -2,7 +2,9 @@
title: Introduction
---
*Note: Sapper is in early development, and some things may change before we hit version 1.*
### Before we begin
> Sapper is in early development, and some things may change before we hit version 1.0. This document is a work-in-progress. If you get stuck, reach out for help in the [Discord chatroom](https://discord.gg/yy75DKs).
### What is Sapper?
@@ -29,7 +31,7 @@ For web developers, the stakes are generally lower than for combat engineers. Bu
* Sapper is powered by Svelte instead of React, so it's faster and your apps are smaller
* Instead of route masking, we encode route parameters in filenames (see the [routing](guide#routing) section below)
* As well as *pages*, you can create *server routes* in your `src/routes` directory. This makes it very easy to, for example, add a JSON API such as the one powering this very page (try visiting [/guide.json](/guide.json))
* As well as *pages*, you can create *server routes* in your `src/routes` directory. This makes it very easy to, for example, add a JSON API such as the one powering this very page (try visiting [/docs.json](/docs.json))
* Links are just `<a>` elements, rather than framework-specific `<Link>` components. That means, for example, that [this link right here](/), despite being inside a blob of markdown, works with the router as you'd expect

7
site/src/routes/_layout.svelte
View File

@@ -6,20 +6,23 @@
</script>
<style>
:global(html) {
--prime: rgb(21, 151, 148) !important; /* TODO remove .theme-default from shared, so we don't need !important */
}
main {
position: relative;
margin: 0 auto;
/* padding: var(--nav-h) var(--side-nav) 0 var(--side-nav); */
padding: var(--nav-h) 0 0 0;
overflow-x: hidden;
--prime: rgb(21, 151, 148);
}
</style>
<Icons/>
<Nav {segment} {page} logo="sapper-logo-horizontal.svg">
<NavItem segment="guide">Guide</NavItem>
<NavItem segment="docs">Docs</NavItem>
<NavItem external="https://svelte.dev">Svelte</NavItem>

11
site/src/routes/docs/index.svelte
View File

@@ -319,18 +319,19 @@
}
section > :global(.code-block) > :global(pre) {
display: inline-block;
background: var(--back-api);
/* display: inline-block; */
/* background: var(--back-api);
color: white;
padding: .3rem .8rem;
margin: 0;
margin: 0; */
max-width: 100%;
width: var(--linemax);
}
section > :global(.code-block)> :global(pre.language-markup) {
/* section > :global(.code-block)> :global(pre.language-markup) {
padding: .3rem .8rem .2rem;
background: var(--back-api);
}
} */
section > :global(p) {
max-width: var(--linemax)

14
site/src/template.html
View File

@@ -21,6 +21,20 @@
lazily loaded when it precaches secondary pages -->
%sapper.styles%
<style>
.hljs, .hljs-subst { color: #333; }
.hljs-comment { color: #999; }
.hljs-tag { color: #170; }
.hljs-keyword { color: #708; }
.hljs-attr { color: #333; }
.hljs-number { color: #164; }
.hljs-type, .hljs-string, .hljs-selector-id, .hljs-selector-class, .hljs-quote, .hljs-template-tag, .hljs-deletion { color: rgb(16,94,16); }
.hljs-title, .hljs-section { color: rgb(16,94,16); }
.hljs-literal { color: #170; }
.hljs-meta { color: #555; }
.hljs-meta-string { color: #555; }
</style>
<!-- This contains the contents of the <svelte:head> component, if
the current page has one -->
%sapper.head%