Implementing Hovered line indicator in minimal theme #153
Replies: 8 comments 5 replies
-
You can search for the following keywords in the CSS file of this theme, and copy and paste the code for this entry (note that you need to remove ".line-hover-indicator"). |
Beta Was this translation helpful? Give feedback.
-
Hi,
I tried your steps but didn't have any impact.
1. Copying the CSS to Minimal's theme.css
2. Removed the indiidcated lines from the code
[image: image.png]
…On Thu, Jan 25, 2024 at 12:51 PM Akifyss ***@***.***> wrote:
You can search for the following keywords in the CSS file of this theme,
and copy and paste the code for this entry (note that you need to remove
".line-hover-indicator").
image.png (view on web)
<https://github.com/Akifyss/obsidian-border/assets/23567154/818fab37-04a9-4fd2-ac4a-475d0f88c7e0>
—
Reply to this email directly, view it on GitHub
<#153 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/A2RAIEA36JIUHX673HHVKC3YQIBWPAVCNFSM6AAAAABCKAMZ7CVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DENBRGU2TA>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
--
Regards,
Dharshan Jayalath
|
Beta Was this translation helpful? Give feedback.
-
I did as you mentioned.
Attached a .txt of the code for review. Appreciate your help!
…On Thu, Jan 25, 2024 at 1:44 PM Akifyss ***@***.***> wrote:
Did you delete these fields?
image.png (view on web)
<https://github.com/Akifyss/obsidian-border/assets/23567154/ef08f887-3888-402c-93f2-b94402c36b6d>
—
Reply to this email directly, view it on GitHub
<#153 (reply in thread)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/A2RAIED3BFJWZ4KIBKVRDVLYQIH7TAVCNFSM6AAAAABCKAMZ7CVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DENBSGAZTO>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
--
Regards,
Dharshan Jayalath
/* ====== hover indicator ====== */
/*general*/
body {
--hover-indicator-color: var(--color-accent);
}
.workspace-leaf-content[data-type="markdown"] .markdown-source-view .cm-content>div:not(.image-embed, .mk-header, :has(.mk-note-footer)),
.workspace-leaf-content[data-type="markdown"]:not(:has(.document-search-container)) .markdown-preview-sizer>div:not([class], :has(.collapse-indicator, .mk-header)) {
position: relative;
}
.workspace-leaf-content[data-type="markdown"] .markdown-source-view .cm-content>div:not(:has(.mk-note-footer)):has(.cm-hmd-list-indent)::after,
.workspace-leaf-content[data-type="markdown"] .markdown-source-view .cm-content>div:not(.image-embed, .mk-header, :has(.mk-note-footer, .collapse-indicator))::after,
.workspace-leaf-content[data-type="markdown"]:not(:has(.document-search-container)) .markdown-preview-sizer>div:is(.el-ul, .el-ol)::after,
.workspace-leaf-content[data-type="markdown"]:not(:has(.document-search-container)) .markdown-preview-sizer>div:not([class], :has(.collapse-indicator, .mk-header))::after {
content: "";
position: absolute;
left: -12px;
top: 3px;
width: 3px;
height: 0;
border-radius: 10px;
background: var(--hover-indicator-color);
opacity: 1;
}
.workspace-leaf-content[data-type="markdown"] .markdown-source-view .cm-content>div:not(:has(.mk-note-footer)):has(.cm-hmd-list-indent):hover::after,
.workspace-leaf-content[data-type="markdown"] .markdown-source-view .cm-content>div:not(.image-embed, .mk-header, :has(.mk-note-footer, .collapse-indicator)):hover::after,
.workspace-leaf-content[data-type="markdown"]:not(:has(.document-search-container)) .markdown-preview-sizer>div:is(.el-ul, .el-ol):hover::after,
.workspace-leaf-content[data-type="markdown"]:not(:has(.document-search-container)) .markdown-preview-sizer>div:not([class], :has(.collapse-indicator, .mk-header)):hover::after {
height: calc(100% - 6px);
}
/* num */
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line:not(.HyperMD-list-line-1):after,
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-codeblock:not(.HyperMD-codeblock-begin):not(.HyperMD-codeblock-end)::after {
background: unset !important;
opacity: 0 !important;
position: absolute !important;
left: -12px !important;
top: 0px !important;
height: 100% !important;
width: 3px !important;
display: flex;
align-items: center;
justify-content: center;
white-space: nowrap;
color: var(--hover-indicator-color);
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line:not(.HyperMD-list-line-1):hover::after,
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-codeblock:not(.HyperMD-codeblock-begin):not(.HyperMD-codeblock-end):hover:after {
opacity: 1 !important;
}
/* code */
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer,
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-codeblock-end {
counter-reset: code-line;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-codeblock:not(.HyperMD-codeblock-begin):not(.HyperMD-codeblock-end)::after {
counter-increment: code-line;
content: counter(code-line) !important;
}
/* list */
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line:not(.HyperMD-list-line-1):after {
content: "";
text-indent: 0px !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-2::after {
content: "2" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-3::after {
content: "3" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-4::after {
content: "4" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-5::after {
content: "5" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-6::after {
content: "6" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-7::after {
content: "7" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-8::after {
content: "8" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-9::after {
content: "9" !important;
}
.workspace-leaf-content[data-type="markdown"] .cm-contentContainer .cm-line.HyperMD-list-line.HyperMD-list-line-10::after {
content: "10" !important;
}
|
Beta Was this translation helpful? Give feedback.
-
Still no luck unfortunately. I will keep trying. Will let you know when I
succeed!
Thanks!
…On Thu, Jan 25, 2024 at 1:57 PM Akifyss ***@***.***> wrote:
The code should look like this, have you managed to implement it
successfully?
—
Reply to this email directly, view it on GitHub
<#153 (reply in thread)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/A2RAIEBHC3CJCDMQHM2GPFDYQIJP3AVCNFSM6AAAAABCKAMZ7CVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DENBSGE3DA>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
--
Regards,
Dharshan Jayalath
|
Beta Was this translation helpful? Give feedback.
-
Can this be added as a CSS Snippet in the appearance tab in settings?
…On Thu, Jan 25, 2024 at 2:30 PM DJ ***@***.***> wrote:
Still no luck unfortunately. I will keep trying. Will let you know when I
succeed!
Thanks!
On Thu, Jan 25, 2024 at 1:57 PM Akifyss ***@***.***> wrote:
> The code should look like this, have you managed to implement it
> successfully?
>
> —
> Reply to this email directly, view it on GitHub
> <#153 (reply in thread)>,
> or unsubscribe
> <https://github.com/notifications/unsubscribe-auth/A2RAIEBHC3CJCDMQHM2GPFDYQIJP3AVCNFSM6AAAAABCKAMZ7CVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DENBSGE3DA>
> .
> You are receiving this because you authored the thread.Message ID:
> ***@***.***
> com>
>
--
Regards,
Dharshan Jayalath
--
Regards,
Dharshan Jayalath
|
Beta Was this translation helpful? Give feedback.
-
Lol, I pasted into the minimal theme.css file on .obsidian. So sorry my CSS
sucks.
…On Thu, Jan 25, 2024 at 2:39 PM Akifyss ***@***.***> wrote:
In fact, that's exactly what you need to do. Where did you paste before?
—
Reply to this email directly, view it on GitHub
<#153 (reply in thread)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/A2RAIEFGSDRTTXGP3RRDUQDYQIOL5AVCNFSM6AAAAABCKAMZ7CVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DENBSGU3DA>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
--
Regards,
Dharshan Jayalath
|
Beta Was this translation helpful? Give feedback.
-
No luck. This is the snippet I'm using.
…On Thu, Jan 25, 2024 at 2:43 PM Akifyss ***@***.***> wrote:
I didn't describe it in much detail, sorry. Was it ultimately successful?
—
Reply to this email directly, view it on GitHub
<#153 (reply in thread)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/A2RAIEBZ55UQIOZD66AVSGTYQIO3JAVCNFSM6AAAAABCKAMZ7CVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DENBSGU4TC>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
--
Regards,
Dharshan Jayalath
|
Beta Was this translation helpful? Give feedback.
-
It's working! Thanks. I'm not exactly sure what was wrong since the snippet
was turned on.
Thanks again! Really love the theme btw.
…On Thu, Jan 25, 2024 at 2:46 PM Akifyss ***@***.***> wrote:
I've successfully implemented it using your code. Are you sure you turned
on the the snippet?
—
Reply to this email directly, view it on GitHub
<#153 (reply in thread)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/A2RAIEBKMXTTGBZKHCLGBO3YQIPIJAVCNFSM6AAAAABCKAMZ7CVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DENBSGYZDK>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
--
Regards,
Dharshan Jayalath
|
Beta Was this translation helpful? Give feedback.
-
Hi,
I was wondering what the CSS snippet would be for implementing Hovered line indicator in the minimal theme?
Regards
Beta Was this translation helpful? Give feedback.
All reactions