Piggydb V6.1 – Cleaned up the Main Menu

This release cleans up the main menu bar. The menu items ‘Home’, ‘Filter’, ‘System’ have been removed from the menu bar. As a result of it, the menu bar has become a container for the tool buttons to create or find knowledge fragments.

The screenshot below is the old main menu:

and this is the new main menu:

(1) The ‘Home’ menu has been removed and the title banner took on the function of a link to the home page. Come to think of it, it is more conventional implementation in the first place.

(2) The ‘Filter/New Filter’ menu has been moved to the sidebar and implemented as a tool button.

(3) The ‘System’ menu items has been moved into the user menu.

(4) The Jump-to-tag button has been replaced with a more general ‘Jump’ button, which allows you to directly jump to a fragment by inputting its ID number in addition to the original function to jump to a tag by its name.


Piggydb Supporters Edition Launched

The Piggydb project is going to celebrate its 4th anniversary at the end of this month. On this occasion, I would like to thank you for your support. It’s because of you, Piggydb users, that I can keep developing this small project.

In the hope of continuing the project for many years to come, I decided to try one of the ideas I thought about. That is ‘Piggydb Supporters Edition’.

Piggydb Supporters Edition is a special edition, which you can buy for $10 from here. And it provides the following features in addition to the standard features:

- User CSS (Cascading Style Sheets)
— You can override the default user interface style by writing your own CSS.
— Your CSS will be saved with your knowledge fragments in the database.
— You can apply your style to part of fragment’s text.
— You can apply your style to a specific fragment by an ID.

Of course, all minor version upgrades and bug fixes will be for free.

If you are interested in this project and want to see what it will turn into in the future, please consider supporting it by buying this edition ;-)

In Piggydb Supporters Edition, the “CSS” menu is added to the user menu and you can edit your own style sheets from it:

User CSS will be in effect immediately after you click on the Save button. The followings are the examples of customizing the color scheme. You can try these simply by copy and paste:

Blue:

.bgcolor-base {
 background-color: #4082BB;
}

table.fragment .header-cell {
 color: #F1F6F8;
 background-color: #24518A;
}

.fragment-header span.tags a.tag {
 color: #F1F6F8;
}

table.fragment td,
.content-box,
.content-box li.leafLastNode {
 background-color: #F1F6F8;
}

#title-banner table td {
 background-color: #143C78;
}

#page-menu #menu,
#page-menu #menu .topitem,
#page-menu #menu ul.submenu {
 color: #F1F6F8;
 background-color: #24518A;
}

#page-menu #menu .topitem a, 
#page-menu #menu .topitem a:visited {
 color: #F1F6F8;
 border: 1px solid #24518A;
}

table.fragment td.subfragments,
table.fragment td.subfragments #children-control td {
 background-color: #4082BB;
}

table.fragment,
table.fragment th, 
table.fragment td,
.content-box {
 border: 1px solid #143C78;
}

.section-title {
 border-bottom: 2px solid #24518A;
}

Brown:

.bgcolor-base {
 background-color: #9F7269;
}

table.fragment .header-cell {
 color: #F2F2F2;
 background-color: #94524A;
}

.fragment-header span.tags a.tag {
 color: #F2F2F2;
}

table.fragment td,
.content-box,
.content-box li.leafLastNode {
 background-color: #F2F2F2;
}

#title-banner table td {
 background-color: #653832;
}

#page-menu #menu,
#page-menu #menu .topitem,
#page-menu #menu ul.submenu {
 color: #F2F2F2;
 background-color: #94524A;
}

#page-menu #menu .topitem a, 
#page-menu #menu .topitem a:visited {
 color: #F2F2F2;
 border: 1px solid #94524A;
}

table.fragment td.subfragments,
table.fragment td.subfragments #children-control td {
 background-color: #9F7269;
}

table.fragment,
table.fragment th, 
table.fragment td,
.content-box {
  border: 1px solid #998D8C;
}

.section-title {
 border-bottom: 2px solid #998D8C;
}

Green:

.bgcolor-base {
 background-color: #CEF892;
}

table.fragment .header-cell {
 color: #000;
 background-color: #A9D66F;
}

.fragment-header span.tags a.tag {
 color: #000;
}

table.fragment td,
.content-box,
.content-box li.leafLastNode {
 background-color: #fff;
}

#title-banner table td {
 background-color: #385909;
}

#page-menu #menu,
#page-menu #menu .topitem,
#page-menu #menu ul.submenu {
 color: #000;
 background-color: #A9D66F;
}

#page-menu #menu .topitem a, 
#page-menu #menu .topitem a:visited {
 color: #000;
 border: 1px solid #A9D66F;
}

table.fragment td.subfragments,
table.fragment td.subfragments #children-control td {
 background-color: #CEF892;
}

table.fragment,
table.fragment th, 
table.fragment td,
.content-box {
  border: 1px solid #9FC029;
}

.section-title {
 border-bottom: 2px solid #E9CA46;
}

Soft:

.bgcolor-base {
 background-color: #ECE5CE;
}

table.fragment .header-cell {
 color: #000;
 background-color: #F1D4AF;
}

.fragment-header span.tags a.tag {
 color: #000;
}

table.fragment td,
.content-box,
.content-box li.leafLastNode {
 background-color: #fff;
}

#title-banner table td {
 background-color: #774F38;
}

#page-menu #menu,
#page-menu #menu .topitem,
#page-menu #menu ul.submenu {
 color: #000;
 background-color: #E08E79;
}

#page-menu #menu .topitem a, 
#page-menu #menu .topitem a:visited {
 color: #000;
 border: 1px solid #E08E79;
}

table.fragment td.subfragments,
table.fragment td.subfragments #children-control td {
 background-color: #ECE5CE;
}

table.fragment,
table.fragment th, 
table.fragment td,
.content-box {
  border: 1px solid #E9CA46;
}

.section-title {
 border-bottom: 2px solid #E9CA46;
}

You can also apply your style to part of fragment’s text. For example, write user css like below:

And specify part of text with the special markup when editing a fragment and the style will be applied to the text like below:

The text style will also be in effect in the document view.

The markup rule is:

  {{[class-name] Here goes the content.}}

You specify a style you want to apply to the text by “class-name”. Multiple class names can be specified by separating them with spaces.

You can apply your style to a specific fragment by an ID. For example, write user css like below:

table.fragment-17 {
 border: 2px solid red;
}

Then, the style will be applied only to the fragment number 17:

There are many other usage of this feature. I will share other tips on this blog, so please keep your eye on it.

Click here to buy Piggydb Supporters Edition (Thank you for your support ;-))

 


Piggydb V6.0 released

This release includes several bug fixes and minor improvements, and is released as stable version.

Since the beginning of June, I have gradually replaced the old fragment editors with the new dialog-style editor and completed it in the previous version.

 

On-the-spot editing:

 

For a file fragment:


Piggydb V6.0-dev9 – New Editor in Tag and Filter Page

This release switches the new-fragment form in the tag and filter page to the new editor:

As you may already know, these forms have default tags derived from their context (the tag or filter concerned in the page) so that you can easily create fragments that fit into the context.

And finally, all of the old fragment forms have been removed and replaced with the new editor.


Follow

Get every new post delivered to your Inbox.

Join 30 other followers