kalipso/racalmas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

flat restyle

Browse Source
This commit is contained in:
Milan
2018-10-13 23:54:33 +02:00
parent 39ac0d4581
commit ac4d2676a3
8 changed files with 271 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
website/agenda/planung/css/admin.css
View File

@@ -10,11 +10,16 @@ body{
body #content{
margin:0;
padding:1em;
max-width:1200px;
color:#000;
background:#fff;
text-align:left;
max-width:1200px;
margin-left:auto;
margin-right:auto;
}
div{
transition: background-color 0.5s linead;
}
#selectImage #content{
@@ -30,7 +35,7 @@ body,
#content option,
#content li{
font-size:0.75rem;
font-family:Roboto,sans-serif;
font-family:Roboto,sans-serif;
}
#content textarea{
@@ -67,19 +72,12 @@ body,
#calcms_admin_menu div,
#calcms_admin_menu input,
#calcms_admin_menu select,
#calcms_admin_menu option,
#calcms_admin_menu img
{
#calcms_admin_menu option{
margin:0;
padding:0;
color:#fff;
}
#calcms_admin_menu img{
border:0;
vertical-align:middle;
}
#calcms_admin_menu,
#calcms_admin_menu select{
background:#444;
@@ -151,7 +149,7 @@ a{
#content div{
padding:6px;
padding:1rem;
}
#content div.header{
@@ -239,10 +237,22 @@ li.ui-menu-item{
#content div.warn,
#content div.error{
font-weight:bold;
margin:0.5rem;
margin:0;
padding:1rem;
}
#content span.ok,
#content span.warn,
#content span.error{
font-weight:bold;
padding:1px;
}
#content span.ok,
#content span.error{
color:white;
}
div.ok{
color:white;
background:#0c0;
@@ -354,7 +364,7 @@ tr.tablesorter-filter-row input{
padding:8px;
margin-top:0px;
margin-bottom:0px;
margin-left:6px;
margin-left:0.5rem;
text-align: center;
text-decoration: none;
font-size: 12px;
@@ -375,7 +385,7 @@ tr.tablesorter-filter-row input{
#content input[type="file"]:hover,
#content button:focus{
outline:0;
transition:all 0.5s cubic-bezier(.64,.09,.08,1)
transition:background 0.5s cubic-bezier(.64,.09,.08,1)
}
#content input[type="submit"]:hover,
@@ -392,7 +402,7 @@ tr.tablesorter-filter-row input{
padding:8px;
margin-top:0px;
margin-bottom:0px;
margin-left:6px;
margin-left:0.5rem;
text-decoration: none;
}
@@ -416,7 +426,7 @@ tr.tablesorter-filter-row input{
border:none;
border-bottom:solid 1px #9e9e9e;
cursor:pointer;
margin-left:6px;
margin-left:0.5rem;
}
#content select,
@@ -425,7 +435,7 @@ input[type='checkbox']{
}
#content div.buttons button{
margin-bottom:6px;
margin-bottom:1rem;
}
#content div.formField div.label{
@@ -493,3 +503,7 @@ body,
opacity:0.5;
}
#content div.buttons{
margin-top:-1rem;
margin-bottom:-1rem;
}

51
website/agenda/planung/css/calendar.css
View File

@@ -120,11 +120,6 @@ button:hover{
background:#ccf;
}
#calendar div.grid{
overflow:hidden;
position:absolute;
background:white;
}
#calendar_weekdays td.week,
#calendar td.week{
@@ -139,8 +134,7 @@ button:hover{
padding:0;
min-width:1px;
height:100%;
background:#666;
background-image:url(../image/chess.gif);
background:repeating-linear-gradient(to right, #fff, #fff 1px, #999 1px, #999 2px);
}
#calendar td.week div{
@@ -154,14 +148,12 @@ button:hover{
#calendar div.schedule,
#calendar div.work,
#calendar div.play{
overflow:hidden;
font-size:12px;
border-right:0;
position:absolute;
margin-left:0px;
overflow:hidden;
margin-left:0;
border:0;
border-bottom:1px solid #666;
border-top:1px solid #666;
border-bottom:1px solid #fff;
border-top:1px solid #fff;
}
#calendar div.time,
@@ -171,7 +163,7 @@ button:hover{
#calendar div.time,
#calendar_weekdays div.time{
border-top:1px solid #666;
border-top:1px solid #fff;
}
/* calendar list*/
@@ -204,8 +196,11 @@ button:hover{
#content div.grid{
z-index:1;
margin-left:0px;
background:white;
overflow:hidden;
position:absolute;
background: repeating-linear-gradient( 45deg, #fff, #fff 1rem ,#eee 1rem, #eee 2rem);
cursor:pointer;
}
#event_list tr th:hover{
@@ -359,12 +354,12 @@ div#toolbar{
padding:0;
width:100%;
background:#ddd;
display: flex;
flex-wrap: wrap;
align-items: center;
vertical-align:middle;
z-index:99;
left:0;
}
div#toolbar div{
@@ -422,11 +417,6 @@ div#toolbar input.search{
padding:6px;
}
#calendar div {
transition: all 0.1s;
transition-delay: 0s;
}
#calendar td div.play:hover {
min-height: 180px!important;
min-width: 420px!important;
@@ -461,18 +451,6 @@ div#toolbar input.search{
background:#fcc;
}
#calendar div.event.error,
#calendar div.event.schedule{
/* width:50%; */
}
#calendar div.event.error.x2,
#calendar div.event.schedule.x2{
/*
margin-left:50%;
*/
}
div.rms_detail{
width:100%
}
@@ -510,4 +488,11 @@ div.play .error{
background:#f44336;
}
#content div.event,
#content div.scheduled,
#content div.grid,
#content div.playout{
padding-top:0.4rem;
padding-bottom:1rem;
}

