OSDN -- Desenvolver e Download de Software Open Source
Estado tradução de Português translation status for pt
  • R/O
  • SSH
  • HTTPS

catalpa: Commit


Commit MetaInfo

Revisão116 (tree)
Hora2022-10-07 20:41:11
Autorhirukawa_ryo

Mensagem de Log

* catalpa 0.9.1
samples の blog1 で {.card}、{.card .landscape} を使うと正しく表示されないバグを修正しました。
markdown.css の .card と blog.css の .card が衝突していたのが原因でした。衝突を避けるために blog.css の .card を .blog-card に変更しました。その他、blog.css のCSSが他と衝突しないように blog- プリフィックスを付けました。

Mudança Sumário

Diff

--- catalpa/trunk/samples/blog1/css/blog.css (revision 115)
+++ catalpa/trunk/samples/blog1/css/blog.css (revision 116)
@@ -1,11 +1,11 @@
11 /*
22 * カテゴリー
33 */
4-.categories-wrapper {
4+.blog-categories-wrapper {
55 background-color: #f2f2f2;
66 border-bottom: 1px solid #ccc;
77 }
8-.categories {
8+.blog-categories {
99 display: flex;
1010 flex-wrap: wrap;
1111 flex-basis: 0;
@@ -13,7 +13,7 @@
1313 gap: 1px;
1414 background-color: #ccc;
1515 }
16-.category {
16+.blog-category {
1717 display: block;
1818 flex-grow: 1;
1919 padding: 0.25em 0.5em;
@@ -21,18 +21,18 @@
2121 color: var(--text-link-color);
2222 background-color: #f2f2f2;
2323 }
24-.category:visited {
24+.blog-category:visited {
2525 color: var(--text-link-color);
2626 }
27-.category:hover {
27+.blog-category:hover {
2828 background-color: var(--text-link-hover-color);
2929 color: white;
3030 }
31-.category.active {
31+.blog-category.active {
3232 background-color: var(--text-link-hover-color);
3333 color: white;
3434 }
35-.category .label {
35+.blog-category .label {
3636 font-size: 75%; /* 16px -> 12px */
3737 }
3838
@@ -39,7 +39,7 @@
3939 /*
4040 * カード
4141 */
42-.card-container {
42+.blog-card-container {
4343 display: flex;
4444 flex-wrap: wrap;
4545 flex-basis: 0;
@@ -47,7 +47,7 @@
4747 gap: 0;
4848 position: relative;
4949 }
50-.card-erase-horizontal-border {
50+.blog-card-erase-horizontal-border {
5151 position: absolute;
5252 box-sizing: border-box;
5353 width: 100%;
@@ -54,7 +54,7 @@
5454 height: 2px;
5555 background-color: var(--main-background-color);
5656 }
57-.card-erase-vertical-border {
57+.blog-card-erase-vertical-border {
5858 position: absolute;
5959 box-sizing: border-box;
6060 width: 2px;
@@ -62,7 +62,7 @@
6262 background-color: var(--main-background-color);
6363 }
6464
65-.card {
65+.blog-card {
6666 flex-grow: 1;
6767 width: clamp(0px, 176px, 100vw);
6868 box-sizing: border-box;
@@ -70,7 +70,7 @@
7070 padding: 16px min(16px, 2vw);
7171 border: 1px solid var(--main-background-color);
7272 }
73-.card.hidden {
73+.blog-card.hidden {
7474 overflow: hidden;
7575 max-height: 0;
7676 margin: 0;
@@ -79,7 +79,7 @@
7979 border-left: none;
8080 }
8181
82-.card .date {
82+.blog-card .date {
8383 padding-bottom: 12px;
8484 font-size: 14px;
8585 line-height: 1;
@@ -86,7 +86,7 @@
8686 color: #808080;
8787 }
8888
89-.card img {
89+.blog-card img {
9090 display: block;
9191 box-sizing: border-box;
9292 object-fit: cover;
@@ -95,21 +95,21 @@
9595 height: auto;
9696 margin: auto;
9797 }
98-.card img {
98+.blog-card img {
9999 box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
100100 transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
101101 }
102-.card img:hover {
102+.blog-card img:hover {
103103 box-shadow: 0 7px 28px rgba(0,0,0,0.25), 0 5px 10px rgba(0,0,0,0.22);
104104 transform: translateY(-4px);
105105 }
106-.card img:active {
106+.blog-card img:active {
107107 box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
108108 transform: translateY(0px);
109109 transition: transform 0.1s, box-shadow 0.1s;
110110 }
111111
112-.card .title {
112+.blog-card .title {
113113 display: block;
114114 margin: 16px 0 0 0;
115115 padding: 0;
@@ -118,18 +118,18 @@
118118 line-height: 1.5;
119119 color: var(--text-link-color);
120120 }
121-.card .title::first-letter {
121+.blog-card .title::first-letter {
122122 color: #555;
123123 font-size: 1.25rem;
124124 font-weight: Bold;
125125 color: var(--text-link-color);
126126 }
127-.card .title:visited,
128-.card .title:visited::first-letter {
127+.blog-card .title:visited,
128+.blog-card .title:visited::first-letter {
129129 color: var(--text-link-visited-color);
130130 }
131-.card .title:hover,
132-.card .title:hover::first-letter {
131+.blog-card .title:hover,
132+.blog-card .title:hover::first-letter {
133133 color: var(--text-link-hover-color);
134134 }
135135
@@ -136,17 +136,18 @@
136136 /*
137137 * ページャー
138138 */
139-.pager {
139+.blog-pager {
140140 margin: 1em 0;
141141 display: flex;
142142 flex-wrap: wrap;
143143 justify-content: space-around;
144144 flex-basis: 0;
145- padding: 0;
145+ padding-inline-start: 1em;
146+ padding-inline-end: 1em;
146147 gap: 8px;
147148 }
148-.pager .previous,
149-.pager .next {
149+.blog-pager .previous,
150+.blog-pager .next {
150151 display: block;
151152 box-sizing: border-box;
152153 padding: 1em 1.5em;
@@ -153,20 +154,20 @@
153154 background-color: #39739d;
154155 color: white;
155156 }
156-.pager .previous.grow,
157-.pager .next.grow {
157+.blog-pager .previous.grow,
158+.blog-pager .next.grow {
158159 flex-grow: 1;
159160 }
160-.pager .previous:visited,
161-.pager .next:visited {
161+.blog-pager .previous:visited,
162+.blog-pager .next:visited {
162163 color: white;
163164 }
164-.pager .previous:hover,
165-.pager .next:hover {
165+.blog-pager .previous:hover,
166+.blog-pager .next:hover {
166167 color: white;
167168 background-color: var(--text-link-hover-color);
168169 }
169-.pager .title {
170+.blog-pager .title {
170171 overflow: hidden;
171172 white-space: nowrap;
172173 text-overflow: ellipsis;
@@ -175,17 +176,17 @@
175176 /*
176177 * 記事
177178 */
178-article .header {
179+article .blog-header {
179180 margin-block-start: 3rem;
180181 margin-block-end: 3rem;
181182 }
182-article .header .date {
183+article .blog-header .date {
183184 font-size: 1.2rem;
184185 font-weight: normal;
185186 line-height: 1.0;
186187 font-style: italic;
187188 }
188-article .header .category {
189+article .blog-header .blog-category {
189190 display: inline-block;
190191 vertical-align: top;
191192 font-size: 1rem;
@@ -198,10 +199,10 @@
198199 color: #2573b8;
199200 margin-block-end: 0.25rem;
200201 }
201-article .header .category:hover {
202+article .blog-header .blog-category:hover {
202203 color: var(--text-link-hover-color);
203204 }
204-article .header .title {
205+article .blog-header .title {
205206 margin-block-start: 0;
206207 margin-block-end: 0;
207208 font-size: 2rem; /* 16px -> 32px */
@@ -208,6 +209,6 @@
208209 font-weight: bold;
209210 line-height: 1.2;
210211 }
211-article .header .title::first-letter {
212+article .blog-header .title::first-letter {
212213 font-size: 3rem;
213214 }
Show on old repository browser