user-settings: separate css and js

This commit is contained in:
Milan
2024-01-01 20:10:44 +01:00
parent 115f4dca60
commit cb068a8578
3 changed files with 35 additions and 41 deletions

View File

@@ -0,0 +1,5 @@
div.col {
float: left;
width: 2rem;
height: 2rem;
}

View File

@@ -0,0 +1,30 @@
var selectedId;
$(document).ready(function() {
$('input.color').click(function() {
selectedId = ($(this).attr('id'));
showColors();
});
});
function showColors() {
var colors = [ '#ef9a9a', '#f48fb1', '#ce93d8', '#b39ddb', '#9fa8da',
'#90caf9', '#81d4fa', '#80deea', '#80cbc4', '#a5d6a7',
'#c5e1a5', '#e6ee9c', '#fff59d', '#ffe082', '#ffcc80',
'#ffab91', '#bcaaa4', '#b0bec5', '#bdc3c7', '#dde4e6',
'#eeeeee', ];
var content = '';
for ( var c in colors) {
var value = colors[c];
content += '<div class="col" value="'+value+'" style="background:'+value+';"> </div>';
}
content += '<br style="clear:both">'
$("#colors").html(content);
$("#colors div.col").click(function() {
var color = $(this).attr("value");
$('#' + selectedId).css('background', color);
$('#' + selectedId).attr('value', color);
});
}

View File

@@ -1,44 +1,3 @@
<script type="text/javascript">
var selectedId;
$(document).ready(function() {
$('input.color').click(function() {
selectedId = ($(this).attr('id'));
showColors();
});
});
function showColors() {
var colors = [ '#ef9a9a', '#f48fb1', '#ce93d8', '#b39ddb', '#9fa8da',
'#90caf9', '#81d4fa', '#80deea', '#80cbc4', '#a5d6a7',
'#c5e1a5', '#e6ee9c', '#fff59d', '#ffe082', '#ffcc80',
'#ffab91', '#bcaaa4', '#b0bec5', '#bdc3c7', '#dde4e6',
'#eeeeee', ];
var content = '';
for ( var c in colors) {
var value = colors[c];
content += '<div class="col" value="'+value+'" style="background:'+value+';"> </div>';
}
content += '<br style="clear:both">'
$("#colors").html(content);
$("#colors div.col").click(function() {
var color = $(this).attr("value");
$('#' + selectedId).css('background', color);
$('#' + selectedId).attr('value', color);
});
}
</script>
<style>
div.col {
float: left;
width: 2rem;
height: 2rem;
}
</style>
<h2>
<TMPL_VAR loc.title>
</h2>