styles/markdown.css · urbit.org

git.iko.soy/urbit.org

on 3869731 help sign in

urbit.org/styles/markdown.css

193 lines 3.3 kB history raw

1.markdown *:last-child:not(pre) {

2 @apply pb-0 mb-0;

5.markdown *:first-child:not(pre) {

6 @apply pt-0 mt-0;

9.markdown *:first-child figure {

10 @apply pt-0 mt-0;

11}

13.markdown p,

14.markdown ul,

15.markdown ol,

16.markdown blockquote {

17 @apply my-8;

18}

20/* Default Typography */

22.markdown h1 {

23 @apply text-4xl font-bold mt-32 mb-16;

24}

26.markdown h2 {

27 @apply text-3xl font-bold mt-24 mb-12;

28}

30.markdown h3 {

31 @apply text-2xl font-semibold mt-16 mb-8;

32}

34.markdown h4 {

35 @apply text-xl font-semibold mt-8 mb-4;

36}

38.markdown p {

39 @apply text-base md:text-lg leading-relaxed;

40}

42.markdown li {

43 @apply py-2 ml-6 text-base md:text-lg;

44}

46.markdown hr {

47 @apply my-16 border-t-2 border-wall-300;

48}

50.markdown iframe {

51 min-height: 512px;

52}

54/* Technical Typography */

56.markdown.technical h1 {

57 @apply text-3xl font-bold mt-32 mb-16;

58}

60.markdown.technical h2 {

61 @apply text-2xl font-bold mt-24 mb-12;

62}

64.markdown.technical h3 {

65 @apply text-xl font-semibold mt-16 mb-8;

66}

68.markdown.technical h4 {

69 @apply text-lg font-semibold mt-8 mb-4;

70}

72.markdown.technical p {

73 @apply text-base leading-relaxed;

74}

76.markdown.technical li {

77 @apply py-2 ml-6 text-base;

78}

80/* Imagery */

82.markdown img {

83 @apply rounded-lg w-full h-auto;

84}

86.markdown figure {

87 @apply relative my-8 z-0 w-full left-0;

88}

90@media (min-width: 768px) {

91 .markdown figure {

92 width: 125%;

93 left: -12.5%;

94 }

95}

97.markdown pre,

98.markdown pre[class*="language-"] {

99}

100

101.markdown code,

102.markdown code[class*="language-"] {

103 @apply px-2 py-0.5 bg-wall-100 rounded-md;

104}

105

106.markdown a code,

107.markdown a code[class*="language-"] {

108 @apply bg-green-100 text-green-400;

109}

110

111.markdown pre {

112 @apply block p-4 bg-wall-100 rounded-md overflow-x-auto;

113}

114

115.markdown pre > code,

116.markdown pre[class*="language-"] > code {

117 @apply p-0 bg-transparent;

118}

119

120.markdown ul {

121 list-style: outside;

122 list-style-type: disc;

123}

124

125.markdown ol {

126 list-style: outside;

127 list-style-type: decimal;

128}

129

130.markdown li a,

131.markdown h3 a,

132.markdown h2 a {

133 @apply text-green-400;

134}

135

136.markdown blockquote {

137 @apply border-l-4 border-wall-300 pl-6 italic;

138}

139.markdown blockquote cite {

140 @apply not-italic font-semibold;

141}

142

143.markdown table {

144 border-collapse: separate;

145 border-spacing: 0;

146 min-width: 350px;

147}

148

149.markdown table tr th,

150.markdown table tr td {

151 border-right-width: 2px;

152 border-right-style: solid;

153 border-bottom-width: 2px;

154 border-bottom-style: solid;

155 padding: 8px !important;

156 @apply border-wall-100;

157}

158

159.markdown table tr th:first-child,

160.markdown table tr td:first-child {

161 border-left-width: 2px;

162 border-left-style: solid;

163 @apply border-wall-100;

164}

165

166.markdown table tr th {

167 background: rgba(240, 239, 236, 0.33);

168 border-top-width: 2px;

169 border-top-style: solid;

170 text-align: left;

171 vertical-align: middle;

172 @apply border-wall-100;

173}

174

175/* top-left border-radius */

176.markdown table tr:first-child th:first-child {

177 border-top-left-radius: 8px;

178}

179

180/* top-right border-radius */

181.markdown table tr:first-child th:last-child {

182 border-top-right-radius: 8px;

183}

184

185/* bottom-left border-radius */

186.markdown table tr:last-child td:first-child {

187 border-bottom-left-radius: 8px;

188}

189

190/* bottom-right border-radius */

191.markdown table tr:last-child td:last-child {

192 border-bottom-right-radius: 8px;

193}