Chalarangelo/30-seconds-of-code

View on GitHub
content/snippets/css/s/25-css-gradients.md

Summary

Maintainability
Test Coverage

Inline HTML
Open

<div class="gradient-box ibiza-sunset"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box crystal-clear"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box nelson"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box blurry-beach"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box titanium"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box bighead"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Line length
Open

excerpt: I hand picked 25 of my favorite CSS gradients from uiGradients for your next design. Get them now!

MD013 - Line length

Tags: line_length

Aliases: line-length Parameters: linelength, codeblocks, tables (number; default 80, boolean; default true)

This rule is triggered when there are lines that are longer than the configured line length (default: 80 characters). To fix this, split the line up into multiple lines.

This rule has an exception where there is no whitespace beyond the configured line length. This allows you to still include items such as long URLs without being forced to break them in the middle.

You also have the option to exclude this rule for code blocks and tables. To do this, set the code_blocks and/or tables parameters to false.

Code blocks are included in this rule by default since it is often a requirement for document readability, and tentatively compatible with code rules. Still, some languages do not lend themselves to short lines.

Inline HTML
Open

<div class="gradient-box velvet-sun"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box forever-lost"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box horizon"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box celestial"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box relay"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box cheer-up-emo-kid"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box noon-to-dusk"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<style>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box sublime-light"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box argon"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box pinky"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box stripe"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box vanusa"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box purple-paradise"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box jshine"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box calm-darya"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Line length
Open

[uiGradients](https://uigradients.com/) has an amazing collection of ready-to-use CSS gradients for pretty much anything. I highly recommend checking out the full collection. Meantime, here are my top picks in case you're looking for some color:

MD013 - Line length

Tags: line_length

Aliases: line-length Parameters: linelength, codeblocks, tables (number; default 80, boolean; default true)

This rule is triggered when there are lines that are longer than the configured line length (default: 80 characters). To fix this, split the line up into multiple lines.

This rule has an exception where there is no whitespace beyond the configured line length. This allows you to still include items such as long URLs without being forced to break them in the middle.

You also have the option to exclude this rule for code blocks and tables. To do this, set the code_blocks and/or tables parameters to false.

Code blocks are included in this rule by default since it is often a requirement for document readability, and tentatively compatible with code rules. Still, some languages do not lend themselves to short lines.

Inline HTML
Open

<div class="gradient-box flare"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box fresh-turboscent"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box starfall"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

Inline HTML
Open

<div class="gradient-box influenza"></div>

MD033 - Inline HTML

Tags: html

Aliases: no-inline-html

This rule is triggered whenever raw HTML is used in a markdown document:

Inline HTML header

To fix this, use 'pure' markdown instead of including raw HTML:

# Markdown header

Rationale: Raw HTML is allowed in markdown, but this rule is included for those who want their documents to only include "pure" markdown, or for those who are rendering markdown documents in something other than HTML.

There are no issues that match your filters.

Category
Status