tazpanel: 2a891cb47520 test.cgi

tazpanel view test.cgi @ rev 499

settings.cgi: disable live hardware clock on the page; base.css: fix statusbar height.

author	Aleksej Bobylev <al.bobylev@gmail.com>
date	Sat May 23 17:20:17 2015 +0300 (2015-05-23)
parents	299f204b8f1f
children	3117717c007d

line source

1 #!/bin/sh

2 #

3 # test.cgi - Test TazPanel styles.

4 #

6 #

8 # Common functions from libtazpanel

9 . lib/libtazpanel

10 get_config

11 header

13 TITLE='TazPanel - Test'

15 xhtml_header

17 cat <<EOT

19 <section>

20 <header><span data-img="info"></span>Buttons with font icons</header>

21 <!--

22 --><button data-icon="add" >Add </button><button data-icon="admin" >Admin </button><!--

23 --><button data-icon="back" >Back </button><button data-icon="battery" >Battery </button><!--

24 --><button data-icon="brightness" >Brightness </button><button data-icon="cancel" >Cancel </button><!--

25 --><button data-icon="cd" >CD </button><button data-icon="check" >Check </button><!--

26 --><button data-icon="clock" >Clock </button><button data-icon="conf" >Conf </button><!--

27 --><button data-icon="daemons" >Daemons </button><button data-icon="delete" >Delete </button><!--

28 --><button data-icon="detect" >Detect </button><button data-icon="diff" >Diff </button><!--

29 --><button data-icon="download" >Download </button><button data-icon="edit" >Edit </button><!--

30 --><button data-icon="eth" >Eth </button><button data-icon="group" >Group </button><!--

31 --><button data-icon="grub" >GRUB </button><button data-icon="hdd" >HDD </button><!--

32 --><button data-icon="help" >Help </button><button data-icon="history" >History </button><!--

33 --><button data-icon="info" >Info </button><button data-icon="install" >Install </button><!--

34 --><button data-icon="link" >Link </button><button data-icon="list" >List </button><!--

35 --><button data-icon="locale" >Locale </button><button data-icon="lock" >Lock </button><!--

36 --><button data-icon="logs" >Logs </button><button data-icon="loopback">Loopback</button><!--

37 --><button data-icon="man" >Man </button><button data-icon="modules" >Modules </button><!--

38 --><button data-icon="off" >Off </button><button data-icon="ok" >OK </button><!--

39 --><button data-icon="on" >On </button><button data-icon="opt" >Opt </button><!--

40 --><button data-icon="proc" >Proc </button><button data-icon="refresh" >Refresh </button><!--

41 --><button data-icon="removable" >Removable </button><button data-icon="remove" >Remove </button><!--

42 --><button data-icon="repack" >Repack </button><button data-icon="report" >Report </button><!--

43 --><button data-icon="restart" >Restart </button><button data-icon="run" >Run </button><!--

44 --><button data-icon="save" >Save </button><button data-icon="scan" >Scan </button><!--

45 --><button data-icon="settings" >Settings </button><button data-icon="slitaz" >SliTaz </button><!--

46 --><button data-icon="start" >Start </button><button data-icon="stop" >Stop </button><!--

47 --><button data-icon="sync" >Sync </button><button data-icon="tags" >Tags </button><!--

48 --><button data-icon="tag" >Tag </button><button data-icon="tazx" >TazX </button><!--

49 --><button data-icon="temperature">Temperature</button><button data-icon="terminal">Terminal</button><!--

50 --><button data-icon="text" >Text </button><button data-icon="unlink" >Unlink </button><!--

51 --><button data-icon="unlock" >Unlock </button><button data-icon="upgrade" >Upgrade </button><!--

52 --><button data-icon="user" >User </button><button data-icon="view" >View </button><!--

53 --><button data-icon="web" >Web </button><button data-icon="wifi" >Wi-Fi </button><!--

54 -->

55 </section>

58 <section>

59 <header><span data-img="link"></span>Links with font icons</header>

60 <div>

61 <p>

62 <a data-icon="add" >Add </a> <a data-icon="admin" >Admin </a> <a data-icon="back" >Back </a>

63 <a data-icon="battery" >Battery </a> <a data-icon="brightness">Brightness</a> <a data-icon="cancel" >Cancel </a>

64 <a data-icon="cd" >CD </a> <a data-icon="check" >Check </a> <a data-icon="clock" >Clock </a>

65 <a data-icon="conf" >Conf </a> <a data-icon="daemons" >Daemons </a> <a data-icon="delete" >Delete </a>

66 <a data-icon="detect" >Detect </a> <a data-icon="diff" >Diff </a> <a data-icon="download" >Download </a>

67 <a data-icon="edit" >Edit </a> <a data-icon="eth" >Eth </a> <a data-icon="group" >Group </a>

68 <a data-icon="grub" >GRUB </a> <a data-icon="hdd" >HDD </a> <a data-icon="help" >Help </a>

69 <a data-icon="history" >History </a> <a data-icon="info" >Info </a> <a data-icon="install" >Install </a>

70 <a data-icon="link" >Link </a> <a data-icon="list" >List </a> <a data-icon="locale" >Locale </a>

71 <a data-icon="lock" >Lock </a> <a data-icon="logs" >Logs </a> <a data-icon="loopback" >Loopback </a>

72 <a data-icon="man" >Man </a> <a data-icon="modules" >Modules </a> <a data-icon="off" >Off </a>

