{% extends "layout.html" %}
{% block body %}

<p> <b> Would you like fries with that? </b></p>

<br>
<big> Popularity Contest </big>
<br><br>
<p>The Popularity Contest (popcon) is a programme where anonymous data is sent back to Debian, tracking the number of packages installed. More information can be obtained at https://popcon.debian.org.</p> <br>

<input style="background-color: #777777;" type="checkbox" id="popcon"
     name="popcon" hx-post="/software/settings"  hx-trigger="change"
{% if popcon %} checked {% endif %}>
<label for="popcon"> Participate in PopCon </label><br>

<br>
<big><h3> Desktop Environment </h3></big>
<br>
<p>Would you like to install a graphical environment for this system?</p>

<br>

<form>
<div class="control is-link">
  <div class="select">
    <select hx-post="/software/select-desktop" hx-target="body" name="software-desktop" style="width: 220px">
      <option value="" {% if desktop == "None" %} selected=selected {% endif %}> None</option>
      <option value="task-gnome-desktop" {% if desktop == "task-gnome-desktop" %} selected=selected {% endif %} >GNOME</option>
      <option value="task-kde-desktop" {% if desktop == "task-kde-desktop" %} selected=selected {% endif %}>KDE Plasma</option>
      <option value="task-xfce-desktop" {% if desktop == "task-xfce-desktop" %} selected=selected {% endif %}>Xfce</option>
      <option value="task-lxde-desktop" {% if desktop == "task-lxde-desktop" %} selected=selected {% endif %}>LXDE</option>
      <option value="task-lxqt-desktop" {% if desktop == "task-lxqt-desktop" %} selected=selected {% endif %}>LXQt</option>
      <option value="task-mate-desktop" {% if desktop == "task-mate-desktop" %} selected=selected {% endif %}>MATE</option>
      <option value="lomiri" {% if desktop == "lomiri" %} selected=selected {% endif %}>Lomiri</option>
      <option value="task-cinnamon-desktop" {% if desktop == "task-cinnamon-desktop" %} selected=selected {% endif %}>Cinnamon</option>
    </select>
  </div>
</div>
</form>





<!--

<div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px;">
<p> <span style="width: 100%; border-radius: 8px 8px 0 0;" class="tag is-black">
Desktop Environment</span>
<div style="padding: 15px; padding-top: 10px; padding-bottom: 5px; background-color: #fff; color: #000;">
<p>
<img src="/static/icons/console.png" width="48px" alt="" style="padding-right: 10px;" />
<img src="/static/icons/gnome.jpeg" width="48px" alt="" style="padding-right: 10px;" />
<img src="/static/icons/kde.jpeg" width="48px" alt="" style="padding-right: 10px;" />
<img src="/static/icons/xfce.jpeg" width="48px" alt="" style="padding-right: 10px;" />
<img src="/static/icons/mate.jpeg" width="48px" alt="" style="padding-right: 10px;" />
<img src="/static/icons/lxde.jpeg" width="48px" alt="" style="padding-right: 10px;" />
<p>
</div>
</div>

<br />

<div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px; margin-bottom: 20px;">
<p> <span style="width: 100%; border-radius: 8px 8px 0 0;" class="tag is-black">
Select software from Debian archives</span>
<div style="padding-left: 15px; padding-right: 15px; padding-bottom: 5px; background-color: #fff; color: #000;">
<p><b>Select packages or selections of packages from the Debian archives.</b></p>
<button class="button is-dark">Games</button>
<button class="button is-dark">Productivity</button>
<button class="button is-dark">Creativity</button>
<button class="button is-dark">Server</button>
<button class="button is-dark">Development</button>
</div>
</div>
</div>
</div>
-->

{% endblock %}