serv/surwiki
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add rainbow bar to test-themes

Browse source
This commit is contained in:
Magnus Hovland Hoff 2018-08-31 21:30:46 +02:00
parent 94db59c44c
commit 7b1a0256e1
1 changed files with 16 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
assets/test-themes.html
View file

@ -16,9 +16,18 @@
.proto { .proto {
display: none; display: none;
} }
#bar {
display: flex;
width: 100%;
}
#bar>div {
height: 30px;
flex-grow: 1;
}
</style> </style>
</head> </head>
<body> <body>
<div id="bar"></div>
<div class="proto"> <div class="proto">
<div class="themed">The <span class="link">quick</span> brown <span class="link">dog</span> jumps over the lazy log <span class="theme-name"></span></div> <div class="themed">The <span class="link">quick</span> brown <span class="link">dog</span> jumps over the lazy log <span class="theme-name"></span></div>
<div class="themed"><input type=search placeholder=placeholder> <input type=search value="Bacon"></div> <div class="themed"><input type=search placeholder=placeholder> <input type=search value="Bacon"></div>
@ -33,6 +42,13 @@
block.querySelector(".theme-name").textContent = theme; block.querySelector(".theme-name").textContent = theme;
body.appendChild(block); body.appendChild(block);
} }
const bar = document.querySelector("#bar");
for (theme of themes) {
const block = document.createElement("div");
block.className = `theme-${theme} themed`;
bar.appendChild(block);
}
</script> </script>
</body> </body>
</html> </html>