Icon request: icon-check-all icon-uncheck-all

[shyndman]

Examples:

I suppose you could get away with stacking the existing icons. I might give that a shot to see how it looks.

[gramx]

I think there is a bad link there for one of thoughs here is another example:

[wstrik]

+1

[suhuichen]

+1

[chellberg]

+1

[mafk]

+1

[jinglesthula]

+1 (two squares is better than three, IMO, especially at smaller sizes)

[dincozdemir]

+1

[glueball]

+1

[jakubste]

+1

[jonatanskogsfors]

+1

[clabnet]

+1

[ulybu]

Personally I use this snippet to produce "select all checkbox" :
⚠️ May use pro features

<div style="height: 1em; width: 1em;">
  <i class="far fa-square"            style="position: absolute; top: 0px; left: 0px;"/>
  <i class="fas fa-square fa-inverse" style="position: absolute; top: 2px; left: 2px;"/>
  <i class="far fa-check-square"      style="position: absolute; top: 3px; left: 3px;"/>
  <!--This line for "unselect all" icon
    <i class="far fa-square"      style="position: absolute; top: 3px; left: 3px;"/>
  -->
</div>

[BartusZak]

Thanks man for provided solution.

JSX Bootstrap v4.0

JSX

<div className="selectAllIcons" onClick={() => this.addAllGroups()} title="Wybierz wszystko">
   <i class="fa fa-square"            style={{position: "absolute", top: "0px", left: "0px"}}/>
    <i class="fa fa-square fa-inverse" style={{position: "absolute", top: "2px", left: "2px"}}/>
    <i class="fa fa-check-square"      style={{position: "absolute", top: "3px", left: "3px"}}/>
</div>
 <div className="unSelectAllIcons" onClick={() => this.generatingGroups()} title="Odznacz wszystko">
      <i class="fa fa-square"            style={{position: "absolute", top: "0px", left: "0px"}}/>
      <i class="fa fa-square fa-inverse" style={{position: "absolute", top: "2px", left: "2px"}}/>
       <i class="fa fa-check-square"      style={{position: "absolute", top: "3px", left: "3px"}}/>
      <i class="fa fa-square"            style={{position: "absolute", top: "3px", left: "3px"}}/>
</div>

CSS
.unSelectAllIcons,
    .selectAllIcons {
        height: 1em;
        width: 1em;
        position: relative;
        display: inline-block;
        margin: 0 20px 0 20px;
}

PREVIEW

[sensibleworld]

This is a quick update to let folks know that we’re refining our icon request workflow behind the scenes, and as part of that we’re going through all open requests and filing them into several new buckets to be addressed.

In this case we’ve added this issue to our new list to be created! We can’t promise any firm timelines right now, but this will help us keep track of it.

We’ll update this issue when the icon is released into the wild 🙂