Files
Dwinzo_dev/app/src/styles/components/footer/footer.scss
Vishnu 135633ef7a Refactor logging components and styles; remove unused CSS; enhance log icon functionality
- Removed the random color generation function from ProductionCapacity component.
- Updated ThroughputSummary component to remove unused imports.
- Simplified LogList component by removing unnecessary icons and integrating GetLogIcon for log types.
- Enhanced LoggerContext to support a new "success" log type and optimized logger methods with useMemo.
- Adjusted SimulationPlayer to conditionally render analysis components.
- Deleted index.css and removed its import from index.tsx.
- Cleaned up builder module by removing unused imports and optimizing state management.
- Removed savedTheme from Ground component.
- Changed log message from info to warning in Project component.
- Updated log color variables in SCSS files for better visibility and consistency.
- Added new log icons for success, error, info, and warning in LogIcons component.
- Created GetLogIcon utility to streamline log icon rendering based on log type.
2025-05-03 15:20:52 +05:30

143 lines
2.8 KiB
SCSS

@use "../../abstracts/variables" as *;
@use "../../abstracts/mixins" as *;
.footer-wrapper {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
z-index: 1;
display: flex;
justify-content: space-between;
padding: 2px 12px;
.selection-wrapper {
display: flex;
gap: 6px;
.selector-wrapper {
display: flex;
gap: 6px;
align-items: center;
background: var(--background-color);
padding: 3px 6px;
border-radius: 12px;
color: var(--text-color);
backdrop-filter: blur(14px);
.selector {
color: var(--text-color);
}
}
}
.logs-wrapper {
display: flex;
gap: 6px;
position: relative;
// dummy
.bg-dummy{
background: var(--background-color-solid);
position: absolute;
z-index: -1;
}
.bg-dummy.left-top{
top: 1px;
left: 4px;
width: 60%;
height: 16px;
border-radius: 20px;
}
.bg-dummy.right-bottom{
right: 68px;
bottom: 0;
width: 20%;
height: 100%;
border-radius: 50%;
}
.log-container {
background: var(--background-color);
backdrop-filter: blur(20px);
border-radius: 12px;
@include flex-center;
overflow: hidden;
}
.logs-detail,
.version {
@include flex-center;
border-radius: 12px;
padding: 3px 6px;
height: 100%;
color: var(--text-color);
gap: 6px;
}
.logs-detail {
padding: 2px 12px;
cursor: pointer;
outline: 0 solid var(--border-color);
outline-offset: -1px;
.log-icon {
@include flex-center;
}
.log-message {
max-width: 40vw;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.version {
background: var(--background-color);
font-size: var(--font-size-tiny);
.icon {
@include flex-center;
}
}
.log {
background: var(--log-default-background-color);
outline-color: var(--default-text-color);
.log-message {
color: var(--default-text-color);
}
}
.info {
background: var(--log-info-background-color);
outline-color: var(--log-info-text-color);
.log-message {
color: var(--log-info-text-color);
}
}
.error {
background: var(--log-error-background-color);
outline-color: var(--log-error-text-color);
.log-message {
color: var(--log-error-text-color);
}
}
.warning {
background: var(--log-warn-background-color);
outline-color: var(--log-warn-text-color);
.log-message {
color: var(--log-warn-text-color);
}
}
.success {
background: var(--log-success-background-color);
.log-message {
color: var(--log-success-text-color);
}
}
}
}