5
website/agenda/planung/css/event.css
View File

@@ -27,7 +27,6 @@ pre{
height:24px;
}
#content .edit_event input,
#content .edit_event select,
#content .edit_event textarea{
@@ -36,15 +35,18 @@ pre{
#content .excerpt{
width:100%;
max-width:40rem;
height:3em;
}
#content textarea{
width:100%;
max-width:40rem;
}
#content .edit_event input.url{
width:100%;
max-width:40rem;
}
#content .panel{
@@ -64,3 +66,4 @@ pre{
width:3em;
}

4
website/agenda/planung/css/show-playout.css
View File

@@ -24,6 +24,10 @@ table{
border-top:1px solid #666;
}
#content tr.past{
background:#ccc;
}
#content td{
padding:3px;

44
website/agenda/planung/js/calendar.js
View File

@@ -557,17 +557,6 @@ function initCalendarMenu(){
resizeCalendarMenu();
}
$(document).ready(function(){
// $('#calendar').hide();
initCalendarMenu();
if(calendarTable==1){
loadCalendar();
}else{
loadCalendarList();
}
});
function createId(prefix) {
function s4() {
return Math.floor((1 + Math.random()) * 0x10000)
@@ -694,6 +683,7 @@ function loadCalendar(url, mouseButton){
$('#current_date').html(current_date);
updateUrls(url);
initRmsPlot();
adjustColors();
});
}
@@ -1047,3 +1037,35 @@ function handleWorktime(id, event){
}
}
function hexToRgbA(hex){
var c;
if(/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)){
c= hex.substring(1).split('');
if(c.length== 3){
c= [c[0], c[0], c[1], c[1], c[2], c[2]];
}
c= '0x'+c.join('');
return 'rgba('+[(c>>16)&255, (c>>8)&255, c&255].join(',')+',1)';
}
throw new Error('Bad Hex');
}
function adjustColors(){
var elem = $('.schedule').get(0);
var color1=window.getComputedStyle(elem).backgroundColor;
var color2=color1.replace('rgb','rgba').replace(')',', 0.4)')
$('.schedule').css('background', 'repeating-linear-gradient(to right, '+color1+', '+color1+' 1px, '+color2+' 1px, '+color2+' 2px) ');
}
$(document).ready(function(){
// $('#calendar').hide();
initCalendarMenu();
if(calendarTable==1){
loadCalendar();
}else{
loadCalendarList();
}
});

3
website/agenda/planung/templates/default.html
View File

@@ -1,6 +1,5 @@
<TMPL_INCLUDE header.html>
<center>
<nav id="calcms_admin_menu">
<div><a href="/"><i class="fas fa-rocket"></i>&nbsp;<TMPL_VAR .loc.preview></a></div>
@@ -77,7 +76,7 @@
<i class="fas fa-caret-down"></i>
</div>
<div><a id="logout" href="<TMPL_VAR .presets.logout_url>?action=logout" expires="<TMPL_VAR .expires>"><i class="fas fa-sign-out-alt"></i>&nbsp;<TMPL_VAR .presets.user> <TMPL_VAR .loc.logout></a></div>
<div><a id="logout" href="<TMPL_VAR .presets.logout_url>?authAction=logout" expires="<TMPL_VAR .expires>"><i class="fas fa-sign-out-alt"></i>&nbsp;<TMPL_VAR .presets.user> <TMPL_VAR .loc.logout></a></div>
</nav>

