Giter Site home page Giter Site logo

incpi / dark-cpi-web-extension Goto Github PK

View Code? Open in Web Editor NEW
3.0 1.0 0.0 20.45 MB

Make themes compatible for SAP CPI

Home Page: https://incpi.github.io/Dark-CPI-Web-Extension/

JavaScript 61.99% CSS 32.04% Shell 1.61% HTML 4.35%
sap-cpi evening horizon sap sap-cloud-platform sap-theme

dark-cpi-web-extension's Introduction

icon

Web Extension for SAP CPI

Welcome to the Dark CPI Web Extension for SAP CPI and Build-workzone repository! This open-source project provides a sleek, dark interface for your SAP environment, enhancing visual comfort and overall user experience.

Our Vision of this Project

It addresses the common need for a cohesive and comfortable visual interface by extending the dark theme across various UI elements.Moreover, the ability to personalize and extend SAP applications allows for a more tailored user experience, aligning with individual preferences and working conditions.

Privacy and data protection

The plugin does not collect personal data. Nevertheless the stores like Chrome Web Store collect some anonymous data like how many users have the plugin installed. We do not trust 3rd party library & tools so we implemented our own solution instead of library to ensure security for logging in browser but nothing is stored or sent to any server by this plugin.

We guarantee:

  • No personal data / tenant information is collected.
  • It is open source so feel free to check the source code or your network console.

Blog post

SAP Blog Post in community

Installation

Warning

No Firefox browser support.

To install the Dark CPI Extension, please follow these steps:

  1. Download the Extension:

    • Visit the Chrome Web Store or EDGE store or search for "Dark CPI" in web-stores.
    • Click "Add to Chrome" to install the extension.
  2. Manual Installation:

    • Download the latest release from our GitHub repository then go to bin folder.
    • Extract the downloaded archive.
    • Open Google Chrome and navigate to chrome://extensions/.
    • Enable "Developer mode" by toggling the switch in the top-right corner.
    • Click "Load unpacked" and select the extracted folder.

Usage

Using the Dark CPI Extension is straightforward:

  1. Open your SAP CPI environment.
  2. The extension will automatically apply the dark theme to your interface or select from extension icon on top in browser besides URL if pin it.

Addtionally we support SAP BUILD and Theme Designer

Theme Customization

The Dark CPI Extension allows you to customize the theme by specifying a URL parameter. This feature enables you to choose from a variety of predefined themes.

Using the URL Parameter for only SAP CPI (not for SAP BUILD) (Update: Temporary debug purpose , Replaced with UI)

To select a specific theme, append the darkcpi parameter to the URL of your SAP CPI environment, followed by the desired theme value. For example:from design page, https://your-sap-cpi-environment.ondamand.com/shell/design?darkcpi=theme-value

Replace theme-value with one of the valid keys from the themeMap object.

Available Themes

The extension comes with the following predefined themes:

  • 0: Morning Horizon - New Theme By SAP
  • 1: Evening Horizon - Dark Theme similar to New UI
  • 2: Quartz Light - Previous UI Theme before Morning Horizon

[!NOTE] any other theme by SAP is not compatible with this extension.

Custom Themes

If you want to create your own custom theme, you can modify the themeMap object in the source code. Add a new key-value pair, where the key represents the theme name (to be used in the URL parameter), and the value is an object containing the CSS styles for your custom theme.

Changelogs

v1.3.4.1

  • [feature] Added support for addtional SAP CPI - fka HCI / old Tenents
  • [Bugfix] UI changes fixes.

v1.3.3

  • [Bugfix] SAP UI theme Horizon dark fix (Trace half screnn non visible)
  • [Bugfix] Mapping fields are invisible in mmap Files.
  • [Bugfix] Simulation error color is not correct.
  • [feature] Now supports addtional application such as SAP Builds workzone and it's theme designer.
  • [feature] Dark theme supports CPI capablities like Integration Assessment & Migration Assessment.
  • [improvement] UI changes for popup.

v1.2.0

  • [Feature] Automatically closes the navigation bar on startup.
  • [Feature] Added in Edge Store
  • [Bugfix] SAP UI theme Horizon fix
  • [Improvement] UI improvement: select theme from extension icon

v1.1.0

  • [BugFix] Added support for Mapping pages.
  • [Feature] Change theme from Popup page.

v1.0.0

  • Dark theme for SAP CPI. Initial public version.

