Communities

Writing
Writing
Codidact Meta
Codidact Meta
The Great Outdoors
The Great Outdoors
Photography & Video
Photography & Video
Scientific Speculation
Scientific Speculation
Cooking
Cooking
Electrical Engineering
Electrical Engineering
Judaism
Judaism
Languages & Linguistics
Languages & Linguistics
Software Development
Software Development
Mathematics
Mathematics
Christianity
Christianity
Code Golf
Code Golf
Music
Music
Physics
Physics
Linux Systems
Linux Systems
Power Users
Power Users
Tabletop RPGs
Tabletop RPGs

Dashboard
Notifications
Mark all as read
Q&A

Post History

75%
+4 −0
Q&A How to test CoDesign?

posted 6mo ago by ArtOfCode‭

Answer
#1: Initial revision by user avatar ArtOfCode‭ · 2021-08-07T10:47:15Z (6 months ago)
I have a test page on my local dev environment so that I can test things. If you look at `.gitignore`, you'll find there's an ignore in there for `scratch/*` already.

Create a directory called `scratch`, add an `index.html` in there something like this:

```html
<!-- index.html -->
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Test Page</title>
    <link href="../dist/codidact.css" rel="stylesheet" type="text/css" />
    <script src="../js/co-design.js" type="application/javascript" defer></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" type="application/javascript"></script>
    <script src="scratch.js" type="application/javascript"></script>
</head>
<body>
    <header class="header is-dark h-bg-green-700">
        <div class="container header--container">
            <div class="header--brand">
                <a class="header--instance-name" href="#">Codidact</a>
                <a class="header--site-name" href="#">Gibberish</a>
            </div>
            <div class="header--menu">
                <a class="header--item is-visible-on-mobile is-complex" href="#">
                    <img src="https://placekitten.com/100/100" class="header--item-image" alt="..." />
                    <span class="header--alert">1</span>
                    <span class="header--trust-level">5</span>
                </a>
            </div>
        </div>
    </header>
    <main class="container">
        <!-- add whatever you want to test in here -->
    </main>
</body>
</html>
```

I also have a `scratch.js` file in the same directory so that I can test any JS functionality, but if you're just making CSS changes that HTML is all you'll need.