% Colors
% Dark Editor theme
\definecolor{editorBackgroundColor}{HTML}{2d2f37} % #2d2f37
\definecolor{editorCommentColor}{HTML}{5e636f} % #5e636f
\definecolor{editorTextColor}{HTML}{abb0bd} % #abb0bd
\definecolor{lineNumberColor}{HTML}{4f5464} % #4f5464
\definecolor{lineNumberBorderColor}{HTML}{2d2f37} % #2d2f37
\definecolor{lineNumberBackgroundColor}{HTML}{2d2f37} % #2d2f37
% Light Editor theme
% \definecolor{editorBackgroundColor}{HTML}{eeeeee} % #eeeeee
% \definecolor{editorTextColor}{HTML}{666666} % #666666
% \definecolor{editorCommentColor}{HTML}{5e636f} % #5e636f
%
% \definecolor{lineNumberColor}{HTML}{4f5464} % #4f5464
% \definecolor{lineNumberBorderColor}{HTML}{cccccc} % #cccccc
% \definecolor{lineNumberBackgroundColor}{HTML}{eeeeee} % #eeeeee
\definecolor{stringColor}{HTML}{6fa474} % #6fa474
\definecolor{tagColor}{HTML}{c86b72} % #c86b72
\definecolor{attributeColor}{HTML}{76acee} % #76acee
% Packages
\usepackage{listings} % Source code formatting and highlighting
\usepackage{upquote} % use ' instead of ´
% Define languages
\lstdefinelanguage{HTML5}{
language=html,
sensitive=true,
alsoletter={<>=-},
otherkeywords={
% other stuff to highlight
},
ndkeywords={
% HTML attributes
id=,
class=,
title=,
href=,
% CSS properties
border:,
color:
},
% Tags </>
delim=*[s][{\color{tagColor}}]{<}{>},
% Comments
moredelim=[s][{\color{editorCommentColor}}]{<!--}{-->},
% Strings
morestring=[b]", % defines that strings are enclosed in double quotes
tag=[s]
}
% General styles
\lstset{%
% Basic design
backgroundcolor=\color{editorBackgroundColor},
basicstyle={\small\ttfamily\color{editorTextColor}},
frame=l,
% Line numbers
xleftmargin={0.75cm},
numbers=left,
stepnumber=1,
firstnumber=1,
framesep=4.5mm,
framexleftmargin=2.5mm,
numberfirstline=true,
rulecolor=\color{lineNumberBorderColor},
fillcolor=\color{lineNumberBackgroundColor},
numberstyle=\normalfont\tiny\color{lineNumberColor},
% Code design
ndkeywordstyle=\color{attributeColor}\bfseries,
stringstyle=\color{stringColor},
% Code
language=HTML5,
alsodigit={.:;},
tabsize=2,
showtabs=false,
showspaces=false,
showstringspaces=false,
extendedchars=true,
breaklines=true,
% Support for German umlauts
literate=
{á}{{\'a}}1 {é}{{\'e}}1 {í}{{\'i}}1 {ó}{{\'o}}1 {ú}{{\'u}}1
{Á}{{\'A}}1 {É}{{\'E}}1 {Í}{{\'I}}1 {Ó}{{\'O}}1 {Ú}{{\'U}}1
{à}{{\`a}}1 {è}{{\`e}}1 {ì}{{\`i}}1 {ò}{{\`o}}1 {ù}{{\`u}}1
{À}{{\`A}}1 {È}{{\'E}}1 {Ì}{{\`I}}1 {Ò}{{\`O}}1 {Ù}{{\`U}}1
{ä}{{\"a}}1 {ë}{{\"e}}1 {ï}{{\"i}}1 {ö}{{\"o}}1 {ü}{{\"u}}1
{Ä}{{\"A}}1 {Ë}{{\"E}}1 {Ï}{{\"I}}1 {Ö}{{\"O}}1 {Ü}{{\"U}}1
{â}{{\^a}}1 {ê}{{\^e}}1 {î}{{\^i}}1 {ô}{{\^o}}1 {û}{{\^u}}1
{Â}{{\^A}}1 {Ê}{{\^E}}1 {Î}{{\^I}}1 {Ô}{{\^O}}1 {Û}{{\^U}}1
{œ}{{\oe}}1 {Œ}{{\OE}}1 {æ}{{\ae}}1 {Æ}{{\AE}}1 {ß}{{\ss}}1
{ű}{{\H{u}}}1 {Ű}{{\H{U}}}1 {ő}{{\H{o}}}1 {Ő}{{\H{O}}}1
{ç}{{\c c}}1 {Ç}{{\c C}}1 {ø}{{\o}}1 {å}{{\r a}}1 {Å}{{\r A}}1
{€}{{\euro}}1 {£}{{\pounds}}1 {«}{{\guillemotleft}}1
{»}{{\guillemotright}}1 {ñ}{{\~n}}1 {Ñ}{{\~N}}1 {¿}{{?`}}1
}
Be the first to comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.