Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit669b01c

Browse files
authored
Merge pull request#2 from lokesh-coder/develop
Customize color
2 parents2ac1fc2 +96e14ba commit669b01c

File tree

22 files changed

+377
-90
lines changed

22 files changed

+377
-90
lines changed

‎config/template.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -90,6 +90,10 @@
9090
<metaname="msapplication-TileColor"content="#ffffff"/>
9191
<metaname="msapplication-config"content="/favicons/browserconfig.xml"/>
9292
<metaname="theme-color"content="#ffffff"/>
93+
<link
94+
href="https://fonts.googleapis.com/css2?family=Manrope:wght@500;800&display=swap"
95+
rel="stylesheet"
96+
/>
9397
</head>
9498
<body>
9599
<divid="root"></div>

‎config/webpack.dev.config.js‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
1-
constwebpackBaseConfig=require('./webpack.base.config');
2-
constpaths=require('./paths');
1+
constwebpackBaseConfig=require("./webpack.base.config");
2+
constpaths=require("./paths");
33

44
module.exports={
5-
mode:'development',
6-
devtool:'eval-source-map',
7-
...webpackBaseConfig({plugins:[]}),
8-
devServer:{
9-
contentBase:paths.output,
10-
port:9000,
11-
hot:true,
12-
}
5+
mode:"development",
6+
devtool:"eval-source-map",
7+
...webpackBaseConfig({plugins:[]}),
8+
devServer:{
9+
contentBase:paths.output,
10+
port:9000,
11+
host:"0.0.0.0",
12+
hot:true,
13+
},
1314
};

