99 Commits

Author SHA1 Message Date
Alice Kile
0b5b384651
app: Separate app enable/disable form from config form
- Introduce new API to mark an app that it can't be disabled.

- Mark jsxc, storage, config, upgrade and firewall apps as can't be disabled.

- Fixed functional tests

- Replaced AppForm with forms.Form in all modules' forms.py.

- Remove app.template.js.

- Remove unused styles.

- Remove app status checks in form_valid of Deluge, Diaspora, Matrix, Ejabberd,
MediaWiki, Storage, Transmission, Quassel

- Purge unused is_enabled context variables (Ikiwiki)

- ejabberd: Minor cleanup in template

- jsxc: Cleanup unneeded overrides

- tahoe: Cleanup unnecessary overrides

Tests performed:

- For all apps affected, test enable/disable button works and submitting
configuration form works: with changes updates message and without changes
'settings unchanged' message.
  - avahi
  - bind
  - cockpit
  - SKIP: coquelicot
  - datetime
  - deluge
  - SKIP: diaspora
  - ejabberd
  - gitweb
  - i2p
  - infinoted
  - ikiwiki
  - matrixsynapse
  - mediawiki
  - minetest
  - minidlna
  - mldonkey
  - mumble
  - pagekite
  - privoxy
  - quassel
  - radicale
  - roundcube
  - SKIP: samba
  - searx
  - SKIP: shaarli
  - shadowsocks
  - ssh
  - tahoe
  - transmission
  - FAIL: tt-rss (not installable)
  - wireguard
- Deluge test that configuration changes when app is disabled work
- Quassel test that setting the domain works when app is diabled
- Transmission test that setting the domain works when app is diabled
- Ikiwiki create form works properly
- Enable/disable button appears as expected when enabled and when disabled
- Enable/disable button works without Javascript
- Functional tests work for affected apps, Tor and OpenVPN
- AppForm is removed from developer documentation
  - Forms reference
  - Customizing tutorial
- Test all apps using directory select form
  - Transmission
  - Deluge
- Visit each template that overrides block configuration and ensure that it is
loaded properly and the display is as expected.
- All apps that use AppView that are not tested above should not have an
enable/disable button. That is JSXC, update, config, firewall, storage, users.

Signed-off-by: Alice Kile <buoyantair@protonmail.com>
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
2020-03-29 09:42:31 +03:00
Sunil Mohan Adapa
673bd367b0
css: cosmetic: Rename plinth.css to main.css
Tests performed:

- Visit an app page, install page and home page.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
2020-03-06 13:09:02 +02:00
Sunil Mohan Adapa
b51ccff743
css: Merge responsive.css into main style file
- Eliminate issue with collapsed navbar's drop-down menu text color when the
width is exactly 768px or less than 320px.

- Remove redundant footer's position: relative rule.

Tests performed:

- Change the browser width to 768px, the navbar is not collapsed and drop down
menu text color is black on white background.

- Change the browser width to 767px, the navbar is collapsed and drop down menu
text color is white on blue background.

- Change the browser width to less than 320px, the navbar is collapsed and drop
down menu text color is white on blue background.

- Footer on the main page and remaining pages is unchanged at <320px, =767px and
>= 768px.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
2020-03-06 13:08:53 +02:00
Sunil Mohan Adapa
b5e19726fe
app: Show short description as secondary title
Closes: #1721

Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2020-02-23 08:31:33 -05:00
Sunil Mohan Adapa
55bee19963
app: cosmetic: Rename a CSS style class in app header
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2020-02-23 08:31:26 -05:00
Sunil Mohan Adapa
d99fd41fff
app: Simplify some header styling
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2020-02-23 08:31:23 -05:00
Sunil Mohan Adapa
62cf6a11e0
app: cosmetic: Minor refactoring of header styling
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2020-02-23 08:31:19 -05:00
Sunil Mohan Adapa
ddc90ff511
app: Drop border shadow for app icon in mobile view
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2020-02-23 08:31:10 -05:00
Sunil Mohan Adapa
58640f6dfb
app: Update style for toggle button
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2020-02-23 08:31:05 -05:00
Sunil Mohan Adapa
b14ccdadba
css: Add missing license identifier on some CSS files
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
2020-02-19 14:41:13 +02:00
Sunil Mohan Adapa
e398f58ca9
system: Implement new style for cards
Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2020-02-14 23:02:55 +05:30
Sunil Mohan Adapa
ca624e718a
cards: Remove the transition delay on hover effect
The cards react very fast to mouse movements give the feeling of more
responsiveness in the UI instead of feeling sluggish.

Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2020-02-14 23:02:25 +05:30
Veiko Aasa
87983461e0
apps: remove css filters and glow from app icons
Closes #1722

