Below is the plan of action to update theming for stickynote:

1 . Create theme functions for the following components:
* Note
* Date
* Edit Link
* Delete Link

2. Remove the use of tables and implement custom template instead of the current theme function

3. Implement a default color that stands out (#1310872: Make Stickynotes Yellow)

4. Implement default theme in attached file with collapsible notes.

CommentFileSizeAuthor
stickynote_v_1.jpg85.07 KBgclicon

Comments

iacono’s picture

Sub

infiniteluke’s picture

Hey German! Is this still planned? If not, I'd like to take the reigns and go in a similar direction.

Wolfgang Reszel’s picture

I added a custom module with this code:

#block-stickynote-stickynote-block {
  background: #FFFFCB;
  padding: 5px;
  margin: 0 0 15px 15px;
  box-shadow: 0px 3px 5px #444;
  border: 1px solid #663200;
  float: right;
  width: 33%;
  font-size: 0.9em;
}

#block-stickynote-stickynote-block h2 {
  background: #663200;
  margin: -5px;
  font-size: 1.2em;
  padding: 2px 5px 5px 2px;
  text-align: left;
  color: #FFFFCB;
}

#block-stickynote-stickynote-block {
  text-align: center;
}

#block-stickynote-stickynote-block td {
  padding: 2px 15px 2px 2px;
  font-size: 10px;
  width: auto;
  background: transparent;
  border: 0;
  color: #8b0;
  text-align: right;
  width: auto;
}

#block-stickynote-stickynote-block td:nth-child(5) {
  width: 100%;
  padding-right: 0;
}

#block-stickynote-stickynote-block td a {
  color: #663200;
}

#block-stickynote-stickynote-block tr {
  display: block;
  width: 100%;
  border-bottom: 1px solid #663200;
}

#block-stickynote-stickynote-block tr:first-child {
  border: 0;
}

#block-stickynote-stickynote-block td:first-child {
  padding: 2px;
  font-size: inherit;
  text-align: left;
  display: inline-block;
  width: 100%;
  color: black;
}

#block-stickynote-stickynote-block label,
#block-stickynote-stickynote-block th,
#block-stickynote-stickynote-block .redirect-list {
  display: none;
}

#block-stickynote-stickynote-block input {
  padding: 2px 5px;
  margin: 0 5px;
}

@media (max-width: 1280px) {
  #block-stickynote-stickynote-block {
    margin: -20px -33px 30px -33px;
    padding: 5px 32px;
    box-shadow: none;
    float: none;
    width: auto;
  }
  #block-stickynote-stickynote-block h2 {
    margin: -5px -33px 0 -33px;
    padding: 2px 32px 5px 32px;    
  }
}

@media (min-width: 1280px) {
  body.page-admin table {
    width: auto;
  }
}

body.page-admin #page {
  width: auto;
}
infiniteluke’s picture

Assigned: gclicon » Unassigned
Status: Active » Closed (works as designed)

See #1310872: Make Stickynotes Yellow for more info on why a redesign of this nature is not planned.

infiniteluke’s picture

Issue summary: View changes

Update issue reference.