%Teilweise Erzeugt mit dem LaTeX-Generator: http://latex.sehnot.de

%Schriftgröße, Layout, Papierformat, Art des Dokumentes
\documentclass[10pt,oneside,a4paper]{scrartcl}

%Einstellungen der Seitenränder
\usepackage[left=2cm,right=2cm,top=1.5cm,bottom=1.5cm,includeheadfoot]{geometry}

%neue Rechtschreibung
\usepackage[ngerman]{babel}

%Umlaute ermöglichen
\usepackage[utf8]{inputenc}

%Gesamtseitenzahl
\usepackage{lastpage}

% Kopf- und Fußzeile
\usepackage[automark]{scrpage2}

%Quellcode-Listings
\usepackage{listings}

%Hyperlinks
\usepackage{hyperref}




%Kopfzeile
\ihead{Webentwicklung}
\chead{}
\ohead{http://kohnlehome.de/html/sass.pdf}
\setheadsepline{0.5pt}

%Fußzeile
\setfootsepline{0.5pt}
\ifoot{Franz Kohnle}
\cfoot{Seite \thepage\ von  \pageref{LastPage}}
\ofoot{\today}

\pagestyle{scrheadings}

\begin{document}

% Überschrift 
\begin{center}
\LARGE % Schriftgröße
\bfseries % Fettdruck
\sffamily % Serifenlose Schrift
SASS
\end{center}

Quelle: \href{https://sass-lang.com/guide}{sass-lang.com/guide} (siehe auch Unterschiede zwischen SASS und SCSS)
\section*{Node.js und npm}
\subsection*{Versionen ermitteln}
\begin{verbatim} 
node -v
npm -v
\end{verbatim}

\subsection*{PATH-Variable erweitern}
\begin{verbatim} 
C:\Users\...\AppData\Roaming\npm
\end{verbatim}

\subsection*{Proxy-Server konfigurieren}
\begin{verbatim} 
npm config set proxy http://192.168.100.1:8080
npm config set https-proxy http://192.168.100.1:8080
\end{verbatim}

\subsection*{SASS installieren}
\begin{verbatim} 
npm install -g sass
\end{verbatim}

\section*{SASS-Kommandos}
\subsection*{einzelne Datei compilieren}
\begin{verbatim} 
sass input.sass output.css
\end{verbatim}

\subsection*{Bei Verändrung automatisch compilieren}
\begin{verbatim} 
sass --watch input.sass output.css
\end{verbatim}

\subsection*{Komplettes Verzeichnis beobachten und automatisch compilieren}
\begin{verbatim} 
sass --watch verzeichnis/mit/sass-dateien:verzeichnis/mit/css-dateien
\end{verbatim}

\section*{SASS-Quellcode}
\subsection*{Variablen}
\begin{verbatim} 
$farbe1: red
$farbe2: green

body
   background-color: $farbe1
   color: $farbe2
\end{verbatim}

\subsection*{Nesting}
\begin{verbatim} 
nav
  li
    color: red
    
    a
      color: green
\end{verbatim}




\end{document}
