mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-23 07:47:54 +00:00
syntaxhighlight: move everything closer together in highlight table lineno mode #569
This commit is contained in:
parent
7a92d032e5
commit
74e31cae1a
3 changed files with 36 additions and 37 deletions
|
@ -488,6 +488,10 @@
|
||||||
color: rgba( 0, 0, 0, 1 ); /* var(--CODE-BLOCK-color) */
|
color: rgba( 0, 0, 0, 1 ); /* var(--CODE-BLOCK-color) */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.highlight > div {
|
||||||
|
border-color: rgba( 216, 216, 216, 1 ); /* var(--CODE-BLOCK-BORDER-color) */
|
||||||
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
background-color: rgba( 255, 255, 255, 1 ); /* var(--INTERNAL-MAIN-BG-color) */
|
background-color: rgba( 255, 255, 255, 1 ); /* var(--INTERNAL-MAIN-BG-color) */
|
||||||
}
|
}
|
||||||
|
|
|
@ -666,20 +666,37 @@ pre code {
|
||||||
white-space: inherit;
|
white-space: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* we may have special treatment if highlight shortcode was used in table lineno mode */
|
||||||
|
div.highlight > div{
|
||||||
|
border-style: solid;
|
||||||
|
border-width: 1px;
|
||||||
|
}
|
||||||
|
/* disable selection for lineno cells */
|
||||||
|
div.highlight > div td:first-child:not(:last-child){
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
/* increase code column to full width if highlight shortcode was used in table lineno mode */
|
/* increase code column to full width if highlight shortcode was used in table lineno mode */
|
||||||
div.highlight td:nth-child(2){
|
div.highlight > div td:not(:first-child):last-child{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
/* remove border from row cells if highlight shortcode was used in table lineno mode */
|
||||||
/* remove border from lineno column if highlight shortcode was used in table lineno mode */
|
div.highlight > div td > pre {
|
||||||
div.highlight td > pre:not(.pre-code) {
|
border-width: 0;
|
||||||
border-bottom-right-radius: 0;
|
|
||||||
border-right-width: 0;
|
|
||||||
border-top-right-radius: 0;
|
|
||||||
}
|
}
|
||||||
div.highlight td:nth-child(2) pre {
|
/* in case of table lineno mode we want to move each row closer together - besides the edges
|
||||||
border-bottom-left-radius: 0;
|
this usually applies only to wrapfix tables but it doesn't hurt for non-wrapfix tables too */
|
||||||
border-top-left-radius: 0;
|
div.highlight > div tr:not(:first-child) pre{
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
div.highlight > div tr:not(:last-child) pre{
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
/* in case of table lineno mode we want to move each columns closer together on the inside */
|
||||||
|
div.highlight > div td:first-child:not(:last-child) pre{
|
||||||
|
padding-right: 0;
|
||||||
|
}
|
||||||
|
div.highlight > div td:not(:first-child):last-child pre{
|
||||||
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
hr {
|
hr {
|
||||||
|
@ -1976,34 +1993,8 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* remove border from code block if single in tab */
|
/* remove border from code block if single in tab */
|
||||||
#body .tab-content-text > div.highlight.wrapfix:only-child tbody,
|
#body .tab-content-text > div.highlight:only-child > div,
|
||||||
#body .tab-content-text > div.highlight:only-child pre,
|
#body .tab-content-text > div.highlight:only-child pre,
|
||||||
#body .tab-content-text > pre.pre-code:only-child{
|
#body .tab-content-text > pre.pre-code:only-child{
|
||||||
border-width: 0;
|
border-width: 0;
|
||||||
}
|
}
|
||||||
/* re-add border on code column if single in tab and highlight shortcode was used in table lineno mode */
|
|
||||||
#body .tab-content-text > div.highlight:only-child td:nth-child(2) pre {
|
|
||||||
border-left-width: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* we may have special treatment if highlight shortcode was used in table lineno mode and
|
|
||||||
we want to apply feasible wrapping for long code lines instead of scrolling */
|
|
||||||
div.highlight.wrapfix tbody{
|
|
||||||
background-color: var(--INTERNAL-CODE-BLOCK-BG-color);
|
|
||||||
border: 1px solid var(--INTERNAL-CODE-BLOCK-BORDER-color);
|
|
||||||
}
|
|
||||||
div.highlight.wrapfix tbody tr:not(:first-child) pre{
|
|
||||||
padding-top: 0;
|
|
||||||
}
|
|
||||||
div.highlight.wrapfix tbody tr:not(:last-child) pre{
|
|
||||||
padding-bottom: 0;
|
|
||||||
}
|
|
||||||
div.highlight.wrapfix tbody td:first-child:not(last-child){
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
div.highlight.wrapfix tbody td:not(:first-child):last-child{
|
|
||||||
border-left: 1px solid var(--INTERNAL-CODE-BLOCK-BORDER-color);
|
|
||||||
}
|
|
||||||
div.highlight.wrapfix tbody td pre{
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
|
|
|
@ -238,6 +238,10 @@ pre {
|
||||||
color: var(--INTERNAL-CODE-BLOCK-color);
|
color: var(--INTERNAL-CODE-BLOCK-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.highlight > div {
|
||||||
|
border-color: var(--INTERNAL-CODE-BLOCK-BORDER-color);
|
||||||
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
background-color: var(--INTERNAL-MAIN-BG-color);
|
background-color: var(--INTERNAL-MAIN-BG-color);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue