rooty/fab-manager
1
0
Fork 0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2025-02-26 20:54:21 +01:00
Code Issues Releases Activity

(ui) fix colors

Browse Source
This commit is contained in:
vincent 2022-10-13 16:38:32 +02:00
parent 5de91acf88
commit 6383b2ed80
14 changed files with 26 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/frontend/src/javascript/components/form/form-checklist.tsx
View File

@ -98,8 +98,8 @@ export const FormChecklist = <TFieldValues extends FieldValues, TOptionValue, TC
})}
</div>
<div className="actions">
<FabButton type="button" onClick={selectAll(onChange)} className="is-info">{t('app.shared.form_checklist.select_all')}</FabButton>
<FabButton type="button" onClick={unselectAll(onChange)} className="is-info">{t('app.shared.form_checklist.unselect_all')}</FabButton>
<FabButton type="button" onClick={selectAll(onChange)} className="is-secondary">{t('app.shared.form_checklist.select_all')}</FabButton>
<FabButton type="button" onClick={unselectAll(onChange)} className="is-secondary">{t('app.shared.form_checklist.unselect_all')}</FabButton>
</div>
</>
);

2
app/frontend/src/javascript/components/store/filters/categories-filter.tsx
View File

@ -64,7 +64,7 @@ export const CategoriesFilter: React.FC<CategoriesFilterProps> = ({ productCateg
</label>
))}
</div>
<FabButton onClick={() => onApplyFilters(selectedCategories)} className="is-info">{t('app.admin.store.categories_filter.filter_apply')}</FabButton>
<FabButton onClick={() => onApplyFilters(selectedCategories)} className="is-secondary">{t('app.admin.store.categories_filter.filter_apply')}</FabButton>
</div>
</AccordionItem>
</>

2
app/frontend/src/javascript/components/store/filters/keyword-filter.tsx
View File

@ -54,7 +54,7 @@ export const KeywordFilter: React.FC<KeywordFilterProps> = ({ onApplyFilters, cu
<div className="content">
<div className="group">
<input type="text" onChange={event => handleKeywordTyping(event)} value={keyword} />
<FabButton onClick={() => onApplyFilters(keyword || undefined)} className="is-info">{t('app.admin.store.keyword_filter.filter_apply')}</FabButton>
<FabButton onClick={() => onApplyFilters(keyword || undefined)} className="is-secondary">{t('app.admin.store.keyword_filter.filter_apply')}</FabButton>
</div>
</div>
</AccordionItem>

2
app/frontend/src/javascript/components/store/filters/machines-filter.tsx
View File

@ -76,7 +76,7 @@ export const MachinesFilter: React.FC<MachinesFilterProps> = ({ allMachines, onE
</label>
))}
</div>
<FabButton onClick={() => onApplyFilters(selectedMachines)} className="is-info">{t('app.admin.store.machines_filter.filter_apply')}</FabButton>
<FabButton onClick={() => onApplyFilters(selectedMachines)} className="is-secondary">{t('app.admin.store.machines_filter.filter_apply')}</FabButton>
</div>
</AccordionItem>
</>

2
app/frontend/src/javascript/components/store/filters/stock-filter.tsx
View File

@ -83,7 +83,7 @@ export const StockFilter: React.FC<StockFilterProps> = ({ onApplyFilters, curren
defaultValue={0}
type="number" />
</div>
<FabButton type="submit" className="is-info">{t('app.admin.store.stock_filter.filter_apply')}</FabButton>
<FabButton type="submit" className="is-secondary">{t('app.admin.store.stock_filter.filter_apply')}</FabButton>
</div>
</form>
</AccordionItem>

8
app/frontend/src/javascript/components/store/orders.tsx
View File

@ -274,7 +274,7 @@ const Orders: React.FC<OrdersProps> = ({ currentUser, onError }) => {
<div className='content'>
<div className="group">
<input type="text" value={reference} onChange={(event) => handleReferenceChanged(event.target.value)}/>
<FabButton onClick={applyFilters('reference')} className="is-info">{t('app.admin.store.orders.filter_apply')}</FabButton>
<FabButton onClick={applyFilters('reference')} className="is-secondary">{t('app.admin.store.orders.filter_apply')}</FabButton>
</div>
</div>
</AccordionItem>
@ -292,7 +292,7 @@ const Orders: React.FC<OrdersProps> = ({ currentUser, onError }) => {
</label>
))}
</div>
<FabButton onClick={applyFilters('states')} className="is-info">{t('app.admin.store.orders.filter_apply')}</FabButton>
<FabButton onClick={applyFilters('states')} className="is-secondary">{t('app.admin.store.orders.filter_apply')}</FabButton>
</div>
</AccordionItem>
<AccordionItem id={2}
@ -303,7 +303,7 @@ const Orders: React.FC<OrdersProps> = ({ currentUser, onError }) => {
<div className='content'>
<div className="group">
<MemberSelect noHeader value={user as User} onSelected={handleSelectMember} />
<FabButton onClick={applyFilters('user')} className="is-info">{t('app.admin.store.orders.filter_apply')}</FabButton>
<FabButton onClick={applyFilters('user')} className="is-secondary">{t('app.admin.store.orders.filter_apply')}</FabButton>
</div>
</div>
</AccordionItem>
@ -328,7 +328,7 @@ const Orders: React.FC<OrdersProps> = ({ currentUser, onError }) => {
defaultValue={periodTo}
type="date" />
</div>
<FabButton onClick={applyFilters('period')} className="is-info">{t('app.admin.store.orders.filter_apply')}</FabButton>
<FabButton onClick={applyFilters('period')} className="is-secondary">{t('app.admin.store.orders.filter_apply')}</FabButton>
</div>
</div>
</AccordionItem>

4
app/frontend/src/javascript/components/store/product-form.tsx
View File

@ -349,7 +349,7 @@ export const ProductForm: React.FC<ProductFormProps> = ({ product, title, onSucc
</div>
<FabButton
onClick={addProductImage}
className='is-info'
className='is-secondary'
icon={<Plus size={24} />}>
{t('app.admin.store.product_form.add_product_image')}
</FabButton>
@ -422,7 +422,7 @@ export const ProductForm: React.FC<ProductFormProps> = ({ product, title, onSucc
</div>
<FabButton
onClick={addProductFile}
className='is-info'
className='is-secondary'
icon={<Plus size={24} />}>
{t('app.admin.store.product_form.add_product_file')}
</FabButton>

3
app/frontend/src/stylesheets/modules/base/fab-button.scss
View File

@ -66,6 +66,9 @@
&.is-info {
@include colorVariant(var(--information), var(--gray-soft-lightest));
}
&.is-secondary {
@include colorVariant(var(--secondary), var(--gray-hard-darkest));
}
&.is-black {
@include colorVariant(var(--gray-hard-darkest), var(--gray-soft-lightest));
}

4
app/frontend/src/stylesheets/modules/cart/store-cart.scss
View File

@ -200,7 +200,7 @@
align-items: center;
span { @include title-base; }
}
.gift { color: var(--information); }
.gift { color: var(--gray-hard-dark); }
}
.total {
display: flex;
@ -214,7 +214,7 @@
width: 100%;
height: auto;
padding: 1.6rem 0.8rem;
background-color: var(--information);
background-color: var(--main);
border: none;
color: var(--gray-soft-lightest);
justify-content: center;

2
app/frontend/src/stylesheets/modules/store/orders.scss
View File

@ -125,7 +125,7 @@
align-items: center;
span { @include title-base; }
}
.gift { color: var(--information); }
.gift { color: var(--gray-hard-dark); }
.total {
padding: 1.6rem 0 0;
align-items: flex-start;

2
app/frontend/src/stylesheets/modules/store/product-categories.scss
View File

@ -58,7 +58,7 @@
margin-left: 2.4rem;
@include text-sm;
font-weight: 500;
color: var(--information);
color: var(--gray-hard-dark);
}
}

4
app/frontend/src/stylesheets/modules/store/store-filters.scss
View File

@ -47,7 +47,7 @@
span {
margin-left: 0.8rem;
@include text-xs;
color: var(--information);
color: var(--gray-hard-dark);
}
}
.parent {
@ -58,7 +58,7 @@
}
&.is-active > p {
@include text-base(600);
color: var(--information);
color: var(--primary);
.children {
max-height: 1000px;
}

4
app/frontend/src/stylesheets/modules/store/store-list.scss
View File

@ -12,9 +12,9 @@
padding-left: 1.6rem;
display: flex;
align-items: center;
background-color: var(--information-light);
background-color: var(--secondary-light);
border-radius: 100px;
color: var(--information-dark);
color: var(--gray-hard-dark);
overflow: hidden;
p { margin: 0; }
button {

6
app/frontend/src/stylesheets/modules/store/store.scss
View File

@ -21,7 +21,7 @@
color: var(--gray-hard-darkest);
}
li:last-of-type:not(:first-of-type) span {
color: var(--information);
color: var(--gray-hard-dark);
}
span {
color: var(--gray-hard-light);
@ -137,12 +137,12 @@
content: '';
width: 100%;
height: 1px;
background-color: var(--information);
background-color: var(--gray-hard-dark);
z-index: -1;
}
span {
padding: 0 1.6rem;
color: var(--information);
color: var(--gray-hard-dark);
background-color: var(--gray-soft-lightest);
}
}