Améliorations du thème #189
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Compatibilité Sous-total Utilisation des variables
There was a problem hiding this comment.
Pull request overview
This pull request implements theme improvements focused on two main objectives: subtotal compatibility and migration to CSS variables.
- Subtotal styling expansion: Replaces combined CSS classes (
.subtitleLevel3to9,.subtotalLevel3to9) with individual level classes and switches fromcolorDarkertocolorLightenfunction for progressive lightening - CSS variable migration: Systematically converts PHP variables to CSS custom properties throughout theme files, improving maintainability and reducing repetition
- Code standardization: Replaces
echowithprintfor PHP output consistency across ~200+ instances
Reviewed changes
Copilot reviewed 5 out of 12 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| themeoblyon/modules/subtotal.inc.php | Expands subtitle/subtotal classes from 3 combined levels to 9 individual levels; changes color function from darker to lighten |
| themeoblyon/login.inc.php | Adds extensive login block styling (260+ lines); replaces PHP color variables with CSS custom properties |
| themeoblyon/global.inc.php | Standardizes PHP output from echo to print (~200+ changes); adds CSS variable definitions for colors and navigation elements |
| themeoblyon/dropdown.inc.php | Converts direct PHP variables to CSS custom properties for colors and backgrounds |
| themeoblyon/fonts/selection.json | Adds new font icon selection configuration (1585 lines) |
| themeoblyon/fonts/oblyon-icons.woff | Adds new icon font file |
| config.php | Minor whitespace standardization |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| .subtitleLevel2 { | ||
| background-color: <?php print (getDolGlobalString('SUBTOTAL_TITLE_BACKGROUNDCOLOR') ? colorDarker(getDolGlobalString('SUBTOTAL_TITLE_BACKGROUNDCOLOR'), 20) : '#ddddff'); ?> !important; | ||
| background-color: <?php print (getDolGlobalString('SUBTOTAL_TITLE_BACKGROUNDCOLOR') ? colorLighten(getDolGlobalString('SUBTOTAL_TITLE_BACKGROUNDCOLOR'), getDolGlobalInt('SUBTOTAL_TITLE_AND_SUBTOTAL_BRIGHTNESS_PERCENTAGE', 10)) : '#ddddff'); ?> !important; |
There was a problem hiding this comment.
The function name has changed from colorDarker to colorLighten, but the percentage multipliers (×1, ×2, ×3, etc.) suggest progressively lighter colors. However, line 9 uses multiplier 1 instead of 0 for the base level, while line 45 also uses multiplier 1. This creates an inconsistency where .subtitleLevel2 and .subtotalLevel2 would have the same lightness value, despite being at different conceptual levels.
Comment on lines
+220
to
+480
| div.login_block:after { | ||
| /*content: '\f013';*/ | ||
| color: var(--bgnavtop_txt); | ||
| font-family: var(--fontawesomeFamily) !important; | ||
| font-size: 20px; | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| line-height: 40px; | ||
| <?php } else { ?> | ||
| line-height: 54px; | ||
| <?php } ?> | ||
| } | ||
| div.login_block:hover:after { | ||
| color: <?php print $maincolor; ?>; | ||
| } | ||
| div.login_block_tools { | ||
| margin-<?php print $right ?>: 8px; | ||
| display: inline-block; | ||
| vertical-align: middle; | ||
| line-height: <?php print $disableimages ? '25' : '40'; ?>px; | ||
| height: <?php print $disableimages ? '25' : '40'; ?>px; | ||
| } | ||
| div.login_block_other { | ||
| display: inline-block; | ||
| vertical-align: middle; | ||
| clear: <?php print $disableimages ? 'none' : 'both'; ?>; | ||
| padding-top: 0; | ||
| text-align: <?php print $right ?>; | ||
| max-width: 200px; | ||
| } | ||
| div.login_block_user { | ||
| display: inline-block; | ||
| vertical-align: middle; | ||
| /*clear: left;*/ | ||
| /*float: <?php print $left; ?>;*/ | ||
| margin-right: 0px; | ||
| } | ||
| div.login_block_user .login a, | ||
| div.login_block_user a { | ||
| display: table-cell; | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| font-size: 13px; | ||
| <?php } ?> | ||
| font-family: <?php print $fontmainmenu; ?>; | ||
| font-weight: 500; | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| height: 40px; | ||
| <?php } else { ?> | ||
| height: 54px; | ||
| <?php } ?> | ||
| max-width: 300px; | ||
| overflow: hidden; | ||
| padding: 0 3px; | ||
| text-overflow: ellipsis; | ||
| transition: all .2s ease-in-out; | ||
| -moz-transition: all .2s ease-in-out; | ||
| -webkit-transition: all .2s ease-in-out; | ||
| vertical-align: middle; | ||
| } | ||
| div.login_block_user > .classfortooltip.login_block_elem2 { | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| height: 40px; | ||
| <?php } else { ?> | ||
| height: 54px; | ||
| <?php } ?> | ||
| } | ||
| div.login_block_other { | ||
| display: inline-block; | ||
| clear: <?php print $disableimages ? 'none' : 'both'; ?>; | ||
| } | ||
| .login_block_other { | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| background: var(--bgnavleft); | ||
| <?php } else { ?> | ||
| background: var(--bgnavtop); | ||
| <?php } ?> | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| display: none; | ||
| <?php } ?> | ||
| /* position: absolute; */ | ||
| right: 0; | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| top: 40px; | ||
| height: 40px; | ||
| line-height: 36px; | ||
| <?php } else { ?> | ||
| top: 54px; | ||
| height: 54px; | ||
| line-height: 50px; | ||
| <?php } ?> | ||
| padding-top: 0; | ||
| text-align: right; | ||
| margin-right: 3px; | ||
| } | ||
| .login_block:hover > .login_block_other { | ||
| /* display: block; */ | ||
| } | ||
|
|
||
| .login_block_user a img.loginphoto { | ||
| display: none; | ||
| } | ||
|
|
||
| .login_block_elem a span.atoplogin, .login_block_elem span.atoplogin { | ||
| vertical-align: middle; | ||
| } | ||
|
|
||
| .login_block_elem { | ||
| float: <?php print $left; ?>; | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| background-color: var(--bgnavleft); | ||
| height: 40px; | ||
| <?php } else { ?> | ||
| background-color: var(--bgnavtop); | ||
| height: 54px; | ||
| <?php } ?> | ||
| padding: 0; | ||
| } | ||
| .login_block_elem.classfortooltip { | ||
| margin: 0; | ||
| } | ||
| .login_block_elem a, | ||
| .login_block td.classfortooltip a { | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| color: var(--bgnavleft_txt); | ||
| font-size: 16px; | ||
| height: 40px; | ||
| line-height: 36px; | ||
| <?php } else { ?> | ||
| color: var(--bgnavtop_txt); | ||
| font-size: 18px; | ||
| height: 54px; | ||
| line-height: 50px; | ||
| <?php } ?> | ||
| display: block; | ||
| font-family: var(--fontfamilydol); | ||
| padding: 0 3px; | ||
| text-decoration: none; | ||
| transition: all .2s ease-in-out; | ||
| -moz-transition: all .2s ease-in-out; | ||
| -webkit-transition: all .2s ease-in-out; | ||
| } | ||
| .login_block_elem a:hover, | ||
| .login_block td.classfortooltip a:hover { | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| color: var(--bgnavleft_txt_hover); | ||
| <?php } else { ?> | ||
| color: var(--bgnavtop_txt_hover); | ||
| <?php } ?> | ||
| } | ||
| .atoplogin, .atoplogin:hover { | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| color: var(--bgnavleft_txt) !important; | ||
| <?php } else { ?> | ||
| color: var(--bgnavtop_txt) !important; | ||
| <?php } ?> | ||
| } | ||
| .login_block_getinfo { | ||
| text-align: center; | ||
| } | ||
| .login_block_getinfo div.login_block_user { | ||
| display: block; | ||
| } | ||
| .login_block_getinfo .atoplogin, .login_block_getinfo .atoplogin:hover { | ||
| color: #333 !important; | ||
| font-weight: normal !important; | ||
| } | ||
| .alogin, .alogin:hover { | ||
| font-weight: normal !important; | ||
| padding-top: 2px; | ||
| } | ||
| .alogin:hover, .atoplogin:hover { | ||
| text-decoration:underline !important; | ||
| } | ||
| span.fa.atoplogin, span.fa.atoplogin:hover { | ||
| font-size: 16px; | ||
| text-decoration: none !important; | ||
| } | ||
| .atoplogin #dropdown-icon-down, .atoplogin #dropdown-icon-up { | ||
| font-size: 0.7em; | ||
| } | ||
| .login_block_elem img.printer, | ||
| .login_block_elem img.login, | ||
| .login_block_elem img.help, | ||
| .login_block td.classfortooltip img.printer, | ||
| .login_block td.classfortooltip img.login, | ||
| .login_block td.classfortooltip img.help { | ||
| vertical-align: baseline; | ||
| } | ||
| img.login, img.printer, img.help, img.entity { | ||
| /* padding: 0px 0px 0px 4px; */ | ||
| /* margin: 0px 0px 0px 8px; */ | ||
| text-decoration: none; | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| color: var(--bgnavleft_txt); | ||
| <?php } else { ?> | ||
| color: var(--bgnavtop_txt); | ||
| <?php } ?> | ||
| font-weight: bold; | ||
| } | ||
| .userimg.atoplogin img.userphoto, .userimgatoplogin img.userphoto { /* size for user photo in login bar */ | ||
| width: <?php print $disableimages ? '26' : '32'; ?>px; | ||
| height: <?php print $disableimages ? '26' : '32'; ?>px; | ||
| border-radius: 50%; | ||
| background-size: contain; | ||
| border: 1px solid; | ||
| border-color: rgba(255, 255, 255, 0.2); | ||
| } | ||
| img.userphoto { /* size for user photo in lists */ | ||
| border-radius: 0.72em; | ||
| width: 1.4em; | ||
| height: 1.4em; | ||
| background-size: contain; | ||
| vertical-align: middle; | ||
| } | ||
| img.userphotosmall { /* size for user photo in lists */ | ||
| border-radius: 0.6em; | ||
| width: 1.2em; | ||
| height: 1.2em; | ||
| background-size: contain; | ||
| vertical-align: middle; | ||
| background-color: #FFF; | ||
| } | ||
| img.userphoto[alt="Gravatar avatar"], img.photouserphoto.dropdown-user-image[alt="Gravatar avatar"] { | ||
| background: #fff; | ||
| } | ||
| form[name="addtime"] img.userphoto { | ||
| border: 1px solid #444; | ||
| } | ||
| .span-icon-user { | ||
| background-image: url(<?php print dol_buildpath($path.'/theme/'.$theme.'/img/object_user.png',1); ?>); | ||
| background-repeat: no-repeat; | ||
| } | ||
| .span-icon-password { | ||
| background-image: url(<?php print dol_buildpath($path.'/theme/'.$theme.'/img/lock.png',1); ?>); | ||
| background-repeat: no-repeat; | ||
| } | ||
| .login_block td.classfortooltip { height: 40px; } | ||
| .login_block .classfortooltip:hover, | ||
| .login_block .classfortooltip:focus { | ||
| <?php if (getDolGlobalString('MAIN_MENU_INVERT')) { ?> | ||
| background-color: var(--bgnavleft_hover); | ||
| <?php } else { ?> | ||
| background-color: var(--bgnavtop_hover); | ||
| <?php } ?> | ||
| } | ||
| div.login_block table { display: inline; } | ||
| /* db inf v3.5 */ | ||
| td div.login { | ||
| white-space: nowrap; | ||
| padding: 0; | ||
| margin: 0; | ||
| font-weight: bold; | ||
| color: #f4f4f4; | ||
| } | ||
| .alogin { | ||
| font-weight: normal !important; | ||
| font-size: <?php print $fontsizesmaller; ?>px !important; | ||
| } | ||
| .alogin:hover { | ||
| text-decoration: underline !important; | ||
| color: <?php print $maincolor; ?> !important; | ||
| } |
There was a problem hiding this comment.
This large block of CSS (lines 220-480) appears to be duplicated code that already exists in global.inc.php. The login block styles are being defined twice in the same theme, which violates the DRY (Don't Repeat Yourself) principle and can lead to maintenance issues and inconsistencies.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Compatibilité Sous-total
Utilisation des variables