‎package.json‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name":"blobs.app",
3-
"version":"1.0.0",
4-
"description":"Generate blob shapes for Web andFluttter",
3+
"version":"1.1.0",
4+
"description":"Generate blob shapes for Web andFlutter",
55
"main":"index.js",
66
"scripts": {
77
"build":"rm -rf build && NODE_ENV=production npm run build:css && webpack ---config ./config/webpack.prod.config.js",
@@ -23,12 +23,10 @@
2323
"@babel/preset-env":"^7.9.0",
2424
"@babel/preset-react":"^7.9.4",
2525
"@risingstack/react-easy-state":"^6.3.0",
26-
"animejs":"^3.2.0",
2726
"antd":"^4.2.4",
2827
"autoprefixer":"^9.7.6",
2928
"babel-loader":"^8.1.0",
3029
"dynamics.js":"^1.1.5",
31-
"kute.js":"^1.6.6",
3230
"postcss-cli":"^7.1.0",
3331
"prop-types":"^15.7.2",
3432
"react":"^16.13.1",

‎src/app.scss‎

Lines changed: 56 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
11
htmlbody {
2+
line-height:25px;
3+
font-family:"Manrope",-apple-system, BlinkMacSystemFont,"Segoe UI", Roboto,
4+
Oxygen, Ubuntu, Cantarell,"Open Sans","Helvetica Neue",sans-serif;
5+
button {
6+
line-height:25px;
7+
}
28
.brand-bg {
39
margin-top:-16px;
410
transform:translate(-50%,0);
@@ -9,8 +15,23 @@ html body {
915
max-width:500px;
1016
}
1117

12-
#blob {
13-
fill:#d1d8e0;
18+
.stroke {
19+
border:4pxsolid#d1d8e0;
20+
&.stroke-fill {
21+
position:relative;
22+
display:flex;
23+
align-items:center;
24+
justify-content:center;
25+
&:after {
26+
content:"";
27+
28+
width:100%;
29+
height:100%;
30+
transform:scale(0.7);
31+
border-radius:100%;
32+
background-color:#4a5568;
33+
}
34+
}
1435
}
1536

1637
.ant-slider-step {
@@ -49,7 +70,39 @@ html body {
4970

5071
.ant-popover-inner {
5172
max-width:300px;
52-
border-radius:4px;
73+
border-radius:10px;
74+
}
75+
76+
.ant-popover-arrow {
77+
display:none;
78+
}
79+
80+
.ant-popover-inner-content {
81+
padding:25px;
82+
background:rgba(207,214,222,0.15);
83+
}
84+
85+
input.ant-input {
86+
border-radius:6px;
87+
padding:9px;
88+
font-weight:bold;
89+
color:#828b99;
90+
border-color:#cfd8df;
91+
border-width:2px;
92+
}
93+
94+
.ant-input:hover {
95+
border-color:#4e566b;
96+
border-right-width:2px!important;
97+
}
98+
99+
.ant-input:focus,
100+
.ant-input-focused {
101+
border-color:#4c5468;
102+
border-right-width:2px!important;
103+
outline:0;
104+
-webkit-box-shadow:0002pxrgba(78,86,107,0.34);
105+
box-shadow:0002pxrgba(78,86,107,0.34);
53106
}
54107

55108
pre {

‎src/assets/css/main.css‎

Lines changed: 11 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -559,7 +559,7 @@ pre,
559559
code,
560560
kbd,
561561
samp {
562-
font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
562+
font-family:SFMono-Regular,Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
563563
}
564564

565565
/**
@@ -6431,16 +6431,8 @@ video {
64316431
clear: none;
64326432
}
64336433

6434-
.font-sans {
6435-
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
6436-
}
6437-
6438-
.font-serif {
6439-
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
6440-
}
6441-
6442-
.font-mono {
6443-
font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
6434+
.font-body {
6435+
font-family: Manrope;
64446436
}
64456437

64466438
.font-hairline {
@@ -26385,16 +26377,8 @@ video {
2638526377
clear: none;
2638626378
}
2638726379

26388-
.sm\:font-sans {
26389-
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
26390-
}
26391-
26392-
.sm\:font-serif {
26393-
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
26394-
}
26395-
26396-
.sm\:font-mono {
26397-
font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
26380+
.sm\:font-body {
26381+
font-family: Manrope;
2639826382
}
2639926383

2640026384
.sm\:font-hairline {
@@ -46338,16 +46322,8 @@ video {
4633846322
clear: none;
4633946323
}
4634046324

46341-
.md\:font-sans {
46342-
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
46343-
}
46344-
46345-
.md\:font-serif {
46346-
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
46347-
}
46348-
46349-
.md\:font-mono {
46350-
font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
46325+
.md\:font-body {
46326+
font-family: Manrope;
4635146327
}
4635246328

4635346329
.md\:font-hairline {
@@ -66291,16 +66267,8 @@ video {
6629166267
clear: none;
6629266268
}
6629366269

66294-
.lg\:font-sans {
66295-
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
66296-
}
66297-
66298-
.lg\:font-serif {
66299-
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
66300-
}
66301-
66302-
.lg\:font-mono {
66303-
font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
66270+
.lg\:font-body {
66271+
font-family: Manrope;
6630466272
}
6630566273

6630666274
.lg\:font-hairline {
@@ -86244,16 +86212,8 @@ video {
8624486212
clear: none;
8624586213
}
8624686214

86247-
.xl\:font-sans {
86248-
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
86249-
}
86250-
86251-
.xl\:font-serif {
86252-
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
86253-
}
86254-
86255-
.xl\:font-mono {
86256-
font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
86215+
.xl\:font-body {
86216+
font-family: Manrope;
8625786217
}
8625886218

8625986219
.xl\:font-hairline {

‎src/components/actions/flutterCopy.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Button from "../common/button";
44
import{appStore}from"../../store";
55
importModalfrom"../common/modal";
66
importHighlightfrom"../common/highlight";
7-
importCopyfrom"../common/copy";
7+
importCopyfrom"../common/copy";
88

99
constFlutterCopy=view(({ onClose})=>{
1010
const[isModalOpen,openModal]=useState(false);

‎src/components/actions/svgCopy.jsx‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,17 +4,15 @@ import Button from "../common/button";
44
import{appStore}from"../../store";
55
importModalfrom"../common/modal";
66
importHighlightfrom"../common/highlight";
7-
importCopyfrom"../common/copy";
7+
importCopyfrom"../common/copy";
88
importDownloadfrom"../common/download";
9+
importformatterfrom"../../services/formatter";
910

1011
constSVGCopy=view(({ onClose})=>{
1112
const[isModalOpen,openModal]=useState(false);
1213
constID=`${appStore.edges}-${appStore.growth}-${appStore.id}`;
13-
constcode=`
14-
<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">
15-
<path d="${appStore.path}"></path>
16-
</svg>
17-
`;
14+
constsvgEl=document.getElementById("blobSvg");
15+
constcode=svgEl ?formatter(svgEl.outerHTML) :"";
1816
return(
1917
<>
2018
<Button

‎src/components/blob.jsx‎

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,36 @@ import { appStore } from "../store";
44

55
constBlob=view(()=>{
66
constsize=appStore.size;
7+
letprops={
8+
fill:appStore.color,
9+
};
10+
if(appStore.type=="gradient"){
11+
props.fill="url(#gradient)";
12+
}
13+
if(appStore.stroke){
14+
props.strokeWidth="7px";
15+
props.fill="none";
16+
props.stroke=appStore.color;
17+
}
18+
if(appStore.type=="gradient"&&appStore.stroke){
19+
props.stroke="url(#gradient)";
20+
}
721
return(
822
<svg
923
viewBox={`0 0${size}${size}`}
1024
xmlns="http://www.w3.org/2000/svg"
1125
width={`100%`}
1226
id="blobSvg"
1327
>
14-
<pathid="blob"d={appStore.path}/>
28+
{appStore.type=="gradient"&&(
29+
<defs>
30+
<linearGradientid="gradient"x1="0%"y1="0%"x2="0%"y2="100%">
31+
<stopoffset="0%"style={{stopColor:appStore.gradient[0]}}/>
32+
<stopoffset="100%"style={{stopColor:appStore.gradient[1]}}/>
33+
</linearGradient>
34+
</defs>
35+
)}
36+
<pathid="blob"d={appStore.path}{...props}/>
1537
</svg>
1638
);
1739
});

‎src/components/common/button.jsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,7 @@ export default function Button({
1010
}){
1111
letclassNames="";
1212
if(isPrimary){
13-
classNames=
14-
"shadow-lg bg-theme-400 text-white hover:bg-theme-900 transition duration-200 ease-in-out transform active:shadow-2xl active:translate-y-1";
13+
classNames="shadow-lg bg-theme-400 text-white hover:bg-theme-900";
1514
}else{
1615
classNames="text-theme-600";
1716
}
File renamed without changes.

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp