aboutsummaryrefslogtreecommitdiffhomepage
path: root/tpl/default
diff options
context:
space:
mode:
authorArthurHoaro <arthur@hoa.ro>2016-08-07 15:57:47 +0200
committerArthurHoaro <arthur@hoa.ro>2016-08-07 15:57:47 +0200
commit1b383041f63a231afdfe180acd9b73375a8890ed (patch)
tree2ed9b23fc053c9bef30dac42f392e2c7f866c906 /tpl/default
parentff56413eb57818370093c482b617091e7b14814f (diff)
downloadShaarli-1b383041f63a231afdfe180acd9b73375a8890ed.tar.gz
Shaarli-1b383041f63a231afdfe180acd9b73375a8890ed.tar.zst
Shaarli-1b383041f63a231afdfe180acd9b73375a8890ed.zip
Configure page
Diffstat (limited to 'tpl/default')
-rw-r--r--tpl/default/addlink.html2
-rw-r--r--tpl/default/configure.html185
-rw-r--r--tpl/default/css/shaarli.css115
-rw-r--r--tpl/default/loginform.html2
-rw-r--r--tpl/default/tools.html14
5 files changed, 292 insertions, 26 deletions
diff --git a/tpl/default/addlink.html b/tpl/default/addlink.html
index 8e64064f..bc328daa 100644
--- a/tpl/default/addlink.html
+++ b/tpl/default/addlink.html
@@ -9,7 +9,7 @@
9 <div class="pure-u-lg-1-3 pure-u-1-8"></div> 9 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
10 <div id="addlink-form" class="page-form pure-u-lg-1-3 pure-u-3-4"> 10 <div id="addlink-form" class="page-form pure-u-lg-1-3 pure-u-3-4">
11 <h2>{"Shaare a new link"|t}</h2> 11 <h2>{"Shaare a new link"|t}</h2>
12 <form method="GET" action="" name="addform" class="addform"> 12 <form method="GET" action="" name="addform" class="addform page-form page-form-light">
13 <div> 13 <div>
14 <input type="text" name="post" placeholder="{'URL or leave empty to post a note'|t}"> 14 <input type="text" name="post" placeholder="{'URL or leave empty to post a note'|t}">
15 </div> 15 </div>
diff --git a/tpl/default/configure.html b/tpl/default/configure.html
new file mode 100644
index 00000000..0d1bd6ff
--- /dev/null
+++ b/tpl/default/configure.html
@@ -0,0 +1,185 @@
1<!DOCTYPE html>
2<html>
3<head>
4 {include="includes"}
5</head>
6<body>
7{include="page.header"}
8
9{$ratioLabel='5-12'}
10{$ratioLabelMobile='7-8'}
11{$ratioInput='7-12'}
12{$ratioInputMobile='1-8'}
13
14<form method="POST" action="#" name="configform" id="configform">
15 <div class="pure-g">
16 <div class="pure-u-lg-1-6 pure-u-1-8"></div>
17 <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-form-complete">
18 <h2>{'Configure'|t}</h2>
19 <div class="pure-g">
20 <div class="pure-u-lg-{$ratioLabel} pure-u-1">
21 <div class="form-label">
22 <label for="title">
23 <span class="label-name">Shaarli {'title'|t}</span>
24 </label>
25 </div>
26 </div>
27 <div class="pure-u-lg-7-12 pure-u-1">
28 <div class="form-input">
29 <input type="text" name="title" id="title" size="50" value="{$title}">
30 </div>
31 </div>
32 </div>
33 <div class="pure-g">
34 <div class="pure-u-lg-{$ratioLabel} pure-u-1">
35 <div class="form-label">
36 <label for="titleLink">
37 <span class="label-name">{'Title link'|t}</span><br>
38 <span class="label-desc">{'Default value'|t}: ?</span>
39 </label>
40 </div>
41 </div>
42 <div class="pure-u-lg-{$ratioInput} pure-u-1">
43 <div class="form-input">
44 <input type="text" name="titleLink" id="titleLink" size="50" value="{$titleLink}">
45 </div>
46 </div>
47 </div>
48 <div class="pure-g">
49 <div class="pure-u-lg-{$ratioLabel} pure-u-1 ">
50 <div class="form-label">
51 <label>
52 <span class="label-name">{'Timezone'|t}</span>
53 </label>
54 </div>
55 </div>
56 <div class="pure-u-lg-{$ratioInput} pure-u-1 ">
57 <div class="form-input">
58 {ignore}FIXME! too hackish, needs to be fixed upstream{/ignore}
59 <div class="timezone" id="timezone-remove">{$timezone_form}</div>
60 <div class="timezone" id="timezone-add"></div>
61 </div>
62 </div>
63 </div>
64 <div class="pure-g">
65 <div class="pure-u-lg-{$ratioLabel} pure-u-1 ">
66 <div class="form-label">
67 <label for="redirector">
68 <span class="label-name">{'Redirector'|t}</span><br>
69 <span class="label-desc">{'e. g.'|t} <i>http://anonym.to/?</i> {'will mask the HTTP_REFERER'|t}</span>
70 </label>
71 </div>
72 </div>
73 <div class="pure-u-lg-{$ratioInput} pure-u-1 ">
74 <div class="form-input">
75 <input type="text" name="redirector" id="redirector" size="50" value="{$redirector}">
76 </div>
77 </div>
78 </div>
79 <div class="pure-g">
80 <div class="pure-u-lg-{$ratioLabel} pure-u-{$ratioLabelMobile} ">
81 <div class="form-label">
82 <label for="disablesessionprotection">
83 <span class="label-name">{'Disable session cookie hijacking protection'|t}</span><br>
84 <span class="label-desc">
85 {'Check this if you get disconnected or if your IP address changes often'|t}
86 </span>
87 </label>
88 </div>
89 </div>
90 <div class="pure-u-lg-{$ratioInput} pure-u-{$ratioInputMobile} ">
91 <div class="form-input">
92 <input type="checkbox" name="disablesessionprotection" id="disablesessionprotection"
93 {if="$session_protection_disabled"}checked{/if}>
94 </div>
95 </div>
96 </div>
97 <div class="pure-g">
98 <div class="pure-u-lg-{$ratioLabel} pure-u-{$ratioLabelMobile} ">
99 <div class="form-label">
100 <label for="privateLinkByDefault">
101 <span class="label-name">{'Private links by default'|t}</span><br>
102 <span class="label-desc">{'All new links are private by default'|t}</span>
103 </label>
104 </div>
105 </div>
106 <div class="pure-u-lg-{$ratioInput} pure-u-{$ratioInputMobile} ">
107 <div class="form-input">
108 <input type="checkbox" name="privateLinkByDefault" id="privateLinkByDefault"
109 {if="$private_links_default"}checked{/if}/>
110 </div>
111 </div>
112 </div>
113 <div class="pure-g">
114 <div class="pure-u-lg-{$ratioLabel} pure-u-{$ratioLabelMobile} ">
115 <div class="form-label">
116 <label for="enableRssPermalinks">
117 <span class="label-name">{'RSS direct links'|t}</span><br>
118 <span class="label-desc">{'Check this to use direct URL instead of permalink in feeds'|t}</span>
119 </label>
120 </div>
121 </div>
122 <div class="pure-u-lg-{$ratioInput} pure-u-{$ratioInputMobile} ">
123 <div class="form-input">
124 <input type="checkbox" name="enableRssPermalinks" id="enableRssPermalinks"
125 {if="$enable_rss_permalinks"}checked{/if}/>
126 </div>
127 </div>
128 </div>
129 <div class="pure-g">
130 <div class="pure-u-lg-{$ratioLabel} pure-u-{$ratioLabelMobile}">
131 <div class="form-label">
132 <label for="hidePublicLinks">
133 <span class="label-name">{'Hide public links'|t}</span><br>
134 <span class="label-desc">{'Do not show any links if the user is not logged in'|t}</span>
135 </label>
136 </div>
137 </div>
138 <div class="pure-u-lg-{$ratioInput} pure-u-{$ratioInputMobile}">
139 <div class="form-input">
140 <input type="checkbox" name="hidePublicLinks" id="hidePublicLinks"
141 {if="$hide_public_links"}checked{/if}/>
142 </div>
143 </div>
144 </div>
145 <div class="pure-g">
146 <div class="pure-u-lg-{$ratioLabel} pure-u-{$ratioLabelMobile}">
147 <div class="form-label">
148 <label for="hidePublicLinks">
149 <span class="label-name">{'Check updates'|t}</span><br>
150 <span class="label-desc">{'Notify me when a new release is ready'|t}</span>
151 </label>
152 </div>
153 </div>
154 <div class="pure-u-lg-{$ratioInput} pure-u-{$ratioInputMobile}">
155 <div class="form-input">
156 <input type="checkbox" name="updateCheck" id="updateCheck"
157 {if="$enable_update_check"}checked{/if}/>
158 </div>
159 </div>
160 </div>
161 <div class="center">
162 <input type="submit" value="{'Save'|t}" name="save">
163 </div>
164 </div>
165 </div>
166 <input type="hidden" name="token" value="{$token}">
167</form>
168
169{include="page.footer"}
170
171<script>
172 (function (window, document) {
173 var toRemove = document.getElementById('timezone-remove');
174 var firstSelect = toRemove.getElementsByTagName('select')[0];
175 var secondSelect = toRemove.getElementsByTagName('select')[1];
176 toRemove.parentNode.removeChild(toRemove);
177 var toAdd = document.getElementById('timezone-add');
178 var newTimezone = '<span class="timezone-continent">Continent ' + firstSelect.outerHTML + '</span>';
179 newTimezone += ' <span class="timezone-country">Country ' + secondSelect.outerHTML + '</span>';
180 toAdd.innerHTML = newTimezone;
181 })(this, this.document);
182</script>
183</body>
184</html>
185
diff --git a/tpl/default/css/shaarli.css b/tpl/default/css/shaarli.css
index 2f2f142d..339ba300 100644
--- a/tpl/default/css/shaarli.css
+++ b/tpl/default/css/shaarli.css
@@ -15,6 +15,7 @@ body {
15 15
16.center { 16.center {
17 text-align: center; 17 text-align: center;
18 margin: auto;
18} 19}
19 20
20.label { 21.label {
@@ -597,7 +598,7 @@ pre {
597} 598}
598 599
599/** 600/**
600 * Login page 601 * PAGE FORM
601 */ 602 */
602.page-form { 603.page-form {
603 margin: 20px 0 0 0; 604 margin: 20px 0 0 0;
@@ -617,14 +618,6 @@ pre {
617 border-bottom: 1px solid #797979; 618 border-bottom: 1px solid #797979;
618} 619}
619 620
620.page-form div, .page-form p {
621 text-align: center;
622}
623
624.page-form p {
625 color: #b0ddce;
626}
627
628.page-form input[type="text"], .page-form input[type="password"] { 621.page-form input[type="text"], .page-form input[type="password"] {
629 margin: 10px 0; 622 margin: 10px 0;
630 padding: 5px 5px 3px 15px; 623 padding: 5px 5px 3px 15px;
@@ -643,12 +636,6 @@ pre {
643 color: #b0ddce; 636 color: #b0ddce;
644} 637}
645 638
646#login-form .remember-me {
647 margin: 5px 0;
648 color: #b0ddce;
649 font-weight: bold;
650}
651
652.page-form input[type="submit"] { 639.page-form input[type="submit"] {
653 margin: 10px 0; 640 margin: 10px 0;
654 height: 35px; 641 height: 35px;
@@ -662,11 +649,109 @@ pre {
662 color: #b0ddce; 649 color: #b0ddce;
663} 650}
664 651
652.page-form select {
653 color: black;
654}
655/**
656 * PAGE FORM - LIGHT
657 */
658.page-form-light div, .page-form-light p {
659 text-align: center;
660}
661
662.page-form-light p {
663 color: #b0ddce;
664}
665
666/**
667 * PAGE FORM - COMPLETE
668 */
669.page-form-complete {
670 #background: #ddd;
671}
672
673.page-form-complete div, .page-form-complete p {
674 color: #b0ddce;
675}
676
677.page-form-complete .form-label, .page-form-complete .form-input {
678 position: relative;
679 height: 60px;
680}
681
682.page-form-complete .form-label label,
683.page-form-complete .form-input input,
684.page-form-complete .timezone {
685 position: absolute;
686 top: 50%;
687 transform: translateY(-50%);
688}
689
690.page-form-complete .form-label label {
691 text-align: right;
692 right: 0;
693 padding: 0 20px;
694}
695
696.page-form-complete .label-name {
697 font-weight: bold;
698}
699
700.page-form-complete .label-desc {
701 font-size: 0.7em;
702}
703
704@media screen and (max-width: 64em) {
705 .page-form-complete .form-label {
706 height: inherit;
707 }
708
709 .page-form-complete .form-label label,
710 .page-form-complete .form-input input,
711 .page-form-complete .timezone {
712 position: inherit;
713 top: inherit;
714 transform: translateY(0);
715 }
716
717 .page-form-complete .form-input input[type="checkbox"] {
718 position: absolute;
719 top: 50%;
720 right: 50%;
721 transform: translateY(-50%);
722 }
723
724 .page-form-complete .form-input {
725 text-align: center;
726 }
727
728 .page-form-complete .form-label label {
729 display: block;
730 text-align: left;
731 margin: 10px 0 0 0;
732 }
733
734 .timezone-continent:after {
735 content:"\a\a";
736 white-space: pre;
737 }
738}
739
740
665#page404 { 741#page404 {
666 color: #3f3f3f; 742 color: #3f3f3f;
667} 743}
668 744
669/** 745/**
746 * LOGIN
747 */
748#login-form .remember-me {
749 margin: 5px 0;
750 color: #b0ddce;
751 font-weight: bold;
752}
753
754/**
670 * CONTENT - LINKLIST ITEMS 755 * CONTENT - LINKLIST ITEMS
671 */ 756 */
672.linklist-item { 757.linklist-item {
diff --git a/tpl/default/loginform.html b/tpl/default/loginform.html
index f28e6a47..21923606 100644
--- a/tpl/default/loginform.html
+++ b/tpl/default/loginform.html
@@ -18,7 +18,7 @@
18{else} 18{else}
19 <div class="pure-g"> 19 <div class="pure-g">
20 <div class="pure-u-lg-1-3 pure-u-1-8"></div> 20 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
21 <div id="login-form" class="page-form pure-u-lg-1-3 pure-u-3-4"> 21 <div id="login-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-3-4">
22 <form method="post" name="loginform"> 22 <form method="post" name="loginform">
23 <h2>{'Login'|t}</h2> 23 <h2>{'Login'|t}</h2>
24 <div> 24 <div>
diff --git a/tpl/default/tools.html b/tpl/default/tools.html
index a2132bd5..96e7fb10 100644
--- a/tpl/default/tools.html
+++ b/tpl/default/tools.html
@@ -8,8 +8,8 @@
8 8
9<div class="pure-g"> 9<div class="pure-g">
10 <div class="pure-u-lg-1-3 pure-u-1-8"></div> 10 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
11 <div class="pure-u-lg-1-3 pure-u-3-4 page-form"> 11 <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
12 <h2>Settings</h2> 12 <h2>{'Settings'|t}</h2>
13 <div class="tools-item"> 13 <div class="tools-item">
14 <a href="?do=configure" title="{'Change Shaarli settings: title, timezone, etc.'|t}"> 14 <a href="?do=configure" title="{'Change Shaarli settings: title, timezone, etc.'|t}">
15 <span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Configure your Shaarli'|t}</span> 15 <span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Configure your Shaarli'|t}</span>
@@ -52,13 +52,11 @@
52 {/loop} 52 {/loop}
53 53
54 <div class="clear"></div> 54 <div class="clear"></div>
55
56 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
57</div> 55</div>
58 56
59<div class="pure-g"> 57<div class="pure-g">
60 <div class="pure-u-lg-1-3 pure-u-1-8"></div> 58 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
61 <div class="pure-u-lg-1-3 pure-u-3-4 page-form"> 59 <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
62 <h2>Bookmarklets</h2> 60 <h2>Bookmarklets</h2>
63 <p> 61 <p>
64 {'Drag one of these button to your bookmarks toolbar or right-click it and "Bookmark This Link"'|t}, 62 {'Drag one of these button to your bookmarks toolbar or right-click it and "Bookmark This Link"'|t},
@@ -92,12 +90,11 @@
92 </a> 90 </a>
93 </div> 91 </div>
94 </div> 92 </div>
95 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
96</div> 93</div>
97 94
98<div class="pure-g"> 95<div class="pure-g">
99 <div class="pure-u-lg-1-3 pure-u-1-8"></div> 96 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
100 <div class="pure-u-lg-1-3 pure-u-3-4 page-form"> 97 <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
101 <h2>Firefox Social API</h2> 98 <h2>Firefox Social API</h2>
102 <p>{'You need to browse your Shaarli over <strong>HTTPS</strong> to use this functionality.'|t}</p> 99 <p>{'You need to browse your Shaarli over <strong>HTTPS</strong> to use this functionality.'|t}</p>
103 100
@@ -108,12 +105,11 @@
108 </a> 105 </a>
109 </div> 106 </div>
110 </div> 107 </div>
111 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
112</div> 108</div>
113 109
114<div class="pure-g"> 110<div class="pure-g">
115 <div class="pure-u-lg-1-3 pure-u-1-8"></div> 111 <div class="pure-u-lg-1-3 pure-u-1-8"></div>
116 <div class="pure-u-lg-1-3 pure-u-3-4 page-form"> 112 <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
117 <h2>{'3rd party'|t}</h2> 113 <h2>{'3rd party'|t}</h2>
118 <div class="tools-item"> 114 <div class="tools-item">
119 <a href="https://addons.mozilla.org/fr/firefox/addon/shaarli/" title="Firefox {'Plugin'|t}"> 115 <a href="https://addons.mozilla.org/fr/firefox/addon/shaarli/" title="Firefox {'Plugin'|t}">
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-02 09:07:34 +0000