Skip to content

Commit

Permalink
UX: Changes help text for UUIDv4 config switch
Browse files Browse the repository at this point in the history
UI: Refactors colors from config.css to main variable
UI: Change the on-search highlighting of search hits in help texts in config app
  • Loading branch information
vigorouscoding committed Feb 12, 2024
1 parent 1a46013 commit d35a086
Show file tree
Hide file tree
Showing 8 changed files with 48 additions and 55 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -663,8 +663,8 @@ private void welcomeTab(final Tag menu, final Tag tabs) {
final ManageDatabasesCommand cmd = Services.getInstance().command(null, ManageDatabasesCommand.class);
final boolean databaseIsConfigured = !cmd.getConnections().isEmpty();
final boolean passwordIsSet = StringUtils.isNotBlank(Settings.SuperUserPassword.getValue());
final Style fgGreen = new Style("color: #81ce25;");
final Style bgGreen = new Style("background-color: #81ce25; color: #fff; border: 1px solid rgba(0,0,0,.125);");
final Style fgGreen = new Style("color: var(--config-structr-green);");
final Style bgGreen = new Style("background-color: var(--config-structr-green); color: #fff; border: 1px solid rgba(0,0,0,.125);");
final String id = "welcome";

menu.block("li").css("active").block("a").id(id + "Menu").attr(new Attr("href", "#" + id)).block("span").text("Start").css("active");
Expand Down
34 changes: 14 additions & 20 deletions structr-base/src/main/resources/structr/css/config.css
Original file line number Diff line number Diff line change
Expand Up @@ -118,18 +118,14 @@ form.config-form div.buttons input[type=reset] {
}

.default-action {
background-color: #81ce25;
background-color: var(--config-structr-green);
}

.config-group h1 {
margin: .5em 0 0 0;
}

.form-group {
}

.form-group span {
display: inline-block;
margin: 0 1rem 0 .25rem;
}

Expand Down Expand Up @@ -197,43 +193,41 @@ button.toggle-option.active::after {
}

li.search-matches.active {
background: #81ce25;
background: var(--config-structr-green);
}

li.search-matches {
background: #b5e27f;
}

label.search-matches {
color: #81ce25;
color: var(--config-structr-green);
}

label span.search-matches {
background: #81ce25;
border-radius: 12px;
padding-right: 3px;
padding-bottom: 1px;
label span.search-matches > svg {
background: var(--config-structr-green);
border-radius: 1rem;
}

input.search-matches {
border: 2px solid #81ce25;
border: 2px solid var(--config-structr-green);
}

button.search-matches {
border: 1px solid #81ce25 !important;
color: #81ce25;
border: 1px solid var(--config-structr-green) !important;
color: var(--config-structr-green);
}

select.search-matches {
border: 2px solid #81ce25;
border: 2px solid var(--config-structr-green);
}

select option.search-matches {
color: #81ce25;
color: var(--config-structr-green);
}

td.search-matches {
color: #81ce25;
color: var(--config-structr-green);
font-weight: bold;
}

Expand All @@ -255,15 +249,15 @@ h2 {
div.connection {
float: left;
margin: 1em 2em 2em 0;
background-color: #fff;
background-color: var(--solid-white);
min-width: 24rem;
min-height: 24rem;
padding: 1em 1.5em;
border-radius: 3px;
}

div.connection.active {
border: 1px solid #81ce25;
border: 1px solid var(--config-structr-green);
}

div.connection.new-connection {
Expand Down
12 changes: 4 additions & 8 deletions structr-base/src/main/resources/structr/css/crud.css
Original file line number Diff line number Diff line change
Expand Up @@ -49,24 +49,20 @@
}

#crud-left .crud-type {
border-bottom: 1px solid #f6f6f6;
border-top: 1px solid #f6f6f6;
border-bottom: 1px solid var(--light-gray-bg-f7);
border-top: 1px solid var(--light-gray-bg-f7);
margin-top: -1px;
padding: 6px 5px 6px 10px;
cursor: pointer;
height: 18px;
}

#crud-left .crud-type.active {
background-color: #81ce25;
border-bottom: 1px solid #f6f6f6;
border-top: 1px solid #f6f6f6;
background-color: var(--config-structr-green);
}

#crud-left .crud-type:hover {
background-color: #81ce25;
border-bottom: 1px solid #f6f6f6;
border-top: 1px solid #f6f6f6;
background-color: var(--config-structr-green);
z-index: 99;
}

