Another Feature Request: Buttons in the left or the right.

[tpurde]

I told about this in my last feature request (sorry for lots of these, I've been coming up with some ideas) because it was somewhat related, but I was told to open a new issue.

I'd like to request another thing that's fairly related (It includes the location of buttons). Putting the icons to the left or the right of the notification just like in macOS.

If you add this, in my opinion, it should be changeable in the deadd.conf file. Allowing for something like button-location: [right, left, default, none] in the config file would also allow for fully disabling these buttons. (Default being the way it is right now, or if #76 gets accepted, the way that was configured in the gtk.css)

This would also allow for much smaller notifications when image size is lowered, just like the image from macOS.

[MyriaCore]

I'd just like to move my mock up in https://github.com/phuhl/linux_notification_center/issues/76#issuecomment-673659136 over here:

@tpurde well, the actual actions box should just be a GTK box. So, to accomplish this, we'd basically need to:

1. Change the position of the box from the bottom to the right
2. Change the Orientation of the action box (so the elements are stacked vertically, not horizontally)

I think you should be able to do step 2 in the CSS, but 1 is gonna be kinda difficult. This is b/c, AFAIK, you'd need to change the structure of the heirarchy to get both orientations side-by-side. You'd have to use another box or something along those lines, as I've shown in this little diagram:

What things look like now	How the structure would need to change
``` +---------------------------+ | |Noti Title | | |Noti Body | |Image +--------------------+ | Zone | Action Button Zone | | +----------+---------+ | |App Icon | App Name| +-----------------+---------+ ```	``` +---------------------------+ | |Noti Title| Action | | |Noti Body | Button | |Image | | Zone | | Zone | | | | +--------------------+ | |App Icon | App Name| +-----------------+---------+ ```

We could do this by nesting the boxes like this:

Orientation of surrounding box is Horizontal	Orientation of surrounding box is Vertical
``` +------+--------------------+ | | +----------------+ | | | | Title |Action | | |Image | | Body |Buttons | | | Zone | +----------------+ | | +--------------------+ | |App Icon | App Name| +-----------------+---------+ ```	``` +------+--------------------+ | | +----------------+ | | | | Title / Body | | | | +----------------+ | |Image | | Action Buttons | | | Zone | +----------------+ | | +--------------------+ | |App Icon | App Name| +-----------------+---------+ ```

Depending on how things were arranged now, this could be super easy, or super hard. If this is already kinda how things are implemented, then all we'd need to do is expose this outer box so the user could potentially change the orientation in the CSS (which i think is possible).

However, it could be the case that the actions box is just centered, and exists as the title & body's siblings in the same box. If this is the case, we'd basically have to lift these two into a new box that wraps them, and then expose that in the css.

I probably wouldn't be able to make this edit, since I just don't know where the heirarchy is setup (I couldn't rly find any glade xml files anywhere). Plus, this might not even be the end result you're looking for, visually. Here's what I think this might look like:

Orientation of surrounding box is Vertical	Orientation of surrounding box is Horizontal
	

Honestly, I think this feature is pretty doable, but it might not necessarily be what suits your needs. I assumed the things that drew you to the mac's design there is the wireframey design, and the fact that the buttons take up the entire space. You might be able to achieve something like that, but you'd still be fighting for space with the app name at the bottom, at least with this setup.

[MyriaCore]

Hey I just wanted to clarify that, after having worked a bit on #78, I think that it might be easier & better to implement something like more like what was discussed over at https://github.com/phuhl/linux_notification_center/issues/75#issuecomment-681123153.

This kind of change would actually do the same thing as my mock up - that is, produce a structure that allows us to make this change by just swapping the orientations of a few boxes.

Here's a more in-depth view of what the model view change would look like, with annotations of box orientation:

Model Heirarchy Before	Model View Before
	``` +-------+-------------------+ | |Title Label | | Image |Body Label | | | buttons | | | App Icon & Name| +-------+-------------------+ ```
Model Heirarchy After	Model View After
	``` +-------+-------------------+ | |Title Label | | Image |Body Label | | | App Icon & Name| +-------+-------------------+ | buttons | +---------------------------+ ```

This was actually tried in commit 8405e75, but I kinda had to abandon it cause I ran into a weird bug where the buttons wouldn't show up at all. I suppose as a part of this, I'd be able to really debug that now.

Here's a preview of what this change might make things look like:

Buttons under content	Buttons to right of content
	

I didn't really do a great job w/ alignment and padding in this image, but this is what the structure would be. I think this is better for 2 reasons:

1. It makes 'the ideal notification' (a notif w/ a title, a single line of body text, action buttons and an image) look way nicer, since the action buttons are no longer pushing the app name below the image:

   Before	After
   	

2. It allows us to get much closer to what the proposal's target UI looks like, with the actions to the right and the notification content to the left.