Code of Conduct

We are committed to fostering an open and welcoming environment for all contributors and users. Please adhere to our Code of Conduct, which outlines the expected behavior and guidelines for participation in this project.

Contributing

We welcome contributions from the community! To contribute, please follow these steps:

  1. Fork the Repository: Click the "Fork" button at the top of our GitHub page.
  2. Clone Your Fork: Use git clone <your-fork-url> to clone your fork to your local machine.
  3. Create a Branch: Use git checkout -b feature-branch to create a new branch for your feature or bugfix.
  4. Make Changes: Implement your changes.
  5. Commit and Push: Use git commit -m "Description of changes" and git push origin feature-branch.
  6. Create a Pull Request: Submit a pull request to our repository.

Important

No 3rd party lib is allowed in minified version. If you want to include then it should be uncompressed version So that we can review / set other environment as ISOLATED for security reasons.

Please refer to our Contribution Guidelines for more detailed information.

Code Review Guidelines

To ensure the highest quality of code and maintain the project's integrity, we have established strict guidelines for code reviews:

  • Security: Verify that your code does not introduce security vulnerabilities.

We appreciate your patience and cooperation during the review process.

Support

If you have any questions, issues, or suggestions, please feel free to open an issue on GitHub.

Thank you for using the Dark CPI Extension! We hope it enhances your SAP experience.

dark-cpi-web-extension's People

Contributors

incpi avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar

dark-cpi-web-extension's Issues

Text coloring messes with SAP CPI Helper

Describe the bug
If you have both CPI Helper (4.0.0) and Dark CPI installed, Dark CPI seems to overwrite some text coloring of the CPI Helper.

To Reproduce
Steps to reproduce the behavior:

  1. Install both CPI Helper (4.0.0) and Dark CPI
  2. Check What's New Popup

Expected behavior
Some texts and headers are almost not visible unless Dark CPI is turned off.

Screenshots
Without Addon:
image
With Addon:
image

Without Addon:
image
With Addon:
image

Desktop (please complete the following information):

  • OS: Windows 11
  • Browser chrome
  • Version 125.0.6422.113

Additional context
Parts of this issue seem to be related to CPI Helper itself. Will make an issue there as well:
dbeck121/CPI-Helper-Chrome-Extension#178

List Of Issues for v1.3.1

Describe the bug

  • Mapping fields are invisible
  • Simulation error color is not visible

Version
1.3

Environment
Cloud foundry / NEO / CI

Neo not supported

Describe the bug
A clear and concise description of what the bug is.

Neo is not supported

To Reproduce
Check URL Of Application

Version
Version of extension 1.2

Environment
NEO Old HCI tenant

Known Issues

Hello,

It's displayed as a Light theme

  • Mapping functions are not displayed properly
    image

Trace Page resizable Pane is having improper display

Describe the bug
Trace Page resizable Pane is having improper display

To Reproduce
Steps to reproduce the behavior:

  1. Go to Trace and modal let it open
  2. Click on any step
  3. resize bottom pane
  4. See error

Version
Version of extension 1.3.3

Environment
Cloud foundry / NEO / CI (All)

Expected behavior
similar to design page

Screenshots
image

Message attachments visual bug

Describe the bug
Hello,

Thank you for the quick fix for my previous issue!

now I noticed a bug in the message attachments, the background remains white and the messages seem to be aligned on top of each other.

To Reproduce
Steps to reproduce the behavior:

  1. Go to message processing logs
  2. Click on message with any attachment in it
  3. See visual bug

Version
1.3.2

Environment
multi

Screenshots
image

Desktop (please complete the following information):

  • OS: w11pro 64bit
  • Browser chrome

Link not visible (UI)

Describe the bug
Link not visible (UI)

To Reproduce
Steps to reproduce the behavior:
In CPI Check for any link of CPI helper.

Version
1.3.3

Environment
Cloud foundry / NEO / CI

Expected behavior
color need to be default

the part that turns off the screen in trace mode

Describe the bug
when I enter trace mode I can't see the screen completely, something is blocking the screen. attached is the pic

To Reproduce
Steps to reproduce the behavior:

  1. Go to trace mode
  2. See error

Version
3.13.1 on chrome

Environment
multi environment

Expected behavior
entering trace mode

Screenshots
image

Desktop (please complete the following information):

  • OS: win 11 pro 64 bit
  • Browser chrome

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.