user-settings: separate css and js
This commit is contained in:
5
website/agenda/planung/css/user-settings.css
Normal file
5
website/agenda/planung/css/user-settings.css
Normal file
@@ -0,0 +1,5 @@
|
||||
div.col {
|
||||
float: left;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
}
|
||||
30
website/agenda/planung/js/user-settings.js
Normal file
30
website/agenda/planung/js/user-settings.js
Normal 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);
|
||||
});
|
||||
}
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user