neyric/wireit

View on GitHub
src/widget-icons/docs/example.mustache

Summary

Maintainability
Test Coverage
<div class="intro">
<p>
This example demonstrates how to create an {{displayName}}.
</p>
</div>

<div class="example">
    <div style="position: relative; width: 300px; height: 200px;" id="layer"></div>
    
    <style>
    
    /* Standard Module Widget CSS */
    .yui3-my-widget-hidden {
        display:none;
    }

    .yui3-my-widget {
        margin:10px;
    }

    .yui3-my-widget-content {
        padding:3px;
        border:1px solid #666;
    }

    .yui3-my-widget-content .yui3-widget-hd {
        padding:5px;
        border:2px solid #aa0000;
        background-color:#fff;
        overflow:auto;
    }

    .yui3-my-widget-content .yui3-widget-bd {
        padding:5px;
        border:2px solid #0000aa;
        background-color:#fff;
        overflow:auto;
    }

    .yui3-my-widget-content .yui3-widget-ft {
        padding:5px;
        border:2px solid #00aa00;
        background-color:#fff;
        overflow:auto;
    }
    
    .yui3-my-widget-icon {
        float: right;
    }
    
    </style>
    
    <script>
{{>example-code}}
    </script>
</div>

<h2>HTML</h2>

```
<div style="position: relative; width: 300px; height: 200px;" id="layer"></div>


<style>

/* Standard Module Widget CSS */
.yui3-my-widget-hidden {
    display:none;
}

.yui3-my-widget {
    margin:10px;
}

.yui3-my-widget-content {
    padding:3px;
    border:1px solid #666;
}

.yui3-my-widget-content .yui3-widget-hd {
    padding:5px;
    border:2px solid #aa0000;
    background-color:#fff;
    overflow:auto;
}

.yui3-my-widget-content .yui3-widget-bd {
    padding:5px;
    border:2px solid #0000aa;
    background-color:#fff;
    overflow:auto;
}

.yui3-my-widget-content .yui3-widget-ft {
    padding:5px;
    border:2px solid #00aa00;
    background-color:#fff;
    overflow:auto;
}

.yui3-my-widget-icon {
    float: right;
}

</style>

```

<h2>JavaScript</h2>


<h3>Implementation</h3>

```
{{>example-code}}
```