3 Files:
a.php, b.php and c.php;
In a.php there are the following hrefs
The b tag
The c tag
In b.php there are the following hrefs
The a tag
The c tag
In c.php there are the following hrefs
The a tag
The b tag
If the b and c hrefs in a.php are clicked, how can the b and c tags in the files b.php and c.php be show as clicked when these files are viewed?
Have tried putting all the files in one file and then calling the individual files using if statements have also tried include statements - these do not work. Looks like a javascript onclick solution.
Many thanks
in css add
a:visited{ color : red; font-weight:bold; text-decoration: none;} // EDIT THE CSS VALUES YOU WANT
Related
I am using bookdown for a documentation which is outputted with bookdown::gitbook and bookdown::pdf_book.
In my Rmd files, I am using a div to wrap around notes and warnings styled with a css file. For example:
<div class="note">
This is a note.
</div>
Obviously, HTML and CSS is ignored when generating the PDF file. I was wondering if there is a way to "inject" a small script that would replace the div with, for example, a simple prefix text.
Or, is there another way to have it formatted in HTML and in the PDF without littering my file by adding something lengthy every time like:
if (knitr::is_html_output(excludes='epub')) {
cat('
<div class="note">
This is a note.
</div>
')
} else {
cat('Note: This is a note.')
}
I could also style blockquotes as described here but it is not an option as I still need blockquotes.
The appropriate way to do this is to use a fenced div rather than inserting HTML directly into your markdown and trying to parse it later with LUA. Pandoc already allows you to insert custom styles and process them to both file types. In other words, it will take care of creating the appropriate HTML and LaTeX for you, and then you just need to style each of them. The Bookdown documentation references this here, but it simply points to further documentation here, and here.
This method will create both your custom classed div in html and apply the same style name in the LaTeX code.
So, for your example, it would look like this:
::: {.note data-latex=""}
This is a note.
:::
The output in HTML will be identical to yours:
<div class="note">
<p>This is a note.</p>
</div>
And you've already got the CSS you want to style that.
The LaTeX code will be as follows:
\begin{note}
This is a note.
\end{note}
To style that you'll need to add some code to your preamble.tex file, which you've already figured out as well. Here's a very simple example of some LaTeX that would simply indent the text from both the left and right sides:
\newenvironment{note}[0]{\par\leftskip=2em\rightskip=2em}{\par\medskip}
I found this answer on tex.stackexchange.com which brought me on the right track to solve my problem.
Here is what I am doing.
Create boxes.lua with following function:
function Div(element)
-- function based on https://tex.stackexchange.com/a/526036
if
element.classes[1] == "note"
or element.classes[1] == "side-note"
or element.classes[1] == "warning"
or element.classes[1] == "info"
or element.classes[1] == "reading"
or element.classes[1] == "exercise"
then
-- get latex environment name from class name
div = element.classes[1]:gsub("-", " ")
div = div:gsub("(%l)(%w*)", function(a, b) return string.upper(a)..b end)
div = "Div"..div:gsub(" ", "")
-- insert element in front
table.insert(
element.content, 1,
pandoc.RawBlock("latex", "\\begin{"..div.."}"))
-- insert element at the back
table.insert(
element.content,
pandoc.RawBlock("latex", "\\end{"..div.."}"))
end
return element
end
Add pandoc_args to _output.yml:
bookdown::pdf_book:
includes:
in_header: latex/preamble.tex
pandoc_args:
- --lua-filter=latex/boxes.lua
extra_dependencies: ["float"]
Create environments in preamble.tex (which is also configured in _output.yml):
I am using tcolorbox instead of mdframed
\usepackage{xcolor}
\usepackage{tcolorbox}
\definecolor{notecolor}{RGB}{253, 196, 0}
\definecolor{warncolor}{RGB}{253, 70, 0}
\definecolor{infocolor}{RGB}{0, 183, 253}
\definecolor{readcolor}{RGB}{106, 50, 253}
\definecolor{taskcolor}{RGB}{128, 252, 219}
\newtcolorbox{DivNote}{colback=notecolor!5!white,colframe=notecolor!75!black}
\newtcolorbox{DivSideNote}{colback=notecolor!5!white,colframe=notecolor!75!black}
\newtcolorbox{DivWarning}{colback=warncolor!5!white,colframe=warncolor!75!black}
\newtcolorbox{DivInfo}{colback=infocolor!5!white,colframe=infocolor!75!black}
\newtcolorbox{DivReading}{colback=readcolor!5!white,colframe=readcolor!75!black}
\newtcolorbox{DivExercise}{colback=taskcolor!5!white,colframe=taskcolor!75!black}
Because I have also images and tables within the boxes, I run into LaTeX Error: Not in outer par mode.. I was able to solve this issue by adding following command to my Rmd file:
```{r, echo = F}
knitr::opts_chunk$set(fig.pos = "H", out.extra = "")
```
I want to add a link to a static html page (which I have created, not hosted anywhere). I added the html file to my images folder (contains the images which are being rendered in my jekyll blog). Then I make a hyperlink to the html files which I just added in the images folder, like this:
<a href=https://raw.githubusercontent.com/USERNAME/USERNAME.github.io/master/images/time.vs.score.html>View plots here</a>
Where username is my github username. This does not open a new html page, instead I just see the plain text of the html file. How can I add static html files are part of the assets? Thanks!
Thats what raw.githubusercontent.com is made returning raw file.Files are returned with Content-Type:text/plain; and then displayed as text by your browser.
You'd better link to github pages published content at https://USERNAME.github.io/images/time.vs.score.html
I found an easy solution using this tool: https://rawgit.com/
just replace:
<a href=https://raw.githubusercontent.com/USERNAME/USERNAME.github.io/master/images/time.vs.score.html>View plots here</a>
with:
<a href=https://cdn.rawgit.com/USERNAME/USERNAME.github.io/master/images/time.vs.score.html>View plots here</a>
How to Add a different css style in a static page in XMLUI theme dspace? Without harming the current theme CSS.
Are you wanting to apply this custom CSS to your entire site, or to one particular theme? If you have defined multiple themes, you can add custom CSS files to a specific theme in the sitemap.xmap file.
<map:transform type="IncludePageMeta">
<map:parameter name="stylesheet.screen" value="lib/style.css"/>
<map:parameter name="stylesheet.screen#2" value="lib/jquery-ui-1.8.15.custom.css"/>
<map:parameter name="javascript#1" value="lib/jquery-1.6.4.min.js"/>
<map:parameter name="javascript#2" value="lib/jquery-ui-1.8.15.custom.min.js"/>
<map:parameter name="theme.path" value="{global:theme-path}"/>
<map:parameter name="theme.name" value="{global:theme-name}"/>
</map:transform>
Sample sitemap.xmap CSS inclusion
You must add "class" and "ids" to the html components of the static page, and, at the css, set the properties with the desired values
Currently I use something like this:
.row
.col-md-6
.row
.col-md-12
%h4
%strong Title Section One
.row
.col-md-4
%h4
%strong Bold Content
.col-md-4 Content 1
.col-md-4 Content 2
.col-md-4 Content 3
.col-md-6
.row
.col-md-12
%h4
%strong Title Section Two
Is there a way for the "Bold Content" and the "Title Section" parts to be shorten down? Preferably down to a single line? Maybe something close to this:
.col-md-4=%h4=%strong Bold Content
I know I can do use some CSS classes and/or IDs to achieve this, but I was wondering if HAML had a way to avoid making several indentation levels for a single line of content.
You can't do it with HAML syntax, but HAML lets you embed HTML:
.col-md-4 <h4><strong>Bold Content</strong></h4>
I am building a website with Yesod that contains a search form at the top of every page. From what I have understood till now, I should create a widget for the form, but I am unable to include it in a common place. What is the recommended way to do this?
If I create a custom widget, what is the recommended folder structure to follow?
This is what the defaultLayout function is intended for: you can add any kind of content to this page, and all pages of your site which use defaultLayout will inherit it automatically.
I ran into this recently when trying to add a header to every page that has a "Login" link if the user is not authenticated, and a "Logout" link if they are. I didn't find any good examples in the documentation of how to do this so I put one together.
Note: This assumes that you are using the scaffolding, but even if you're not you should still be able to work this in.
The first thing you need to do is create a header widget and add it to defaultLayout in Foundation.hs.
pageHeaderWidget :: Handler Widget
pageHeaderWidget = do
mauthId <- maybeAuthId
return $(widgetFile "header")
defaultLayout widget = do
pageHeader <- pageHeaderWidget >>= widgetToPageContent
-- ...
withUrlRenderer $(hamletFile "template/default-layout-wrapper.hamlet")
Then you need to create the corresponding html and style for your header:
File: header.hamlet
<header>
$maybe authId <- mauthId
Welcome #{show aid} - <a href=#{AuthR LogoutR}> Logout
$nothing
<a href=#{AuthR LoginR}> Login
File: header.lucius
header {
background-color: #007fff;
height: 50px;
}
Finally, you need to edit default-layout-wrapper.hamlet and add
^{pageHead pageHeader}
to the <head> tag just below ^{pageHead pc} (generated by the scaffolding); and replace
<header>
in the <body> with
^{pageBody pageHeader}