mirror
/
shoelace
kopia lustrzana https://github.com/shoelace-style/shoelace
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

docs styles

pull/507/head
Cory LaViska 2021-08-18 09:52:51 -04:00
rodzic 9612af06a8
commit 8c221f33a8
4 zmienionych plików z 28 dodań i 70 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

10
docs/assets/plugins/code-block/code-block.css
Wyświetl plik

@ -5,10 +5,6 @@
margin-bottom: 1.5rem;
}
.sl-theme-dark .code-block {
background-color: rgb(var(--sl-color-neutral-200));
}
.code-block__preview {
position: relative;
border: solid 1px rgb(var(--sl-color-neutral-200));
@ -170,11 +166,13 @@
.markdown-section .docsify-copy-code-button {
top: 4px;
right: 4px;
background-color: rgb(var(--sl-color-neutral-500));
background-color: rgb(var(--sl-color-neutral-600));
border-radius: var(--sl-border-radius-medium);
font-family: var(--sl-font-sans);
font-size: var(--sl-font-size-small);
font-size: var(--sl-font-size-x-small);
font-weight: var(--sl-font-weight-semibold);
text-transform: uppercase;
padding: 8px;
user-select: none;
}

20
docs/assets/plugins/metadata/metadata.js
Wyświetl plik

@ -289,16 +289,16 @@
const buttons = document.createElement('div');
buttons.classList.add('sidebar-buttons');
buttons.innerHTML = `
<a class="repo-button repo-button--small repo-button--sponsor" href="https://github.com/sponsors/claviska" rel="noopener" target="_blank">
<sl-icon name="heart"></sl-icon> Sponsor
</a>
<a class="repo-button repo-button--small repo-button--github" href="https://github.com/shoelace-style/shoelace/stargazers" rel="noopener" target="_blank">
<sl-icon name="github"></sl-icon> <span class="github-star-count">Star</span>
</a>
<a class="repo-button repo-button--small repo-button--twitter" href="https://twitter.com/shoelace_style" rel="noopener" target="_blank">
<sl-icon name="twitter"></sl-icon> Follow
</a>
`;
<sl-button size="small" class="repo-button repo-button--sponsor" href="https://github.com/sponsors/claviska" target="_blank">
<sl-icon name="heart"></sl-icon> Sponsor
</sl-button>
<sl-button size="small" class="repo-button repo-button--github" href="https://github.com/shoelace-style/shoelace/stargazers" target="_blank">
<sl-icon name="github"></sl-icon> <span class="github-star-count">Star</span>
</sl-button>
<sl-button size="small" class="repo-button repo-button--twitter" href="https://twitter.com/shoelace_style" target="_blank">
<sl-icon name="twitter"></sl-icon> Follow
</sl-button>
`;
target.appendChild(buttons);
});

56
docs/assets/styles/docs.css
Wyświetl plik

@ -22,6 +22,10 @@ a {
color: rgb(var(--sl-color-primary-600));
}
a:hover {
color: rgb(var(--sl-color-primary-700));
}
strong {
font-weight: var(--sl-font-weight-bold);
}
@ -567,59 +571,15 @@ strong {
}
/* Repo buttons */
html .repo-button {
display: inline-flex;
align-items: center;
background-color: rgb(var(--sl-color-neutral-1000));
border: solid 1px rgb(var(--sl-color-neutral-200));
border-radius: var(--sl-border-radius-medium);
box-shadow: var(--sl-shadow-x-small);
font-size: var(--sl-font-size-small);
font-weight: var(--sl-font-weight-semibold);
line-height: 2;
text-decoration: none;
color: rgb(var(--sl-color-neutral-700));
padding: var(--sl-spacing-xx-small) var(--sl-spacing-small);
margin-bottom: var(--sl-spacing-xx-small);
transition: 0.25s all;
}
html .repo-button:hover {
text-decoration: none;
background-color: rgb(var(--sl-color-neutral-50));
border: solid 1px rgb(var(--sl-color-neutral-200));
}
html .repo-button:focus {
outline: none;
border-color: rgb(var(--sl-color-primary-500));
box-shadow: 0 0 0 var(--sl-focus-ring-width) rgb(var(--sl-color-primary-500) / var(--sl-focus-ring-alpha));
}
html .repo-button:not(:last-of-type) {
margin-right: 0.125rem;
}
html .repo-button sl-icon {
position: relative;
vertical-align: middle;
margin-right: 0.35rem;
}
html .repo-button--small {
font-size: var(--sl-font-size-x-small);
padding: var(--sl-spacing-xxx-small) var(--sl-spacing-x-small);
}
html .repo-button--sponsor sl-icon {
.repo-button--sponsor sl-icon {
color: rgb(var(--sl-color-pink-500));
}
html .repo-button--github sl-icon {
color: rgb(var(--sl-color-neutral-600));
.repo-button--github sl-icon {
color: rgb(var(--sl-color-neutral-700));
}
html .repo-button--twitter sl-icon {
.repo-button--twitter sl-icon {
color: rgb(var(--sl-color-sky-500));
}

12
docs/getting-started/overview.md
Wyświetl plik

@ -99,17 +99,17 @@ Designing, developing, and supporting this library requires a lot of time, effor
👇 Your support is very much appreciated! 👇
<a class="repo-button repo-button--sponsor" href="https://github.com/sponsors/claviska" rel="noopener" target="_blank">
<sl-button class="repo-button repo-button--sponsor" href="https://github.com/sponsors/claviska" target="_blank">
<sl-icon name="heart"></sl-icon> Become a sponsor
</a>
</sl-button>
<a class="repo-button repo-button--github" href="https://github.com/shoelace-style/shoelace/stargazers" rel="noopener" target="_blank">
<sl-button class="repo-button repo-button--github" href="https://github.com/shoelace-style/shoelace/stargazers" target="_blank">
<sl-icon name="github"></sl-icon> <span class="github-star-count">Star</span>
</a>
</sl-button>
<a class="repo-button repo-button--twitter" href="https://twitter.com/shoelace_style" rel="noopener" target="_blank">
<sl-button class="repo-button repo-button--twitter" href="https://twitter.com/shoelace_style" target="_blank">
<sl-icon name="twitter"></sl-icon> Follow
</a>
</sl-button>
## Attribution