Chalarangelo/30-seconds-of-code

View on GitHub
content/snippets/css/s/image-hover-menu.md

Summary

Maintainability
Test Coverage

Hard tabs
Open

    <div>

MD010 - Hard tabs

Tags: whitespace, hard_tab

Aliases: no-hard-tabs

This rule is triggered by any lines that contain hard tab characters instead of using spaces for indentation. To fix this, replace any hard tab characters with spaces instead.

Example:

Some text

    * hard tab character used to indent the list item

Corrected example:

Some text

    * Spaces used to indent the list item instead

Hard tabs
Open

    </div>

MD010 - Hard tabs

Tags: whitespace, hard_tab

Aliases: no-hard-tabs

This rule is triggered by any lines that contain hard tab characters instead of using spaces for indentation. To fix this, replace any hard tab characters with spaces instead.

Example:

Some text

    * hard tab character used to indent the list item

Corrected example:

Some text

    * Spaces used to indent the list item instead

Hard tabs
Open

        <a href="#">About</a>

MD010 - Hard tabs

Tags: whitespace, hard_tab

Aliases: no-hard-tabs

This rule is triggered by any lines that contain hard tab characters instead of using spaces for indentation. To fix this, replace any hard tab characters with spaces instead.

Example:

Some text

    * hard tab character used to indent the list item

Corrected example:

Some text

    * Spaces used to indent the list item instead

Hard tabs
Open

    <img src="https://picsum.photos/id/1060/800/480.jpg"/>

MD010 - Hard tabs

Tags: whitespace, hard_tab

Aliases: no-hard-tabs

This rule is triggered by any lines that contain hard tab characters instead of using spaces for indentation. To fix this, replace any hard tab characters with spaces instead.

Example:

Some text

    * hard tab character used to indent the list item

Corrected example:

Some text

    * Spaces used to indent the list item instead

Line length
Open

- Use the `opacity` and `right` attributes to animate the image on hover, creating a sliding effect.

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.

Line length
Open

- Set the `left` attribute of the `<div>` to the negative of the element's `width`. Reset it to `0` when hovering over the parent element to slide in the menu.

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.

Line length
Open

- Use `display: flex`, `flex-direction: column` and `justify-content: center` on the `<div>` to vertically center the menu items.

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.

Line length
Open

- Use a `<figure>` to wrap the `<img>` element and a `<div>` element that will contain the menu links.

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.

Hard tabs
Open

        <a href="#">Home</a>

MD010 - Hard tabs

Tags: whitespace, hard_tab

Aliases: no-hard-tabs

This rule is triggered by any lines that contain hard tab characters instead of using spaces for indentation. To fix this, replace any hard tab characters with spaces instead.

Example:

Some text

    * hard tab character used to indent the list item

Corrected example:

Some text

    * Spaces used to indent the list item instead

Hard tabs
Open

        <a href="#">Pricing</a>

MD010 - Hard tabs

Tags: whitespace, hard_tab

Aliases: no-hard-tabs

This rule is triggered by any lines that contain hard tab characters instead of using spaces for indentation. To fix this, replace any hard tab characters with spaces instead.

Example:

Some text

    * hard tab character used to indent the list item

Corrected example:

Some text

    * Spaces used to indent the list item instead

There are no issues that match your filters.

Category
Status