[Kimchi-devel] [PATCH] Applying new ui to Admin New Custom Backup

From: Andre Teodoro <andreteodoro.work(a)gmail.com&gt; Signed-off-by: Andre Teodoro <andreteodoro.work(a)gmail.com&gt; --- ui/css/src/modules/_administration.scss | 30 ++++++++++++---- ui/js/host-admin.js | Bin 35177 -> 34874 bytes ui/pages/host-admin.html.tmpl | 62 ++++++++++++++++++++------------ 3 files changed, 63 insertions(+), 29 deletions(-) diff --git a/ui/css/src/modules/_administration.scss b/ui/css/src/modules/_administration.scss index 2a79dce..84479f1 100644 --- a/ui/css/src/modules/_administration.scss +++ b/ui/css/src/modules/_administration.scss @@ -17,13 +17,12 @@ // See the License for the specific language governing permissions and // limitations under the License. // - #administration-root-container { - .fa { - margin-left: 20px; - font-size: 20px; - color: #5a595b; - } + // .fa { + // margin-left: 20px; + // font-size: 20px; + // color: #5a595b; + // } h3 { height: 32px; padding: 10px 15px; @@ -369,4 +368,23 @@ width: 10%; height: auto; } +} + +#newBakDialog { + .del-label { + color: #9e9e9e; + font-size: 14px; + } + .fa { + padding: 1px 3px; + font-size: 18px; + margin-left: 0; + } + .fa-plus-circle { + margin-bottom: 5px; + } + .path-item { + display: flex; + margin-bottom: 10px; + } } \ No newline at end of file diff --git a/ui/js/host-admin.js b/ui/js/host-admin.js index f34fafd05a11a2f0e7e22f2b9c50f1c980bb8d79..d43bd3c9326be081be832fb3c41d0a0e4a43b460 100644 GIT binary patch delta 1259 zcmZ`(O>Em_7-p5bIL@Errb*g$tK+0~yvz-q1RZOVZVU$MAV615{7u4%zffzAoyJZ# zeySeeunTJG!v!t~G$Fx-qV9m;01_8Y{M@)8CO9D>F(jlODt<mYiP~+dCF}j($M5(0 z{hsH2zuz|pzStPpxOM2h&u(2Bh{{=uTzy!(@`$0C_REMaPva_6z<)D?h#n8(CNmc@ z8e-mXE@`Hr<AZh@y9|$amf|RPhVlO8v7Vnpm2miYB!-2-BE&!n7v~jhoMynXXR*!> zqsA)Kp2Ou=NAS{N20LsPx35RB^*n<K?g-Z32;*sv!M~?Mc#q}qdQd^^0*m8?WB5L} z(2I%SlM#;1<)tZ2*CjkNpAv{7zQ&3B9)jhGBlu^9#rU)A+9GjWB9_J6R7-0+<nhHP zpUBH4-B=Oprsg<hsinC~s^OBRRFTEP9htnOa>=k-9anT;X_2zzl54Ki-`TL+O|@=Y zZre6RKS~mdcO_Zt7ABXRmS*)g)@`%Xv{ap#gw|GbE$>xL!@45&Fltm&s}b|SqWZZS zn%L0PreSp)wQjWQCXp(oqET5OO?!ou7K`4G?<%TaQ<2h8k(Jpy4($o<E*Xx;7qQ$& zP12-B%#_8BrIUtX5gp5e2~XSy?~R-CS*>bK%6Yjg%2X!RXV|q>!>XGdoyd4QIEouw zGVFb*+B)$x!e1v7esgRIEG~p2Lt3jvEIofu%<bzjJVhe-^>8xji>vHAz$#sH_>&pK z`H5uw;LiAbcr2$Ar`|SNu3=lJMcPu?eSqo-U9+!YCvp;M^eC#)G$P3us%Zi1(IS4B z597P2g5Bs0e$Mee{$gwo|2Edezj|{JTYLaneir?;#Xr<rpTXb!15o1`G{XTr7oVgy zgB$S?YFW$)L4VYK^L-w?knQ0oU<+rtT)scQIF-7Hucrg}G<6i>{UKC`MmL23z6>ci z!!erzkJa!*ce$6h+(~qyaa0oNP0IV6kVYXggtrnb-c8KXp^Pv-qc3ph@F7>gkDP=Z zZU&Eq<Jjg#sedfzbMCd&UOnCWL{_G3D=#k@I>DMgnWVj`wa?R`$@diNs`X1s!OhT# w)Ik#b5t>FOEYW{T_$ln2B!d|t-n)f(iWR9Z(!yhhR=0N(<MHi}Ccmlu4_xMowEzGB delta 1501 zcma)6O>7fa5LUvjcfI~w|KK=I>}-~#cq{BWSfYue#A$+%Aguyb6_6;1wRaP*u)WrL z-Go#rR4Ru`98$hh4@kZj1Qn`~ddjJ%MisrcO}U^-ROM2&J(ai5PVAB#x|f+ZGdu5_ zneWZFTm8S??cdt{`q$<DoAR-mzBaF3KW(TLb5&L{8dXvs3sUD(o3^=B*K2ucMXfaS z6Z?*;si~E`WLwQ1<C>w_<-9bR&2|IJy0Kce^U|qaqh_hAtLkF0q8~_X=?!B;J<L<8 zm<{~{eVrteFUj2-Oa~wO*f?(4%-N=qZdZ}E4ZETjRVz(@lut-wsRISqRZFkgDMiUx zde!_$f5*11luZA`qoWaQ9664cS9$!L67cXy0V7xV$#&1qm{xV(u92n{o3?G%QbuE0 ztr(hAkYv5)6d+3ksAe>%u1pJP%?#l_lY=<Mgb0?5s%ZpOUA4<+ZM}-!!T^>OH(N4m z4N}k80Jc5MaNRPhs&#{;B9$4$m#$Zu4ZCcVuFLqe5XH`D2(1Yge;2~YpCd4@iAc<e z<Q5)cj={_20lWxGc=xs!Ef??KD><XC*t&&#7bS2)v`@ho>k<4h5r8Oic*aEVtZ?)o zp2R^sRipO*0A<~f*weUmk;B|150lOH=mMUw8K+`ASRTBa=h5#vMvpBeL}iQ{LTjDf zhuBUbV9lkFG%oz9jNv=i`>(}{crfFKnHZuyxUccJ6FiPwNXAaE0O!0O_8}39JGLQ* z^_yL074;R<(ia@wwF#E+b9f$5cxQT=-Y8)-JVBG(3Hoq59K>#v!6S_!Nt0Ah_($<1 zEaKWCgZIQ!Nccs#BP00f42ScgA3un4vG+nsrAA)5+<k%$CPO3h|1a;lD4hVi{VbLi zd)|d(FI5On9PCNTg)fC++MjO(k=-jGg5QNCwx?KlJ#BBw6T?P!0CPDWFX94J&s)_0 z?@SzDdEzv~FA|6EJz312i|xlHy@$tr?rq0yk>T!m7x2k6Pb80F-_*XY5<Pj6!#&?g zDu47Pk@=8=<Y(}g?+rrAam@M$iS!~HapS5O#0`3mkcI}}_D4FtSVw0tH_xLlFhxlw zGF<faH7C=>fTwJPhHOVunET9wrSTXNE;ni$9>gz%Fe~%a??8DTNO$yPXRdAEdGYOz z-PfKkyJvT1{3dPLKjL(Uz#=5g?cTgXx9O(x_)=sf818JR1@e~6Dp|^8x!?jfi0zwM V`H;=kS=F+${bXhOu`&L%_zJe6&u;(# diff --git a/ui/pages/host-admin.html.tmpl b/ui/pages/host-admin.html.tmpl index 7f4ceda..7e197bf 100644 --- a/ui/pages/host-admin.html.tmpl +++ b/ui/pages/host-admin.html.tmpl @@ -87,7 +87,7 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA <a href="#" id="newDefaultBakBtn"><i class="fa fa-file"></i>$_("Generate Default Backup")</a> </li> <li role="presentation"> - <a href="#" id="newCustomBakBtn"><i class="fa fa-file"></i>$_("New Custom Backup")</a> + <a href="#" id="newCustomBakBtn" data-toggle="modal" data-target="#newBakDialog"><i class="fa fa-file"></i>$_("New Custom Backup")</a> </li> <li role="presentation"> <a href="#" id="batDelBtn" data-toggle="modal" data-target="#batDelDialog"><i class="fa fa-minus-circle"></i>$_("Batch Delete")</a> @@ -262,21 +262,43 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA </div> <!-- Configuration Backup Modal - Create Custom Backup --> -<div id="newBakDialog" title='$_("Create a backup")' class="ginger-dialog"> - <div>$_("Description")</div> - <div class="crt-bak-section"><input type="text" class="desc"></div> - <div class="crt-bak-section"> - <div class="path-pick"> - <div>$_("Path Included")</div> - <div class="box" id="includeBox"></div> - </div> - <div class="path-pick"> - <div>$_("Path Excluded")</div> - <div class="box" id="excludeBox"></div> +<div class="modal fade host-modal" id="newBakDialog" tabindex="-1" role="dialog" labelledby="newBakLabel" aria-hidden="true"> + <div class="modal-dialog" role="document"> + <div class="modal-content" > + <div class="modal-header"> + <h4 class="modal-title">$_("Create a backup")</h4> + </div> + <div class="modal-body"> + <form id="form-backup-add"> + <div class="form-group"> + <label for="description-textbox">$_("Description")</label> + <input type="text" class="form-control input" id="description-textbox" name="description" /> + </div> + </form> + <div class="row"> + <div class="col-md-12"> + <div class="col-md-6" > + <label class="col-md-12">$_("Paths Included")</label> + <span class='add-path-to-include'><a class="add btn btn-link" href="#"><i class="fa fa-plus-circle"></i> $_("Add a Path")</a></span> + <div id="includeBox"></div> + </div> + <div class="col-md-6"> + <label class="col-md-12">$_("Paths Excluded")</label> + <span class='add-path-to-exclude'><a class="add btn btn-link" href="#"><i class="fa fa-plus-circle"></i> $_("Add a Path")</a></span> + <div id="excludeBox"></div> + </div> + </div> + </div> + </div> + <div class="modal-footer"> + <button type="button" id="newBakFormBtn" class="btn btn-default" data-dismiss="modal" disabled>$_("Generate Backup")</button> + <button type="button" id="newBakFormCancelBtn" class="btn btn-default" data-dismiss="modal">$_("Cancel")</button> + </div> </div> </div> </div> + <!-- Configuration Backup Modal - Batch Delete --> <div class="modal fade host-modal" id="batDelDialog" tabindex="-1" role="dialog" labelledby="batDelLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> @@ -314,15 +336,6 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA </div> </div> -<!-- <div id="batDelDialog" class="window modal-content"> - <div class="del-option"> - <input type="radio" name="batDelType" value="counts_ago" checked>$_("Preserve the latest") <input type="text" class=""> $_("backups") - </div> - <div class="del-option"> - <input type="radio" name="batDelType" value="days_ago">$_("Preserve the latest") <input type="text" class="" disabled> $_("days of backups") - </div> -</div> --> - <!-- SEP Configuration Modal - Add Subscription --> <div class="modal fade host-modal" id="subscriptionAdd" tabindex="-1" role="dialog" labelledby="hostsModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> @@ -416,7 +429,7 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA <span class="column-file">{file}</span><!-- --><span class="column-timestamp">{timestamp}</span><!-- --><span class="column-download btn btn-link btn-download"><i class="fa fa-download"></i>$_("Download")</span><!-- - --><span class="column-delete btn btn-link btn-delete"><i class="fa fa-minus-circle"></i>$_("Remove")</span> + --><span class="column-delete btn btn-link btn-delete "><i class="fa fa-minus-circle"></i>$_("Remove")</span> </li> </script> <script id="backupTooltip" type="text/html"> @@ -428,7 +441,10 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA </div> </script> <script id="pathItem" type="text/html"> - <div class="path-item"><input type="text"><button class="add"></button><button class="delete"></button></div> + <div class="path-item"> + <input type="text" class="form-control input" /> + <span class="column-delete btn btn-link delete del-label"><i class="fa fa-minus-circle"></i>$_("Remove")</span> + </div> </script> <script id="nicItem" type="text/html"> <form class="form-inline"> -- 1.9.3