Skip to content

Commit 6afd40c

Browse files
nsh07nsh07
committed
feat: Add basic layout and details
1 parent 23265e2 commit 6afd40c

File tree

11 files changed

+229
-13
lines changed

11 files changed

+229
-13
lines changed

‎composeApp/src/wasmJsMain/composeResources/drawable/email.xml‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:width="24dp"
3+
android:height="24dp"
4+
android:viewportWidth="960"
5+
android:viewportHeight="960">
6+
<path
7+
android:pathData="M480,880q-83,0 -156,-31.5T197,763q-54,-54 -85.5,-127T80,480q0,-83 31.5,-156T197,197q54,-54 127,-85.5T480,80q83,0 156,31.5T763,197q54,54 85.5,127T880,480v58q0,59 -40.5,100.5T740,680q-35,0 -66,-15t-52,-43q-29,29 -65.5,43.5T480,680q-83,0 -141.5,-58.5T280,480q0,-83 58.5,-141.5T480,280q83,0 141.5,58.5T680,480v58q0,26 17,44t43,18q26,0 43,-18t17,-44v-58q0,-134 -93,-227t-227,-93q-134,0 -227,93t-93,227q0,134 93,227t227,93h160q17,0 28.5,11.5T680,840q0,17 -11.5,28.5T640,880L480,880ZM480,600q50,0 85,-35t35,-85q0,-50 -35,-85t-85,-35q-50,0 -85,35t-35,85q0,50 35,85t85,35Z"
8+
android:fillColor="#e3e3e3"/>
9+
</vector>

‎composeApp/src/wasmJsMain/composeResources/drawable/forklift.xml‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:width="48dp"
3+
android:height="48dp"
4+
android:viewportWidth="960"
5+
android:viewportHeight="960">
6+
<path
7+
android:pathData="M150,830q-45.83,0 -77.92,-32.08Q40,765.83 40,720q0,-24.58 10.5,-46.79T80,635v-165q0,-12.75 8.63,-21.38Q97.25,440 110,440h50v-210q0,-12.75 8.63,-21.38Q177.25,200 190,200h238q18.38,0 33.69,9.5Q477,219 484,236l170,400q7,15 11.5,30.95Q670,682.91 670,700q0,53.86 -38.07,91.93Q593.86,830 540,830q-38.76,0 -71.38,-22T420,750L256,750q-10,35 -39.5,57.5T150,830ZM890,790L770,790q-12.75,0 -21.37,-8.63Q740,772.75 740,760v-570q0,-12.75 8.68,-21.38 8.67,-8.62 21.5,-8.62 12.82,0 21.32,8.62 8.5,8.63 8.5,21.38v540h90q12.75,0 21.38,8.68 8.62,8.67 8.62,21.5 0,12.82 -8.62,21.32 -8.63,8.5 -21.38,8.5ZM149.82,770q21.18,0 35.68,-14.32 14.5,-14.33 14.5,-35.5 0,-21.18 -14.32,-35.68 -14.33,-14.5 -35.5,-14.5 -21.18,0 -35.68,14.32 -14.5,14.33 -14.5,35.5 0,21.18 14.32,35.68 14.33,14.5 35.5,14.5ZM539.88,770q29.12,0 49.62,-20.38 20.5,-20.38 20.5,-49.5t-20.38,-49.62q-20.38,-20.5 -49.5,-20.5t-49.62,20.38q-20.5,20.38 -20.5,49.5t20.38,49.62q20.38,20.5 49.5,20.5ZM343,569h217L429,260L220,260v180l123,129Z"
8+
android:fillColor="#e3e3e3"/>
9+
</vector>

