templates: use .panel for raised areas

This commit is contained in:
Milan
2021-03-13 16:07:28 +01:00
parent 8ded3e955d
commit ade59d421a
16 changed files with 55 additions and 49 deletions

View File

@@ -204,35 +204,26 @@ a {
background: #fff;
}
#content textarea {
font-weight: normal;
}
div.editor {
padding-left: 1rem;
padding-right: 1rem;
}
#content .panel {
border: 1px solid rgba(0, 0, 0, .03);
box-shadow: 0 2px 2px rgba(0, 0, 0, .24), 0 0 2px rgba(0, 0, 0, .12);
background:white;
margin: 4px;
padding: 1rem;
border: 1px solid rgba(0, 0, 0, .03);
box-shadow: 0 2px 2px rgba(0, 0, 0, .24),
0 0 2px rgba(0, 0, 0, .12);
border-radius:0.3rem;
}
#content div.panel-header {
font-weight:bold;
clear: both;
text-align: left;
align-content: center;
align-items: center;
display: flex;
justify-content: center;
padding: 8px 20px;
color: rgba(0, 0, 0, .54);
background: rgba(0, 0, 0, .03);
}
#content div.panel-body {
padding: 1rem;
padding: 0.5rem;
}
#content .field {

View File

@@ -256,8 +256,12 @@ form {
}
}
/*
#content .editor .row:nth-child(2n+1){
background:#eee;
div.editor > form > table{
background:white;
}
*/
div.editor > form > table td{
padding-left:1rem;
padding-right:1rem;
}

View File

@@ -289,7 +289,7 @@ sub show_roles {
}
}
$out .= '<hr>';
$out .= '<div class="panel">';
$out .= '<table class="table">';
my $localization = localization::get( $config, { user => $params->{presets}->{user}, file => 'roles' } );
for my $key ( keys %$localization ) {

View File

@@ -7,7 +7,7 @@
</script>
<h1>create events from schedule</h1>
<div class="panel">
<form id="create_event_form" method="post">
<input type="hidden" name="project_id"
value="<TMPL_VAR .project_id>"> <input type="hidden"
@@ -28,8 +28,8 @@
value="create_events">create</button>
</TMPL_IF>
</form>
<div class="view" style="clear: both">
</div>
<div class="panel view" style="clear: both">
<TMPL_VAR action> <TMPL_VAR created_total>
events from <TMPL_VAR from_date> till <TMPL_VAR till_date>
<br>
@@ -37,6 +37,7 @@
<TMPL_LOOP events> <TMPL_var start> <TMPL_var
full_title> <br></TMPL_LOOP> </view>
</div>
</body>
</html>

View File

@@ -4,8 +4,6 @@
<div id="bars" class="mobile" onclick="handleBars();return false;"> <a><img src="image/more.svg"> Menu</a></div>
<div><a href="/" ><img src="image/preview.svg">&nbsp;<TMPL_VAR .loc.preview></a></div>
<TMPL_IF .allow.read_event>
<div><a id="menu_calendar" href="calendar.cgi?project_id=<TMPL_VAR project_id>&studio_id=<TMPL_VAR studio_id>"><img src="image/calendar.svg">&nbsp;<TMPL_VAR .loc.calendar></a></div>
</TMPL_IF>
@@ -83,6 +81,8 @@
<img src="image/arrow-down.svg">
</div>
<div><a href="/" ><img src="image/preview.svg">&nbsp;<TMPL_VAR .loc.preview></a></div>
<div class="mobile"><a id="logout" href="<TMPL_VAR .presets.logout_url>?authAction=logout" expires="<TMPL_VAR .expires>"><img src="image/logout.svg">&nbsp;<TMPL_VAR .presets.user> <TMPL_VAR .loc.logout></a></div>
</nav>

View File

@@ -52,7 +52,6 @@
}
);
</script>
</head>
@@ -266,7 +265,7 @@
</TMPL_UNLESS>
<!-- download output -->
<TMPL_IF download>
<div type="hidden" name="event_id" ><TMPL_VAR download escape=none></div>
<div type="hidden" class="panel" name="event_id" ><TMPL_VAR download escape=none></div>
</TMPL_IF>
@@ -575,7 +574,7 @@
</div>
<TMPL_IF .allow.read_comment>
<div id="comments">
<div id="comments" class="panel">
<button id="showComment" onclick="showEventComments('<TMPL_VAR id>')"><TMPL_VAR .loc.label_comments></button>
<div class="event" id="event_<TMPL_VAR id>_comments" style="line-height:100%;display:none;"> </div>
</div>

View File

