honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(aio): shell code styling

This commit is contained in:
Stefanie Fluin 2017-03-31 11:00:02 -07:00 committed by Alex Rickabaugh
parent 2454a3b641
commit 03fb766428
1 changed files with 25 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
aio/src/styles/2-modules/_code.scss
View File

@ -5,10 +5,16 @@ code-tabs md-tab-body {
border-radius: 5px; border-radius: 5px;
color: $darkgray; color: $darkgray;
display: block; display: block;
padding: 8px; padding: 8px 16px;
margin: 16px auto; margin: 16px auto;
} }
// TERMINAL / SHELL TEXT STYLES
code-example.code-shell, code-example[language=sh], code-example[language=bash] {
background-color: $darkgray;
}
code-example header { code-example header {
background-color: $mediumgray; background-color: $mediumgray;
border: 0.5px solid $mediumgray; border: 0.5px solid $mediumgray;
@ -43,7 +49,7 @@ code-tabs mat-tab-body-content .fadeIn {
aio-code pre { aio-code pre {
display: flex; display: flex;
padding: 0; padding: 0 48px 0 0;
white-space: pre-wrap; white-space: pre-wrap;
} }
@ -63,8 +69,6 @@ code ol {
} }
.copy-button { .copy-button {
top: -16px;
right: -16px;
color: $lightgray; color: $lightgray;
background-color: transparent; background-color: transparent;
border: none; border: none;
@ -73,6 +77,13 @@ code ol {
} }
} }
.lang-sh .copy-button, .lang-bash .copy-button {
color: $mediumgray;
&:hover {
color: $lightgray;
}
}
.code-tab-group div.mat-tab-body-content { .code-tab-group div.mat-tab-body-content {
height: auto; height: auto;
} }
@ -90,10 +101,7 @@ $blue-grey-900: #263238;
$white: #FFFFFF; $white: #FFFFFF;
/* /* SCREEN COLORS */
* Screen Colors
*
*/
.pnk, .pnk,
.blk { .blk {
@ -140,11 +148,16 @@ $white: #FFFFFF;
color: $blue; color: $blue;
} }
/* SHELL / TERMINAL CODE BLOCKS */
code-example.code-shell, code-example[language=sh], code-example[language=bash] {
& .pnk, .blk,.pln, .otl, .kwd, .typ, .tag, .str, .atv, .atn, .com, .lit, .pun, .dec {
color: $codegreen;
}
}
/* PRINT COLORS */
/*
* Print Colors
*
*/
@media print { @media print {
border: none; border: none;