source: CSS/AddProduct.css

Last change on this file was e3d4e0a, checked in by Vlado 222039 <vlado.popovski@…>, 6 days ago

Upload project files

  • Property mode set to 100644
File size: 2.0 KB
Line 
1body {
2 font-family: Arial, sans-serif;
3 background-color: #f4f4f4;
4 margin: 0;
5 padding: 0;
6}
7
8.container {
9 max-width: 600px;
10 margin: 50px auto;
11 padding: 20px;
12 background-color: #fff;
13 box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
14 border-radius: 8px;
15}
16
17.productinfo {
18 display: grid;
19 grid-template-columns: 1fr 2fr;
20 gap: 15px;
21}
22
23.productinfo label {
24 align-self: center;
25 font-weight: bold;
26}
27
28.productinfo input[type="text"],
29.productinfo input[type="number"],
30.productinfo select,
31.productinfo textarea {
32 width: 100%;
33 padding: 10px;
34 border: 1px solid #ccc;
35 border-radius: 4px;
36 background-color: #f9f9f9;
37 box-sizing: border-box;
38 font-size: 16px;
39}
40
41.productinfo textarea {
42 resize: vertical;
43 height: 100px;
44}
45
46.productinfo input[type="file"] {
47 border: none;
48 padding: 5px;
49 background-color: #f9f9f9;
50}
51
52.productinfo input[type="file"]:nth-child(odd) {
53 margin-bottom: 10px;
54}
55
56.productinfo input[type="file"]:nth-child(even) {
57 margin-bottom: 10px;
58}
59
60@media screen and (max-width: 600px) {
61 .productinfo {
62 grid-template-columns: 1fr;
63 }
64
65 .productinfo label {
66 margin-bottom: 5px;
67 }
68
69 .productinfo input[type="file"] {
70 margin-bottom: 15px;
71 }
72}
73
74/*======================*/
75ul, #myUL {
76 list-style-type: none;
77 }
78
79#myUL {
80 margin: 0;
81 padding: 0;
82}
83
84.opisList {
85 cursor: pointer;
86 -webkit-user-select: none;
87 user-select: none;
88}
89
90.opisList::before {
91 content: "\25B6";
92 color: black;
93 display: inline-block;
94 margin-right: 6px;
95}
96
97.opisList-down::before {
98 transform: rotate(90deg);
99}
100
101.nested {
102 display: none;
103}
104
105.active {
106 display: block;
107}
108
109.toggle-input {
110 margin-right: 10px;
111}
112
113.text-field {
114 display: none;
115 margin-top: 5px;
116 margin-left: 20px;
117}
118
119.toggle-input:checked + .text-field {
120 display: inline-block;
121}
122
123.btn-new-product {
124 padding: 20px 10px;
125 border: none;
126 width: 400px;
127 margin-top: 40px;
128 margin-left: 50%;
129 transform: translateX(-50%);
130}
Note: See TracBrowser for help on using the repository browser.