6
website/agenda/planung/templates/show_playout.html
View File

@@ -12,6 +12,7 @@
<table id="playout-table" class="table">
<thead>
<tr>
<th>start</th>
@@ -22,11 +23,12 @@
<th>image</th>
<th>bytes</th>
<th>modified at</th>
</thead>
</tr>
</thead>
<tbody>
<TMPL_LOOP events>
<tr>
<tr class="<TMPL_VAR class>">
<td><TMPL_VAR start></td>
<td><TMPL_VAR file></td>
<td><TMPL_VAR duration escape="text"></td>

332
website/agenda/planung/templates/user_settings.html
View File

@@ -1,183 +1,201 @@
<script type="text/javascript">
var selectedId;
var selectedId;
$(document).ready(
function(){
$('input.color').click(
function(){
selectedId=($(this).attr('id'));
showColors();
}
);
$(document).ready(function() {
$('input.color').click(function() {
selectedId = ($(this).attr('id'));
showColors();
});
//$("#content").append(getColor(8));
}
);
});
/*
function getColor(noOfColors) {
var html = "";
var frequency = 5 / noOfColors;
for (var i = 0; i < noOfColors;++i) {
r = Math.sin(frequency * i + 0) * (127) + 128;
g = Math.sin(frequency * i + 1) * (127) + 128;
b = Math.sin(frequency * i + 3) * (127) + 128;
li = '<li class="color" style="background-color:rgb({r},{g},{b});"> </li>';
li = li.replace("{r}", Math.floor(r));
li = li.replace("{g}", Math.floor(g));
li = li.replace("{b}", Math.floor(b));
html = html + li;
}
return html;
}
/*
function getColor(noOfColors) {
var html = "";
var frequency = 5 / noOfColors;
for (var i = 0; i < noOfColors;++i) {
r = Math.sin(frequency * i + 0) * (127) + 128;
g = Math.sin(frequency * i + 1) * (127) + 128;
b = Math.sin(frequency * i + 3) * (127) + 128;
li = '<li class="color" style="background-color:rgb({r},{g},{b});"> </li>';
li = li.replace("{r}", Math.floor(r));
li = li.replace("{g}", Math.floor(g));
li = li.replace("{b}", Math.floor(b));
html = html + li;
}
return html;
}
function showColors(){
var colors=['00','22','44','66','88','aa','cc','ee','ff'];
var content='';
function showColors(){
var colors=['00','22','44','66','88','aa','cc','ee','ff'];
var content='';
for (var i in colors){
for (var j in colors){
var r=colors[i];
var g=colors[colors.length-j-1];
var b =Math.round((i-j))% colors.length;
if(b<0)b=Math.round((j-i))% colors.length;
b=colors[b]
var value='#'+r+g+b;
content+='<div class="col" value="'+value+'" style="background:'+value+';"> </div>';
for (var i in colors){
for (var j in colors){
var r=colors[i];
var g=colors[colors.length-j-1];
var b =Math.round((i-j))% colors.length;
if(b<0)b=Math.round((j-i))% colors.length;
b=colors[b]
var value='#'+r+g+b;
content+='<div class="col" value="'+value+'" style="background:'+value+';"> </div>';
}
content+='<br style="clear:both">'
}
for (var i in colors){
var gray=colors[colors.length-i-1];
var value='#'+gray+gray+gray;
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);
}
);
}
*/
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">'
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);
});
}
for (var i in colors){
var gray=colors[colors.length-i-1];
var value='#'+gray+gray+gray;
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);
}
);
}
*/
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:10px;
height:10px;
float: left;
width: 10px;
height: 10px;
}
</style>
<h2><TMPL_VAR loc.title></h2>
<h2>
<TMPL_VAR loc.title>
</h2>
<TMPL_INCLUDE status.html>
<form method="post">
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<form method="post">
<input type="hidden" name="action" value="save">
<button onclick="$(this).submit()">
<TMPL_VAR loc.button_colors_save>
</button>
<table>
<tr>
<td style="max-width:10em;"><TMPL_VAR loc.label_language></td>
<td>
<select name="language">
<option value="de" <TMPL_IF language_de>selected="selected"</TMPL_IF> >Deutsch</option>
<option value="en" <TMPL_IF language_en>selected="selected"</TMPL_IF> >English</option>
</select>
</td>
</tr>
<tr>
<td style="max-width:10em;"><TMPL_VAR loc.label_period></td>
<td>
<select name="period">
<option value="7" <TMPL_IF period_7>selected="selected"</TMPL_IF> ><TMPL_VAR .loc.label_period_7></option>
<option value="14" <TMPL_IF period_14>selected="selected"</TMPL_IF> ><TMPL_VAR .loc.label_period_14></option>
<option value="month" <TMPL_IF period_month>selected="selected"</TMPL_IF> ><TMPL_VAR .loc.label_period_month></option>
<option value="28" <TMPL_IF period_28>selected="selected"</TMPL_IF> ><TMPL_VAR .loc.label_period_28></option>
</select>
</td>
</tr>
<TMPL_LOOP colors>
<tr>
<td><TMPL_VAR .loc.label_color>: <TMPL_VAR title></td>
<td><input id="<TMPL_VAR name>" style="background:<TMPL_VAR value>" name="<TMPL_VAR name>" class="color" value="<TMPL_VAR value>"></td>
</tr>
</TMPL_LOOP>
</table>
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<table>
<tr>
<td style="max-width: 10em;"><TMPL_VAR
loc.label_language></td>
<td><select name="language">
<option value="de"<TMPL_IF language_de>selected="selected"</TMPL_IF>
>Deutsch
</option>
<option value="en"<TMPL_IF language_en>selected="selected"</TMPL_IF>
>English
</option>
</select></td>
</tr>
<tr>
<td style="max-width: 10em;"><TMPL_VAR loc.label_period></td>
<td><select name="period">
<option value="7"<TMPL_IF period_7>selected="selected"</TMPL_IF>
>
<TMPL_VAR .loc.label_period_7></option>
<option value="14"<TMPL_IF period_14>selected="selected"</TMPL_IF>
>
<TMPL_VAR .loc.label_period_14></option>
<option value="month"<TMPL_IF period_month>selected="selected"</TMPL_IF>
>
<TMPL_VAR .loc.label_period_month></option>
<option value="28"<TMPL_IF period_28>selected="selected"</TMPL_IF>
>
<TMPL_VAR .loc.label_period_28></option>
</select></td>
</tr>
<TMPL_LOOP colors>
<tr>
<td><TMPL_VAR .loc.label_color>: <TMPL_VAR
title></td>
<td><input id="<TMPL_VAR name>"
style="background: &lt;TMPL_VAR value&gt;"
name="<TMPL_VAR name>" class="color"
value="<TMPL_VAR value>"></td>
</tr>
</TMPL_LOOP>
</table>
<div id="colors"></div>
<input type="hidden" name="action" value="save">
<button onclick="$(this).submit()"><TMPL_VAR loc.button_colors_save></button>
</form>
</form>
<form method="post" style="margin-top:2px">
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<input type="hidden" name="action" value="save">
<button onclick="$(this).submit()"><TMPL_VAR loc.button_colors_reset></button>
</form>
<form method="post" style="margin-top: 2px;float:left">
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<input type="hidden" name="action" value="updateDefaultProjectStudio">
<button onclick="$(this).submit()">
<TMPL_VAR loc.setDefaultProjectStudio>
</button>
</form>
<form method="post" style="margin-top: 2px">
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<input type="hidden" name="action" value="save">
<button onclick="$(this).submit()">
<TMPL_VAR loc.button_colors_reset>
</button>
</form>
<h3 style="clear:both"><TMPL_VAR .loc.label_change_password></h3>
<TMPL_VAR .loc.password_hint>
<form action="users.cgi" method="post">
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<input type="hidden" name="action" value="change_password">
<table>
<tr> <td><TMPL_VAR .loc.label_password></td> <td><input name="user_password" value="<TMPL_VAR password>"></td> </tr>
<tr> <td><TMPL_VAR .loc.label_password2></td><td><input name="user_password2" value="<TMPL_VAR password2>"></td> </tr>
</table>
<button onclick="$(this).submit()"><TMPL_VAR loc.button_change_password></button>
</form>
<h3 style="clear: both">
<TMPL_VAR .loc.label_change_password>
</h3>
<TMPL_VAR .loc.password_hint>
<form action="users.cgi" method="post">
<input type="hidden" name="project_id" value="<TMPL_VAR project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
<input type="hidden" name="action" value="change_password">
<table>
<tr>
<td><TMPL_VAR .loc.label_password></td>
<td><input name="user_password"
value="<TMPL_VAR password>"></td>
</tr>
<tr>
<td><TMPL_VAR .loc.label_password2></td>
<td><input name="user_password2"
value="<TMPL_VAR password2>"></td>
</tr>
</table>
<button onclick="$(this).submit()">
<TMPL_VAR loc.button_change_password>
</button>
</form>
</body>
</html>
</html>