mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-31 10:40:10 +02:00
Code Issues Releases Wiki Activity

style fixes

Browse Source
This commit is contained in:
Kushagra Gour
2024-03-29 18:20:28 +05:30
parent b9ba819de2
commit 3f93fc8af6
5 changed files with 44 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/CreateNewModal.jsx
View File

@@ -169,6 +169,7 @@ export class CreateNewModal extends Component {
item={template} item={template}
focusable focusable
onClick={onTemplateSelect.bind(null, template, false)} onClick={onTemplateSelect.bind(null, template, false)}
hasOptions={false}
/> />
); );
})} })}

55
src/components/ItemTile.jsx
View File

@@ -11,7 +11,8 @@ export function ItemTile({
onRemoveBtnClick, onRemoveBtnClick,
onToggleVisibilityBtnClick, onToggleVisibilityBtnClick,
focusable, focusable,
inline inline,
hasOptions = true
}) { }) {
return ( return (
<div <div
@@ -58,7 +59,7 @@ export function ItemTile({
</div> </div>
<div className="flex flex-v-center"> <div className="flex flex-v-center">
{item.img ? ( {item.img ? (
<div> <div class="d-f">
<img <img
class="saved-item-tile__img" class="saved-item-tile__img"
height="40" height="40"
@@ -82,30 +83,32 @@ export function ItemTile({
</div> </div>
) : null} ) : null}
</div> </div>
<div class="saved-item-tile__meta"> {hasOptions && (
<HStack justify="space-between"> <div class="saved-item-tile__meta">
<div> <HStack justify="space-between">
{item.updatedOn ? ( <div>
<> {item.updatedOn ? (
Last updated:{' '} <>
<time dateTime={item.updatedOn}> Last updated:{' '}
{getHumanDate(item.updatedOn)} <time dateTime={item.updatedOn}>
</time> {getHumanDate(item.updatedOn)}
</> </time>
) : null} </>
</div> ) : null}
<div> </div>
<Stack gap={1} align="center"> <div>
<Icon <Stack gap={1} align="center">
size="16" <Icon
color="currentColor" size="16"
name={item.isPublic ? 'eye' : 'eye-striked'} color="currentColor"
/> name={item.isPublic ? 'eye' : 'eye-striked'}
{item.isPublic ? 'Public' : ''} />
</Stack> {item.isPublic ? 'Public' : ''}
</div> </Stack>
</HStack> </div>
</div> </HStack>
</div>
)}
</div> </div>
); );
} }

2
src/components/ProBadge.jsx
View File

@@ -1,3 +1,3 @@
export const ProBadge = () => { export const ProBadge = () => {
return <div className="pro-badge">PRO</div>; return <div className="badge pro-badge">PRO</div>;
}; };

2
src/components/common.jsx
View File

@@ -42,5 +42,5 @@ export function Divider(props) {
} }
export function BetaTag() { export function BetaTag() {
return <span class="beta-tag">Beta</span>; return <span class="badge beta-tag">Beta</span>;
} }

26
src/style.css
View File

@@ -1697,16 +1697,6 @@ body > #demo-frame {
display: inline-block; display: inline-block;
} }
.beta-tag {
border-radius: 4px;
text-transform: uppercase;
background: #c68955;
color: white;
letter-spacing: 0.6px;
padding: 2px 5px;
font-size: 0.9em;
}
.is-extension .web-maker-with-tag:after { .is-extension .web-maker-with-tag:after {
display: none; display: none;
} }
@@ -2184,18 +2174,26 @@ while the theme CSS file is loading */
.stack > * { .stack > * {
margin: 0; margin: 0;
} }
.badge {
.pro-badge { text-transform: uppercase;
display: inline-block; display: inline-block;
padding: 0.1rem 0.3rem; padding: 0.1rem 0.3rem;
background: linear-gradient(45deg, var(--color-pro-1), var(--color-pro-2)); background: crimson;
border-radius: 1rem; border-radius: 1rem;
font-size: 0.7em; font-size: 0.7em;
color: #222; color: #222;
box-shadow: inset 2px 2px 3px rgba(0, 0, 0, 0.3);
font-weight: 800; font-weight: 800;
line-height: 1; line-height: 1;
} }
.beta-tag {
background: #ee9d59;
}
.pro-badge {
display: inline-block;
background: linear-gradient(45deg, var(--color-pro-1), var(--color-pro-2));
color: #222;
box-shadow: inset 2px 2px 3px rgba(0, 0, 0, 0.3);
}
.templates-container { .templates-container {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;