‎composeApp/src/wasmJsMain/composeResources/drawable/github.xml‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:width="98dp"
3+
android:height="96dp"
4+
android:viewportWidth="98"
5+
android:viewportHeight="96">
6+
<path
7+
android:pathData="M48.854,0C21.839,0 0,22 0,49.217c0,21.756 13.993,40.172 33.405,46.69 2.427,0.49 3.316,-1.059 3.316,-2.362 0,-1.141 -0.08,-5.052 -0.08,-9.127 -13.59,2.934 -16.42,-5.867 -16.42,-5.867 -2.184,-5.704 -5.42,-7.17 -5.42,-7.17 -4.448,-3.015 0.324,-3.015 0.324,-3.015 4.934,0.326 7.523,5.052 7.523,5.052 4.367,7.496 11.404,5.378 14.235,4.074 0.404,-3.178 1.699,-5.378 3.074,-6.6 -10.839,-1.141 -22.243,-5.378 -22.243,-24.283 0,-5.378 1.94,-9.778 5.014,-13.2 -0.485,-1.222 -2.184,-6.275 0.486,-13.038 0,0 4.125,-1.304 13.426,5.052a46.97,46.97 0,0 1,12.214 -1.63c4.125,0 8.33,0.571 12.213,1.63 9.302,-6.356 13.427,-5.052 13.427,-5.052 2.67,6.763 0.97,11.816 0.485,13.038 3.155,3.422 5.015,7.822 5.015,13.2 0,18.905 -11.404,23.06 -22.324,24.283 1.78,1.548 3.316,4.481 3.316,9.126 0,6.6 -0.08,11.897 -0.08,13.526 0,1.304 0.89,2.853 3.316,2.364 19.412,-6.52 33.405,-24.935 33.405,-46.691C97.707,22 75.788,0 48.854,0z"
8+
android:fillColor="#24292f"
9+
android:fillType="evenOdd"/>
10+
</vector>

‎composeApp/src/wasmJsMain/composeResources/drawable/gitlab.xml‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:viewportWidth="24"
3+
android:viewportHeight="24"
4+
android:width="24dp"
5+
android:height="24dp">
6+
<path
7+
android:pathData="M23.601421 9.5931158l-0.03374 -0.08623 -3.266715 -8.52540584a0.85104538 0.85104095 0 0 0 -0.336169 -0.4049006 0.87478968 0.87478513 0 0 0 -0.99976 0.053737 0.87478968 0.87478513 0 0 0 -0.28993 0.43989194L16.469385 7.8185518H7.5377818L5.3320621 1.0702092A0.85729387 0.8572894 0 0 0 5.0421318 0.62906756 0.87478968 0.87478513 0 0 0 4.0423722 0.57533066 0.85854356 0.85853909 0 0 0 3.706203 0.98023126l-3.27296311 8.52165754 -0.032492 0.08623A6.0660416 6.06601 0 0 0 2.4127642 16.598897l0.011247 0.0087 0.029993 0.02125 4.9763035 3.726584 2.4619085 1.863293 1.4996388 1.132221a1.0085076 1.0085023 0 0 0 1.219707 0l1.49964 -1.132221 2.461908 -1.863293 5.006297 -3.749079 0.0125 -0.01a6.068541 6.0685094 0 0 0 2.009514 -7.0032802z"
8+
android:fillColor="#171321"/>
9+
</vector>

‎composeApp/src/wasmJsMain/composeResources/drawable/linkedin.xml‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:viewportWidth="72"
3+
android:viewportHeight="72"
4+
android:width="72dp"
5+
android:height="72dp">
6+
<path
7+
android:pathData="M8 0C3.581722 0 0 3.581722 0 8L0 64C0 68.418278 3.581722 72 8 72L64 72C68.418278 72 72 68.418278 72 64L72 8C72 3.581722 68.418278 0 64 0L8 0zM16.349609 10C19.856901 10 22.697266 12.863834 22.697266 16.396484C22.697266 19.929134 19.856901 22.794922 16.349609 22.794922C12.842317 22.794922 10 19.929134 10 16.396484C10 12.863834 12.842317 10 16.349609 10zM49.382812 26.273438C56.735937 26.273438 62 30.76404 62 40.050781L62 62L51.316406 62L51.316406 43.802734C51.316406 38.813373 49.419792 36.025391 45.470703 36.025391C41.174609 36.025391 38.929687 38.926729 38.929688 43.802734L38.929688 62L28.632812 62L28.632812 27.333984L38.929688 27.333984L38.929688 32.001953C38.929688 32.001953 42.026302 26.273438 49.382812 26.273438zM11.033203 27.333984L21.769531 27.333984L21.769531 62L11.033203 62L11.033203 27.333984z"
8+
android:fillType="evenOdd"
9+
android:fillColor="#E3E3E3"/>
10+
</vector>

‎composeApp/src/wasmJsMain/composeResources/font/inter_variable.ttf‎

843 KB
Binary file not shown.

‎composeApp/src/wasmJsMain/composeResources/font/nunito_variable.ttf‎

-269 KB
Binary file not shown.

