|
@@ -1 +1,86 @@
|
|
|
-/* start */
|
|
|
+@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap');
|
|
|
+
|
|
|
+* {
|
|
|
+ font-family: 'Open Sans', sans-serif;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.sidebar {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ height: 400px;
|
|
|
+ width: 250;
|
|
|
+ color: #FFF;
|
|
|
+}
|
|
|
+.sidebar li {
|
|
|
+ list-style: none;
|
|
|
+}
|
|
|
+.nav-link {
|
|
|
+ text-decoration: none;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #479FF8;
|
|
|
+}
|
|
|
+.nav-item {
|
|
|
+ width: 246px;
|
|
|
+ height: 48px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ display: flex;
|
|
|
+ background-color: #FFF;
|
|
|
+ padding-left: 8px;
|
|
|
+ gap: 12px;
|
|
|
+ flex-shrink: 0;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.nav-item-active {
|
|
|
+ width: 246px;
|
|
|
+ height: 48px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ display: flex;
|
|
|
+ background-color: #479FF8;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 10px;
|
|
|
+ padding-left: 8px;
|
|
|
+ align-items: center;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.sidebar span {
|
|
|
+ margin-left: 12px;
|
|
|
+ text-align: center;
|
|
|
+ vertical-align: middle;
|
|
|
+ line-height: 48px;
|
|
|
+}
|
|
|
+.sidebar img {
|
|
|
+ vertical-align: middle;
|
|
|
+}
|
|
|
+.nav-arrow {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 72px;
|
|
|
+ height: 40px;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 6px;
|
|
|
+ border: 1px solid #D8D8D8;
|
|
|
+ background: #FFF;
|
|
|
+ box-shadow: 4px 5px 40px 0px #E5E5E5;
|
|
|
+ margin-top: 24px;
|
|
|
+ margin-left: 40px;
|
|
|
+}
|
|
|
+.border-arrow {
|
|
|
+ height: 40px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.arrow {
|
|
|
+ position: absolute;
|
|
|
+ margin: auto;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ color: #479FF8;
|
|
|
+}
|