73 <a data-icon="ok" >OK </a> <a data-icon="on" >On </a> <a data-icon="opt" >Opt </a>

74 <a data-icon="proc" >Proc </a> <a data-icon="refresh" >Refresh </a> <a data-icon="removable">Removable</a>

75 <a data-icon="remove" >Remove </a> <a data-icon="repack" >Repack </a> <a data-icon="report" >Report </a>

76 <a data-icon="restart" >Restart </a> <a data-icon="run" >Run </a> <a data-icon="save" >Save </a>

77 <a data-icon="scan" >Scan </a> <a data-icon="settings" >Settings </a> <a data-icon="slitaz" >SliTaz </a>

78 <a data-icon="start" >Start </a> <a data-icon="stop" >Stop </a> <a data-icon="sync" >Sync </a>

79 <a data-icon="tags" >Tags </a> <a data-icon="tag" >Tag </a> <a data-icon="tazx" >TazX </a>

80 <a data-icon="temperature">Temperature</a> <a data-icon="terminal" >Terminal </a> <a data-icon="text" >Text </a>

81 <a data-icon="unlink" >Unlink </a> <a data-icon="unlock" >Unlock </a> <a data-icon="upgrade" >Upgrade </a>

82 <a data-icon="user" >User </a> <a data-icon="view" >View </a> <a data-icon="web" >Web </a>

83 <a data-icon="wifi" >Wi-Fi </a>

84 </p>

85 </div>

86 </section>

89 <section>

90 <header><span data-img="view"></span>Links with font icons only (small buttons)</header>

91 <p>

92 <a data-img="conf" href="#"></a>Conf <a data-img="help" href="#"></a>Help <a data-img="man" href="#"></a>Man

93 <a data-img="off" href="#"></a>Off <a data-img="on" href="#"></a>On <a data-img="opt" href="#"></a>Opt

94 <a data-img="remove" href="#"></a>Remove <a data-img="run" href="#"></a>Run <a data-img="stop" href="#"></a>Stop

95 <a data-img="web" href="#"></a>Web <a data-img="slitaz" href="#"></a>SliTaz <a data-img="user" href="#"></a>User

96 </p>

97 </section>

99 <section>

100 <header><span data-img="check"></span>User input elements</header>

101 <div><form>

102 <table>

103 <tr><td>Text:</td>

104 <td><input type="text" placeholder="Text"/></td>

105 </tr>

106 <tr><td>Password:</td>

107 <td><input type="password" placeholder="Password"/></td>

108 </tr>

109 <tr><td>Button:</td>

110 <td><input type="button" value="Button" data-icon="ok"/></td>

111 </tr>

112 <tr><td>Checkbox:</td>

113 <td><input type="checkbox" id="chk"/><label for="chk">Check it</label></td>

114 </tr>

115 <tr><td>Radio:</td>

116 <td>

117 <label><input type="radio" name="rad" id="radio1"/>Option 1</label>

118 <label><input type="radio" name="rad" id="radio2" checked/>Option 2</label>

119 <label><input type="radio" name="rad" id="radio3"/>Option 3</label>

120 </td>

121 </tr>

122 <tr><td>File:</td>

123 <td><input type="file" accept=".txt,.png"/></td>

124 </tr>

125 <tr><td>Image:</td>

126 <td><input type="image" src="/styles/default/images/msg-warn.png"/></td>

127 </tr>

128 <tr><td>Reset:</td><td><input type="reset"/></td></tr>

129 <tr><td>Submit:</td><td><input type="submit"/></td></tr>

130 <tr><td>Select:</td>

131 <td><select><option data-icon="user">Option 1<option>Option 2<option>Option 3</select></td>

132 </tr>

133 <tr><td colspan="2"><b>HTML 5 inputs:</b></td></tr>

134 <tr><td>Search:</td><td><input type="search" results="5" autosave="pkgsearch" autocomplete="on"/></td></tr>

135 <tr><td>Number:</td><td><input type="number" name="n" value="3" min="0" max="10"/></td></tr>

136 <tr><td>Range:</td><td><input type="range" name="r" value="3" min="0" max="10"/></td></tr>

137 <tr><td>Color:</td><td><input type="color" name="c"/></td></tr>

138 <tr><td>Tel:</td><td><input type="tel" name="t"/></td></tr>

139 <tr><td>URL:</td><td><input type="url" name="u"/></td></tr>

140 <tr><td>E-mail:</td><td><input type="email" name="e" data-x="A part number is a digit followed by three uppercase letters." required/></td></tr>

141 <tr><td>Date:</td><td><input type="date" name="d" value="$(date +'%F')"/></td></tr>

142 <tr><td>Month:</td><td><input type="month" name="m" value="$(date +'%Y-%m')"/></td></tr>

143 <tr><td>Week:</td><td><input type="week" name="w" value="$(date +'%Y-W%V')"/></td></tr>

144 <tr><td>Time:</td><td><input type="time" name="ti" value="$(date +'%R')"/></td></tr>

145 <tr><td>Date & Time:</td><td><input type="datetime" name="dt" value="$(date +'%FT%RZ')"/></td></tr>

146 <tr><td>Date & Time Local:</td><td><input type="datetime-local" name="dtl" value="$(date +'%FT%R')"/></td></tr>

147 </table>

148 </form></div>

149 </section>

150

151 EOT

152 xhtml_footer

153 exit 0

SliTaz Repositories

tazpanel view test.cgi @ rev 499