‎composeApp/src/wasmJsMain/kotlin/org/nsh07/nsh07/App.kt‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,28 @@
11
package org.nsh07.nsh07
22

33
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.Box
45
import androidx.compose.foundation.layout.fillMaxSize
56
import androidx.compose.material3.MaterialTheme.colorScheme
67
import androidx.compose.material3.Surface
78
import androidx.compose.runtime.Composable
9+
import androidx.compose.ui.Alignment
810
import androidx.compose.ui.Modifier
911
import org.nsh07.nsh07.ui.AppScreen
1012
import org.nsh07.nsh07.ui.theme.Nsh07Theme
1113

1214
@Composable
1315
fun App() {
1416
Nsh07Theme {
15-
Surface(color = colorScheme.primaryContainer) {
16-
AppScreen(modifier = Modifier.background(colorScheme.surface).fillMaxSize())
17+
Surface {
18+
Box(
19+
contentAlignment = Alignment.Center,
20+
modifier = Modifier.background(colorScheme.surface).fillMaxSize()
21+
) {
22+
AppScreen(
23+
modifier = Modifier.fillMaxSize()
24+
)
25+
}
1726
}
1827
}
1928
}

‎composeApp/src/wasmJsMain/kotlin/org/nsh07/nsh07/ui/AppScreen.kt‎

Lines changed: 121 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,134 @@
11
package org.nsh07.nsh07.ui
22

3-
import androidx.compose.foundation.layout.Box
4-
import androidx.compose.foundation.layout.padding
3+
import androidx.compose.foundation.layout.*
4+
import androidx.compose.material3.Icon
5+
import androidx.compose.material3.IconButton
6+
import androidx.compose.material3.MaterialTheme.colorScheme
57
import androidx.compose.material3.MaterialTheme.typography
68
import androidx.compose.material3.Text
79
import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
8-
import androidx.compose.runtime.Composable
10+
import androidx.compose.runtime.*
11+
import androidx.compose.ui.Alignment
912
import androidx.compose.ui.Modifier
1013
import androidx.compose.ui.unit.dp
14+
import androidx.compose.ui.unit.sp
15+
import nsh07.composeapp.generated.resources.*
16+
import org.jetbrains.compose.resources.painterResource
17+
import org.jetbrains.compose.ui.tooling.preview.Preview
18+
import org.nsh07.nsh07.ui.theme.Nsh07Theme
1119

1220
@OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
1321
@Composable
1422
fun AppScreen(modifier: Modifier = Modifier) {
15-
Box(modifier = modifier) {
16-
Text(
17-
"Nishant Mishra",
18-
style = typography.displayLarge,
19-
modifier = Modifier.padding(32.dp)
20-
)
23+
var selectedItem by remember { mutableStateOf(0) }
24+
Row(
25+
modifier = Modifier
26+
.padding(start = 32.dp, end = 48.dp)
27+
.widthIn(max = 1200.dp)
28+
.then(modifier)
29+
) {
30+
Column(Modifier.padding(vertical = 96.dp).weight(1f)) {
31+
Text(
32+
"Nishant Mishra",
33+
style = typography.displayLarge.copy(fontSize = 48.sp),
34+
color = colorScheme.onSurface,
35+
modifier = Modifier.padding(start = 20.dp)
36+
)
37+
Spacer(Modifier.height(4.dp))
38+
Text(
39+
"Mobile app developer",
40+
style = typography.titleLarge,
41+
color = colorScheme.onSurface,
42+
modifier = Modifier.padding(start = 20.dp)
43+
)
44+
Spacer(Modifier.height(20.dp))
45+
Text(
46+
"I build performant, beautiful apps for mobile phones.",
47+
style = typography.bodyLarge,
48+
color = colorScheme.onSurfaceVariant,
49+
modifier = Modifier.padding(start = 20.dp)
50+
)
51+
52+
Spacer(Modifier.height(72.dp))
53+
54+
NavigationItem(
55+
selected = selectedItem == 0,
56+
onClick = { selectedItem = 0 },
57+
label = { Text("About", style = typography.bodyMedium) },
58+
)
59+
NavigationItem(
60+
selected = selectedItem == 1,
61+
onClick = { selectedItem = 1 },
62+
label = { Text("Experience", style = typography.bodyMedium) },
63+
)
64+
NavigationItem(
65+
selected = selectedItem == 2,
66+
onClick = { selectedItem = 2 },
67+
label = { Text("Projects", style = typography.bodyMedium) },
68+
)
69+
70+
Spacer(Modifier.weight(1f))
71+
72+
Spacer(Modifier.padding(top = 32.dp))
73+
74+
Row(
75+
horizontalArrangement = Arrangement.spacedBy(4.dp),
76+
verticalAlignment = Alignment.CenterVertically,
77+
modifier = Modifier.padding(start = 20.dp)
78+
) {
79+
IconButton(onClick = {}) {
80+
Icon(
81+
painterResource(Res.drawable.github),
82+
contentDescription = null,
83+
modifier = Modifier.size(24.dp)
84+
)
85+
}
86+
IconButton(onClick = {}) {
87+
Icon(
88+
painterResource(Res.drawable.gitlab),
89+
contentDescription = null,
90+
modifier = Modifier.size(24.dp)
91+
)
92+
}
93+
IconButton(onClick = {}) {
94+
Icon(
95+
painterResource(Res.drawable.linkedin),
96+
contentDescription = null,
97+
modifier = Modifier.size(24.dp)
98+
)
99+
}
100+
IconButton(onClick = {}) {
101+
Icon(
102+
painterResource(Res.drawable.email),
103+
contentDescription = null,
104+
modifier = Modifier.size(24.dp)
105+
)
106+
}
107+
}
108+
}
109+
110+
Spacer(Modifier.width(16.dp))
111+
112+
Column(
113+
horizontalAlignment = Alignment.CenterHorizontally,
114+
verticalArrangement = Arrangement.Center,
115+
modifier = Modifier.fillMaxHeight().padding(vertical = 96.dp).weight(1f)
116+
) {
117+
Icon(
118+
painterResource(Res.drawable.forklift),
119+
null,
120+
modifier = Modifier.size(64.dp)
121+
)
122+
Spacer(Modifier.height(16.dp))
123+
Text("Work in progress", style = typography.headlineSmall)
124+
}
125+
}
126+
}
127+
128+
@Preview(widthDp = 1920, heightDp = 1080)
129+
@Composable
130+
fun AppScreenPreview() {
131+
Nsh07Theme {
132+
AppScreen()
21133
}
22134
}

‎composeApp/src/wasmJsMain/kotlin/org/nsh07/nsh07/ui/NavigationItem.kt‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
package org.nsh07.nsh07.ui
2+
3+
import androidx.compose.animation.core.animateDpAsState
4+
import androidx.compose.foundation.interaction.MutableInteractionSource
5+
import androidx.compose.foundation.layout.Box
6+
import androidx.compose.foundation.layout.height
7+
import androidx.compose.foundation.layout.width
8+
import androidx.compose.material3.*
9+
import androidx.compose.runtime.Composable
10+
import androidx.compose.runtime.getValue
11+
import androidx.compose.ui.Alignment
12+
import androidx.compose.ui.Modifier
13+
import androidx.compose.ui.unit.dp
14+
15+
@Composable
16+
fun NavigationItem(
17+
selected: Boolean,
18+
onClick: () -> Unit,
19+
label: @Composable (() -> Unit)?,
20+
modifier: Modifier = Modifier,
21+
railExpanded: Boolean = true,
22+
enabled: Boolean = true,
23+
iconPosition: NavigationItemIconPosition = WideNavigationRailItemDefaults.iconPositionFor(railExpanded),
24+
colors: NavigationItemColors = WideNavigationRailItemDefaults.colors(),
25+
interactionSource: MutableInteractionSource? = null
26+
) {
27+
val lineWidth by animateDpAsState(if (selected) 64.dp else 32.dp)
28+
29+
WideNavigationRailItem(
30+
selected = selected,
31+
onClick = onClick,
32+
icon = {
33+
Box(
34+
contentAlignment = Alignment.Center,
35+
modifier = Modifier.height(24.dp)
36+
) {
37+
HorizontalDivider(modifier = Modifier.width(lineWidth), color = colors.iconColor(selected, enabled))
38+
}
39+
},
40+
label = label,
41+
railExpanded = railExpanded,
42+
modifier = modifier,
43+
enabled = enabled,
44+
interactionSource = interactionSource,
45+
colors = colors,
46+
iconPosition = iconPosition
47+
)
48+
}

0 commit comments

Comments
 (0)