Signed-off-by: Veiko Aasa <veiko17@disroot.org>
Reviewed-by: Sunil Mohan Adapa <sunil@medhas.org>
2020-02-13 14:42:53 -08:00
Sunil Mohan Adapa
8529022f63
notification: Show a drop down from main navbar for notifications
Closes: #1042.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2020-02-10 18:13:28 -05:00
Veiko Aasa
c18be280f6
help: Fix anchor hidden under navbar
The solution idea is from
https://github.com/twbs/bootstrap/issues/1768#issuecomment-46519033

Signed-off-by: Veiko Aasa <veiko17@disroot.org>
Reviewed-by: Sunil Mohan Adapa <sunil@medhas.org>
2020-02-09 15:14:57 -08:00
Sunil Mohan Adapa
f7109cceef
style: Fix responsiveness for app header
- 767 is the maximum for that size used by bootstrap. 768 and up are treated as
  different size.

- magin-bottom is redundant

- Don't do text-align: center for description text. It does not match with form
  elements and heading that follow. It also makes reading longer text harder.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2020-01-17 03:47:37 +05:30
Sunil Mohan Adapa
bf9d822943
style: Fix incorrect margins for containers in mobile view
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2020-01-17 03:47:18 +05:30
James Valleroy
dac6259928
themes: css whitespace minor fixes
Signed-off-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-07 13:33:49 -05:00
Alice Kile
9cd203411d
fix toggle buttle html layout and responsive design css
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-07 13:08:46 -05:00
Alice Kile
0dd4d1acf2
implement responsive layout for app page
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-07 13:08:44 -05:00
Alice Kile
45b6aa6a1c
fix formatting and template-related issues
- remove unwanted spaces and line breaks
- use just an image instead of using figure and figure caption to
  display the icon in installation page
- eliminate unnecessary code duplication due to if condition

Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-07 13:08:39 -05:00
Alice Kile
f004939f50
show app icons in apps page
- restructure the template markup so as to show the icon towards the
  left of the app heading and description.
- if condition to provide backwards compatiblity to system apps using
  setup.html.
- deluge and matrixsynapse modules have a new property that will be used
  for accessing the icon file name. (to be replicated across all other
  modules *weew*)

Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-07 13:08:25 -05:00
Sunil Mohan Adapa
e008decb14
toolbar: Align extra actions drop down button to the right
- This appears better in cases where there are no other buttons in the toolbar.
  This is true for many apps.

- Also minimize the styling used on toolbar.

- Use margin instead of padding due participate in margin collapse algorithm.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-01 16:52:38 -05:00
Sunil Mohan Adapa
656d754aee
toolbar: Make diagnostics button looks like other drop down items
- Use the same background color as drop down items.

- Left align.

- Use same padding.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-01 16:52:36 -05:00
Alice Kile
6a4a941bb6
toolbar: Move diagnostics button into dropdown menu
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-01 16:40:31 -05:00
Alice Kile
52f6da2a41
templates: Add toolbar for apps in app.html
Changes to the app.html layout, mainly:

- A new panel is created to hold action buttons. Closes #1698.

- Launch button is now shown in the panel alongside "Client Apps".

- Run Diagnostics button is moved into this panel as well. Closes #1690.

- Disable 'Launch web client' button when app is disabled. Closes #1718.

Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-12-01 16:40:13 -05:00
Alice Kile
fec995d7e0
app: Make the toggle-button responsive
Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2019-11-19 00:02:16 +05:30
Alice Kile
1a65c88881
app: Use single form for app toggle and configuration
Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2019-11-19 00:02:16 +05:30
Alice Kile
ec62f331b8
app: Implement toggle button in app page
- revamp the old form submission model to enable/disable apps into a
  simple toggle button
- provide backwards compatibility when javascript is disabled

Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2019-11-19 00:02:16 +05:30
Sunil Mohan Adapa
393f4bbc26
names: Perform better layout of domain names table on small screens
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@riseup.net>
2019-08-21 10:17:59 +05:30
Joseph Nuthalapati
faac8cdd9c
backups: Make backup location tables collapsible
Signed-off-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
[sunil@medhas.org Fix incorrectly removed <tr> tag in <thead>]
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-07-29 14:09:28 -07:00
Sunil Mohan Adapa
661a00198e
backups: Minor styling changes
- Add docstrings.

- Add blank lines for extra readability.

- Use <span> instead of <i> tag for icon in template.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-07-03 12:43:49 +05:30
Joseph Nuthalapati
9f71c5867e
ui: Create reusable CSS class for collapsible-button
.collapsible-button is used by both "Client Apps" and the "How to verify?"
button in backups:verify-ssh-hostkey page.

