Start
Uppgiften den här gången går ut på att skapa en webbplats där SASS har använts som pre-processor.
På webbplatsen ska detta finnas med:
- Överskrifter + text med innehåll. Valfritt innehåll
- Undersidan SASS ska ha en utvärdering av arbetet med SASS.
- För- och nackdelar
- Enkelt/svårt att komma igång?
- Huvudmeny med fem alternativ ska finnas. Alla behöver inte leda till något
- Stöd för ljust och mörkt tema ska finnas med media query. Ta fram två färgscheman
- Responsiv webbdesign för innehåll och meny. Gäller på stora och små enheter.
- Minst 2 bilder av något slag.
Följande ska finnas med (med exempel och förklaringar):
- Variabler(minst färgschema ska lagras i variabler).
- Exempel: färg på section -> --section-bg: #fff;
- Color functions. Darken och lighten ska som minst användas, men fler är tillåtet
- Har gjort ett antal knappar på sidan Bilder med olika färg kombinationer/funktioner
- Nesting
- När man "ombonar" element inom "samma" måsvingar: nav{ ul{ li {} } }
- Mixins
- Skapa "kortkommandon" som man senare kan @include i de element man vill
- Selector inheritance - nyckelordet är "@extend"
- Som det låter. Du gör två knappar: lägger till utseendet i den första. Bestämmer dig för att det såg snyggt ut och vill ha det på den andra knappen också. Ex: @extend .btn1
- If/else-satser
- Ungefär som i JavaScript: om elementet får detta namn, använd dessa properties på den. Annars, om den har detta namn, ge den dessa properties.
- Minst en partial
- Om style.scss är "boken", alltså huvuddelen, så är en partial kapitlen i boken.
- Partials med en god filstruktur för CSS-kod