Strip Sidebar-element "What can I do here?"

[kvdmolen]

The sidebar element "What can I do here?" needs to be stripped to only the actionable links, with added class .btn and a descriptive class of the function, e.g. .newinitiative. This means no more text, only buttons

Available buttons per page

Page: Index

• none! remove all

  Page: Index, filtered by Area:

• Subscribe -> Participate
• Choose subject area delegatee -> Delegate for this area
• New Issue

  Page: Issue view

• Add Support or Remove my support

..to be completed..

[nktc]

I am ready to do this but some more exact markup would be appreciated.

[kvdmolen]

Ok, understand, difficult one, let's keep it simple.

Most important is to add descriptive classes to the elements. Below is an example, but please note that the contents of this sidebar change according to for example the status of the initiative/issue/page..! So it's always different. Hope you can follow the example and apply this to other parts that the example does not cover.

Rules:

• If there is pure text in a <li> element, remove the entire <li> element (see below)
• There should be only links like <li><a>..</a></li> in the <ul class="ul"> elements (some have these additional <script>.. and <form>. tags inside, which should remain to maintain functionality).
• Every .sidebarRow element should get a unique, descriptive class, even non-descriptive is ok .a1234 as long as it is unique.
• The "interest" and "support" buttons should be exactly the same as in #24, including the class .btn-support and optionally .supporter / .interested if you are supporting/interested.
• Remove all <br ..> elements you can find!

Specific: At the index page, there's the Unit-section.

• Please also replace the <img class="icon16 star" ..> tag with an additional .subscribed class in the <a class="area"> element when you are indeed subscribed.

Below,

• the classes in brackets () replace the existing classes
• the greyed <!-- --> elements can be deleted

<div class="tab-whatcanido (aside aside-actions)">
  <div class="sidebarHead (header)">
    <h2>What can I do here?</h2>
  </div>
  <div class="sidebarRow (row edit)">
    <h3>You are initiator of this initiative</h3>
    <ul class="ul">
      <li><a href="../../draft/new.html?initiative_id=1">edit proposal and/or reasons</a></li>
      <li><a class="action" href="../../initiative/add_initiator.html?initiative_id=1">invite another initiator</a></li>
      <li><a href="../../initiative/revoke/1.html">revoke initiative</a></li>
    </ul>
  </div>
  <div class="sidebarRow (row btn-interest [interested])">
    <!-- <div class="right ()"><img class="right" src="../../static/icons/48/eye.png"></div>-->
    <h3>You are interested in this issue</h3>
    <ul class="ul">
      <li>
        <form ..></form>
        <script ...></script>
        <i class="fa fa-bell"></i>
        <a ..>remove my interest</a>
      </li>
    </ul>
  </div>
  <div class="sidebarRow (row btn-support [supporter] )">
    <!-- <img class="right icon48" src="../../static/icons/32/support_satisfied.png"> -->
    <h3>You are supporting this initiative</h3>
    <ul class="ul">
      <li>
        <form ..></form>
        <script ...></script>
        <i class="fa fa-thumbs-up"></i>
        <a ..>remove my support</a>
      </li>
    </ul>
  </div>
  <div class="sidebarRow (row improve)">
    <h3>I want to improve this initiative</h3>
    <ul class="ul">
      <!-- <li>take a look at the suggestions of your supporters</li> -->
      <!-- <li>if you like to implement a suggestion in your proposal and/or reasons, update your initiative draft</li> -->
      <!-- <li>to argue about suggestions, just add your arguments to your reasons in the initiative draft, so your supporters can learn about your opinion</li> -->
      <!-- <li>take a look at the suggestions (see left) and rate them</li> -->
      <li><a href="../../suggestion/new.html?initiative_id=1">write a new suggestion</a></li>
    </ul>
  </div>
  <div class="sidebarRow (row new)">
    <h3>I don't like this initiative and I want to add my opinion or counter proposal</h3>
    <ul class="ul">
      <!-- <li><a href="../../issue/show/1.html">take a look at the competing initiatives</a></li> -->
      <li><a href="../../initiative/new.html?issue_id=1">start a new competing initiative</a></li>
    </ul>
  </div>
  <div class="sidebarRow (row delegate)">
    <h3>I want to delegate this issue</h3>
    <ul class="ul">
      <li><a href="../../delegation/show.html?initiative_id=1&amp;issue_id=1">choose issue delegatee</a></li>
    </ul>
  </div>
</div>

Is it possible to follow these rules for other elements in this sidebar you encounter in the code?

[kvdmolen]

please see #52