@@ -99,7 +99,7 @@
<!-- edit template-->
<TMPL_IF .allow.update_series_template>
<div id="tabs-template">
<div id="tabs-template" class="panel">
<div id="edit_<TMPL_VAR .series_id>" class="editor">
<form method="post" action="series.cgi?project_id=<TMPL_VAR .project_id>&studio_id=<TMPL_VAR .studio_id>&series_id=<TMPL_VAR .series_id>#tabs-template">
@@ -190,7 +190,7 @@
</TMPL_IF>
<!-- schedule -->
<div id="tabs-schedule">
<div id="tabs-schedule" class="panel">
<!-- edit schedule -->
<TMPL_IF .allow.update_schedule>
@@ -451,7 +451,7 @@
</div>
<!-- series events -->
<div id="tabs-events">
<div id="tabs-events" class="panel">
<table class="table">
<TMPL_LOOP events>
@@ -484,7 +484,7 @@
<TMPL_UNLESS has_single_events>
<!-- series members -->
<div id="tabs-members">
<div id="tabs-members" class="panel">
<table>
<!-- add members -->
@@ -604,7 +604,7 @@
<!-- delete series -->
<TMPL_IF .allow.delete_series>
<div id="tabs-delete">
<div id="tabs-delete" class="panel">
<center>
<div><TMPL_VAR .loc.label_delete_series></div>
<div>
@@ -623,7 +623,9 @@
</TMPL_IF>
</TMPL_UNLESS> <!-- has single events-->
<div class="label right"><TMPL_VAR .loc.modified> <TMPL_VAR .loc.at> <TMPL_VAR modified_at> <TMPL_VAR .loc.by> <TMPL_VAR modified_by>.</div>
<div class="label right"
style="background:none"
><TMPL_VAR .loc.modified> <TMPL_VAR .loc.at> <TMPL_VAR modified_at> <TMPL_VAR .loc.by> <TMPL_VAR modified_by>.</div>
</main>
</body>

View File

@@ -37,6 +37,7 @@
</div>
<!-- edit schedule -->
<div class="panel">
<TMPL_IF .allow.update_schedule>
<div id="edit_schedule_<TMPL_VAR .schedule_id>" class="editor">
<TMPL_LOOP schedule>
@@ -303,7 +304,7 @@
</tbody>
</table>
</div>
</div>
</body>
</html>

View File

@@ -1,6 +1,6 @@
<script src="js/edit-image.js" type="text/javascript"></script>
<div class="editor">
<div class="editor" class="panel">
<TMPL_IF action>
<TMPL_IF error>
<div class="error">failed</div>

View File

@@ -66,12 +66,12 @@
<!-- upload images -->
<TMPL_IF .allow.create_image>
<div id="image-tabs-upload">
<div id="image-tabs-upload" class="panel">
</div>
</TMPL_IF>
</div>
<div id="imageList">
<div id="imageList" class="panel">
<div style="clear:both; display:flex; flex-direction:row;">
<div>

View File

@@ -1,5 +1,5 @@
<script>
var region='<TMPL_VAR loc.region>';
var region='<TMPL_VAR loc.region>';
</script>
<h2><TMPL_VAR .loc.title></h2>

View File

@@ -20,7 +20,7 @@
<!-- schedule -->
<TMPL_IF .allow.update_schedule>
<div id="tabs-schedule">
<div id="tabs-schedule" class="panel">
<!-- edit schedule -->
<div id="edit_schedule" class="editor">
@@ -111,7 +111,7 @@
</TMPL_IF>
<!-- show schedule -->
<div id="tabs-events">
<div id="tabs-events" class="panel">
<div class="show_schedule_head"> <TMPL_VAR loc.label_select_range>
<div id="show_date"> </div>
</div>

View File

@@ -1,11 +1,14 @@
<script src="js/image.js" type="text/javascript"></script>
<script type="text/javascript">
var region='<TMPL_VAR loc.region>';
</script>
<h2><TMPL_VAR .loc.title></h2>
<TMPL_IF .allow.update_studio>
<div style="clear:both" class="newstudio">
<button onclick="add_studio('<TMPL_VAR name>')"><TMPL_VAR .loc.button_add_studio></button><br/>
<div id="edit_new" class="panel" style="clear:both;display:none">
<div id="edit_new" class="panel panel-body" style="clear:both;display:none">
<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>">

View File

@@ -44,6 +44,7 @@ div.col {
</h2>
<TMPL_INCLUDE status.html>
<div class="panel">
<form method="post">
<input class="primary" type="hidden" name="action" value="save">
<button onclick="$(this).submit()">
@@ -121,8 +122,9 @@ div.col {
<TMPL_VAR loc.button_colors_reset>
</button>
</form>
</div>
<div class="panel">
<h3 style="clear: both">
<TMPL_VAR .loc.label_change_password>
</h3>
@@ -147,6 +149,7 @@ div.col {
<TMPL_VAR loc.button_change_password>
</button>
</form>
</div>
</body>
</html>

View File

@@ -23,7 +23,6 @@ table#user_stats_table input{
</style>
<h2><TMPL_VAR loc.title></h2>
<hr>
<TMPL_INCLUDE status.html>
<button class="text"
@@ -36,6 +35,7 @@ table#user_stats_table input{
<input type="hidden" name="studio_id" value="<TMPL_VAR studio_id>">
</form>
<div class="panel">
<table id="user_stats_table">
<thead>
<tr>
@@ -66,5 +66,6 @@ table#user_stats_table input{
</TMPL_LOOP>
</tbody>
</table>
</div>
</body>
</html>

View File

@@ -82,7 +82,6 @@
}
return false;
}
</script>
<h2><TMPL_VAR .loc.title></h2>
@@ -91,7 +90,7 @@
<TMPL_IF allow.create_user>
<div style="clear:both" class="newuser">
<button onclick="add_user('<TMPL_VAR name>')"><TMPL_VAR .loc.button_add_user></button>
<div id="edit_new" class="user editor" style="display:none">
<div id="edit_new" class="user editor panel" style="display:none">
<form method="post">
<table>
<tr> <td><TMPL_VAR .loc.label_name></td> <td><input name="user_name" value="<TMPL_VAR user_name>"></td> </tr>
@@ -110,6 +109,7 @@
</div>
</TMPL_IF>
<div class="panel">
<table class="table">
<TMPL_LOOP users>
@@ -216,6 +216,7 @@
</TMPL_LOOP>
</table>
</div>
</body>
</html>