Expand Down
37 changes: 18 additions & 19 deletions structr-base/src/main/resources/structr/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,9 @@

--light-gray-delete-b3: #b3b3b3;
--medium-light-gray-c0: #c0c0c0;
--light-gray-delete-d3: #d3d3d3;
--medium-light-gray-e0: #e0e0e0;
--light-gray-bg-f3: #f3f3f3;
--light-gray-bg-f7: #f7f7f7;
--light-gray-bg-fa: #fafafa;

--gray-eee: #eee;
--gray-ddd: #ddd;
Expand Down Expand Up @@ -98,18 +96,20 @@
--warning-bg: #feefb3;
--input-invalid: #fee;

--structr-green: #84ba39;
--structr-light-green: #b5e27f;
--structr-light-green-2: #c5ff69;
--structr-green: #84ba39;
--config-structr-green: #81ce25;
--cropper-outline: color-mix(in srgb, var(--config-structr-green), transparent 25%);
--structr-light-green: #b5e27f;
--structr-light-green-2: #c5ff69;
--structr-light-green-transparent: rgba(114,177,26,.15);
--very-light-structr-green: #a5e25a;
--very-light-structr-green-2: #eff8e3;
--success-green: #4f8a10;
--success-light-green-bg: #dff2bf;
--dark-structr-green: #72a132;
--dark-structr-green-2: #668f2c;
--very-light-structr-green: #a5e25a;
--very-light-structr-green-2: #eff8e3;
--success-green: #4f8a10;
--success-light-green-bg: #dff2bf;
--dark-structr-green: #72a132;
--dark-structr-green-2: #668f2c;

--disabled-relationship-options: #7e7e7e;
--disabled-relationship-options: #7e7e7e;

--cta-hover: #96f02b;
--input-disabled: #a0a0a0;
Expand All @@ -121,7 +121,6 @@
--gray-opacity-20: rgba(127,127,127, .2);
--gray-opacity-25: rgba(204,204,204,.25);
--gray-opacity-80: rgba(244,244,244, .8);
--cropper-outline: rgba(129,206,37, .75);
--light-blue-20: rgba(15, 80, 255, 0.2);