Signed-off-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-07-03 12:42:48 +05:30
Sunil Mohan Adapa
b96d901071
Introduce component architecture and menu component
- Introduce base class for all apps that will contain components. With
  unittests.

- Introduce base classes for components. With unittests.

- Turn Menu class into an app component.

  - Further cleanup Menu class.

  - Update tests.

  - Maintain a global list of menu items and look them up easily. Generalize
    such that subsubmenus can later be merged into Menu class.

  - Cleanup scope of main menu initialization.

  - Use None instead of empty strings for various values. Ensure that
    printing short_description does not show 'None' in output.

  - Use enable/disable instead of promote/demote.

- Use menu component in all apps.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-06-07 11:48:04 -07:00
Sunil Mohan Adapa
b6325073c5
templates: Use SVG icons for apps page and shortcuts
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
2019-05-16 06:41:49 -04:00
Sunil Mohan Adapa
dba0e40020
apps: Style the title for disabled icons section
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-05-07 16:58:11 -07:00
Sunil Mohan Adapa
4aae99d695
apps: Style disable app icons according to design
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-05-07 16:58:08 -07:00
Sunil Mohan Adapa
dd58b4fd39
apps: Fix showing apps background twice
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-05-07 16:58:05 -07:00
Sunil Mohan Adapa
72c1c7349f
js: Remove javascript license link from footer
The link is hidden but not removed. librejs will still parse it. Ideally we
would want to do this from <link data-jslicense='1' href=''> but that seems to
cause problems for librejs.

Librejs users can still find out about the license of Javscript script file
using Librejs menu.

We already have a link to FreedomBox source code in the home page.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-29 22:19:34 +05:30
Sunil Mohan Adapa
fa06f75ba1
ui: Fix regression with card icon style in front page
- Don't show tinted icons in any page except apps page.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-01-28 17:50:58 -08:00
Sunil Mohan Adapa
3bcf21958a
ui: Re-add background for home, apps and system pages in small sizes
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-18 11:48:34 +05:30
Sunil Mohan Adapa
35a02d00b4
ui: Compact pages on extra small screen sizes
- Don't take up the too much margins with content container.

- Fallback to white background to avoid container boxes.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-18 11:48:06 +05:30
Sunil Mohan Adapa
dca149821b
ui: Fix setting width of card-list at various page sizes
Reuse bootstrap .container class to perform the width calculations instead of
explicitly setting it. This makes the size of card list match the rest of the
content like navigation and text content.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-18 11:47:36 +05:30
Sunil Mohan Adapa
ba66f37528
ui: Style frontpage application info like regular content
- Remove custom styling and use the normal content-container styling.

- Remove margins on card-list to make it align better with content containers.
  This can be seen when view application information in home page and in help
  page.

- Add bottom margin to content container.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-18 11:47:17 +05:30
Sunil Mohan Adapa
bacb0c056a
ui: Underline the logo along with 'Home' text when active
- This works properly in mobile sizes by underlining only the logo.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-18 11:47:03 +05:30
Sunil Mohan Adapa
eb19c9a319
ui: Rename page specific CSS classes
Fixes #1349.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-18 11:46:34 +05:30
Sunil Mohan Adapa
7279db3f2c
ui: Fix top margin for content containers
Currently, when a message is shown at the top or in users and groups page, The
top margin is too short. Increase it to 25px from 5px. Also:

- Don't use the .thumbnail class for containers as this does not match the
  semantics. Create and use class .contain-container.

- Also create class .card-container for all container containing cards. Unused
  for now.

- Indentation fixes.

- Remove duplicated rule.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
2019-01-18 11:46:23 +05:30
Sunil Mohan Adapa
d89011cc01
Fix i18n for menu strings
- There should not be a space in front of the text. This is a styling issue.

- Remove the CSS rule causing issues with spacing.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-01-14 17:38:04 -08:00
Sunil Mohan Adapa
de5ba012e1
icons: Fixes for switching to fork-awesome
- Update documentation pointing to Bootstrap Glyphicons.

- Consistently use trash-o. It is also more clear at the sizes we are using.

- Use hourglass-o instead of hourglass.

- Use diaspora icon instead of generic icon for diaspora app.

- In cards, don't set 3x size. It is not used. Instead we are setting our custom
  size.

- Remove unused CSS rule for .sidebar .fa

- Align the FreedomBox logo to center with 'Home' text.

- Fix swapped icons for 'Client Apps' button.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-01-14 17:38:01 -08:00
Prachi Srivastava
5d68f6bf52
Replace glyphicons with forkawesome icons
Reviewed-by: Sunil Mohan Adapa <sunil@medhas.org>
2019-01-14 17:37:58 -08:00