--hover-highlight-color-inactive: rgba(153, 153, 153, .66);
Expand Down Expand Up @@ -1281,7 +1280,7 @@ i.button {

.node.nodeSelectedFromContextMenu {
color: var(--gray-333) ! important;
background-color: var(--light-gray-bg-fa) ! important;
background-color: var(--light-gray-bg-f7) ! important;
border: 1px dashed var(--gray-777);
}

Expand Down Expand Up @@ -2107,7 +2106,7 @@ th.center {
width: 240px;
min-height: 240px;
border: 1px dashed var(--gray-ccc);
background-color: var(--light-gray-bg-fa);
background-color: var(--light-gray-bg-f7);
padding: 12px;
opacity: .9;
}
Expand Down Expand Up @@ -2277,7 +2276,7 @@ td#cascading-options, td#propagation-options {

.graphTooltip {
margin-top: 10pt;
background: var(--light-gray-bg-fa);
background: var(--light-gray-bg-f7);
z-index: 99999;
border: 2px solid var(--gray-ccc);
border-radius: 2px;
Expand All @@ -2304,12 +2303,12 @@ td#cascading-options, td#propagation-options {

.tooltipBody {
padding: 2pt 4pt;
background: var(--light-gray-bg-fa);
background: var(--light-gray-bg-f7);
}

.tooltipFooter {
padding: 2pt 4pt;
background: var(--light-gray-bg-fa);
background: var(--light-gray-bg-f7);
}

.graphTooltipSelectable {
Expand Down Expand Up @@ -3147,7 +3146,7 @@ i.fa-sitemap {
margin-right: 2px;
padding: 8px;
color: var(--gray-333);
background-color: var(--light-gray-delete-d3);
background-color: var(--gray-ccc);
}

.image-editor-menubar i:hover, .image-editor-menubar svg:hover {
Expand Down
2 changes: 1 addition & 1 deletion structr-base/src/main/resources/structr/css/pages.css
Original file line number Diff line number Diff line change
Expand Up @@ -365,7 +365,7 @@
align-items: center;
width: 70px;
color: #333;
background-color: #fff;
background-color: var(--solid-white);
border: 1px solid transparent;
border-radius: 5px;
cursor: pointer;
Expand Down
2 changes: 1 addition & 1 deletion structr-base/src/main/resources/structr/js/config.js
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ let _Config = {
$(el.attr('href')).show();
});

_Helpers.activateCommentsInElement(document);
_Helpers.activateCommentsInElement(document, { css: '' });

let anchor = (new URL(window.location.href)).hash.substring(1) || 'general';
document.querySelector(`a[href$=${anchor}]`)?.click();
Expand Down
3 changes: 1 addition & 2 deletions structr-base/src/main/resources/structr/js/helper.js
Original file line number Diff line number Diff line change
Expand Up @@ -464,8 +464,7 @@ let _Helpers = {
text: el.dataset['comment'],
element: el,
css: {
'margin': '0 4px',
//'vertical-align': 'top'
'margin': '0 4px'
}
};

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,12 @@ public enum POSSIBLE_UUID_V4_FORMATS {
public static final Setting<Boolean> DisableSendSystemInfo = new BooleanSetting(generalGroup, "Application", "application.systeminfo.disabled", false, "Disables transmission of telemetry information. This information is used to improve the software and to better adapt to different hardware configurations.");
public static final Setting<Boolean> RequestParameterLegacyMode = new BooleanSetting(generalGroup, "Application", "application.legacy.requestparameters.enabled", false, "Enables pre-4.0 request parameter names (sort, page, pageSize, etc. instead of _sort, _page, _pageSize, ...)");

public static final Setting<String> UUIDv4AllowedFormats = new ChoiceSetting(generalGroup, "Application", "application.uuid.allowedformats", "without_dashes", Settings.getAllowedUUIDv4FormatOptions(), "Which UUIDv4 types are allowed: With or without dashes, or both. <br><br><strong>WARNING</strong>: This could prevent access to data objects. Only change this setting with an empty database.<br><br><strong>WARNING</strong>: Requires a restart.");
public static final Setting<String> UUIDv4AllowedFormats = new ChoiceSetting(generalGroup, "Application", "application.uuid.allowedformats", "without_dashes", Settings.getAllowedUUIDv4FormatOptions(), """
Configures which UUIDv4 types are allowed: With dashes, without dashes or both.<br>
<br><strong>WARNING</strong>: Allowing both UUIDv4 formats to be accepted is dangerous strongly recommended against! This should be a last resort for temporary migration scenarios!<br>
<br><strong>WARNING</strong>: If changed after some data was already created, this could prevent access to data objects. Only change configure setting with an empty database.<br>
<br><strong>INFO</strong>: Requires a restart.
""");
public static final Setting<Boolean> UUIDv4CreateCompact = new BooleanSetting(generalGroup, "Application", "application.uuid.createcompact", true, "Determines how UUIDs are created, either with or without dashes.<br><br><strong>WARNING</strong>: If configured so that the created UUIDs do not comply with an allowed format, then structr will not start.<br><strong>WARNING</strong>: Requires a restart.");

// scripting related settings
Expand Down Expand Up @@ -947,7 +952,7 @@ public static Map<String, String> getAllowedUUIDv4FormatOptions() {
return Map.of(
POSSIBLE_UUID_V4_FORMATS.without_dashes.toString(), "Without Dashes",
POSSIBLE_UUID_V4_FORMATS.with_dashes.toString(), "With Dashes",
POSSIBLE_UUID_V4_FORMATS.both.toString(), "Both"
POSSIBLE_UUID_V4_FORMATS.both.toString(), "Both (Read warning!)"
);
}

Expand Down

0 comments on commit d35a086

Please sign in to comment.